@charset "UTF-8";

* {margin: 0; padding: 0;}
p { line-height: 1.6; margin-bottom: 0;}
.dn {display: none;}

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

img { width: 100%; height: 100%; object-fit: cover;}

.wow { filter: blur(6px);}
.wow.animated { filter: blur(0);}
.maincont {position: relative; z-index: 3; width: 100vw; height: auto; opacity: 0; transition: all 1.5s;}
.maincont.on {height: auto;overflow: visible; opacity: 1; transition: all 1.5s;}

#root { width: 100vw; overflow-x: hidden;}
.requiredText {color:red; padding-left:.3vw;}


@media screen and (min-width: 1000px) {
.sp {display: none;}
.pc {display: block;}
.mb1 {margin-bottom: 1vw;}
.mb2 {margin-bottom: 2vw;}
.mb3 {margin-bottom: 3vw;}
.mb5 {margin-bottom: 5vw;}
.mb7 {margin-bottom: 7vw;}
.mt30 {margin-top: 40vw!important;}

.w50 { display: block; width: 50%; margin-left: auto; margin-right: auto;}
.w70 { display: block; width: 70%; margin-left: auto; margin-right: auto;}
.w100 {width: 100%!important;}
.fz50 {font-size: 50%;}
.fz70 {font-size: 70%;}
.tal {text-align: left;}
.tar {text-align: right;}
.tac {text-align: center;}
.sm {font-size: 80%!important;}
.wow {opacity: 0; transition: all 1.5s;}
.wow.animated { opacity: 1; transition: all 1.5s;}
.cp { width: 100%; padding: 0 0 1vw; text-align: center;}

body {overflow-x:hidden; background: url(../../../system_panel/uploads/images/bg.jpg) center center; background-attachment: fixed; background-size: 100% auto; font-size: 2vw; color: #101010; }
body.scene { background: url(../../../system_panel/uploads/images/bg_scene.jpg) center center; background-attachment: fixed; background-size: 100% auto;}

.section { width: 70%; margin: 0 auto 15vw; text-align: center;}
.section.full {width: 100%;}
.section img { display: block; width: 100%; height: auto;}
.section .active { filter: blur(0); opacity: 1;}
.pagettl + .section {margin-top: 15vw;}

.header {position: fixed; z-index: 5; top: -10vw; left: 0; width: 100%; height: auto; background: rgba(156,50,62,.8); padding: 1vw 2vw; box-sizing: border-box; display: flex; justify-content: space-between; opacity: 0; transition: all 1s;}
.header.in {top: 0; opacity: 1;}
.header .logo {width: 9vw; height: auto; display: block;}
.header .logo img {display: block; width: 100%; height: auto;}
.header .gmenu { width: fit-content; display: flex; justify-content: flex-end; align-items: center;}
.header .gmenu a { color: #fff; margin-left: 2vw; font-size: 51%;}
.header #spMenu {display: none;}

.pagettl {position: relative; width: 100%; height: 100vh; overflow: hidden;}
.pagettl .txt {position: absolute; z-index: 2; width: 100vw; height: fit-content; margin: 20vw auto 0; display: flex; justify-content: center; align-items: center;}
.pagettl .txt img {display: block; width: 12vw;}
.pagettl .bg {position: absolute; z-index: 1; width: 100%; height: 100vh; overflow: hidden; opacity: 0; transition: all 1s;}
.pagettl .bg.on {opacity: 1;}
.pagettl .bg img { width: 100%; height: 100%; object-fit: cover; object-position: bottom;}

.hbox h1,.hbox h2 {color: #9C323E; font-size: 170%; font-weight: bold; display: block; margin: 0 auto;}

.newslist section article {position: relative; width: 75%; height: auto; margin: 0 auto 4vw; padding: 3vw 5vw; color: #000; background: url(../../../system_panel/uploads/images/bg_1.jpg) center center; background-size: 100% auto; box-sizing: border-box;}
.newslist section article .head { width: 100%; font-size: 100%; text-align: left; display: flex; justify-content: center; flex-wrap:wrap; align-items: center; margin-bottom: 3vw;}
.newslist section article .head h1 {width: fit-content; font-size: 100%; color: #9C323E;}
.newslist section article .date {background: #9C323E; color: #FEF2C6; text-align: center; border-radius: 3vw; padding: .3vw 3vw; margin-bottom:.3vw; font-size: 70%;}
.newslist section article .main { width: 100%; margin-bottom: 2vw; font-size: 75%;}
.newslist section article .img { width: 80%; margin-left: auto; margin-right: auto;}

.footer {display: block;}
.footer .top {display: flex; justify-content: center; align-items: center; width: 100%;}
.footer .top .left {position: relative; width: 50%; height: auto; aspect-ratio:1/1;}
.footer .top .left .txt {position: absolute; z-index: 2; top: 0; left: 0; width: 100%; height: 100%; padding: 5%; box-sizing: border-box; text-align: left;}
.footer .top .left .txt .cell { background: rgba(101,38,31,.8); padding: 2vw; margin-bottom: 1vw;}
.footer .top .left .txt .cell:nth-last-of-type(1) {bottom: 0;}
.footer .top .left .txt .cell .logo {display: block; width: 12vw; height: auto;}
.footer .top .left .txt .cell .tel { width: 100%; display: flex; justify-content: flex-start; align-items: center;}
.footer .top .left .txt .cell .tel .icon { width: 3vw; height: auto; display: block; margin-right: 1vw;}
.footer .top .left .txt .cell .tel a {color: #fff; font-size: 200%;}
.footer .top .left .txt .cell .list { width: 100%; display: flex; justify-content: flex-start; align-items: center; flex-wrap: wrap; color: #fff; font-size: 70%; margin-bottom: 1vw;}
.footer .top .left .txt .cell .list:nth-last-of-type(1) {bottom: 0;}
.footer .top .left .txt .cell .list .ttl { display: block; width: 30%; text-align: center; border-radius: 3vw; padding: .5vw 2vw; background: #FEF2C6; color: #9C323E;}
.footer .top .left .txt .cell .list .main {display: block; color: #fff; width: 65%; padding-left: 1vw; box-sizing: border-box;}
.footer .top .left .txt .cell p {color: #fff; font-size: 65%;}
.footer .top .left .bg { position: absolute; z-index: 1; top: 0;left: 0; width: 100%; height: 100%; aspect-ratio:1/1;}
.footer .top .right {position: relative; width: 50%; height: auto; aspect-ratio:1/1;}
.footer .mdl {width: 100%; height: auto; overflow: hidden;}
.footer .btm {width: 100%; height: auto; overflow: hidden; padding: 3vw 0; text-align: center; background: #9C323E; color: #fff;}
.footer .btm .logo {display: block; width: 15vw; height: auto; margin-left: auto; margin-right: auto;}
.footer .btm .navi a {color: #fff; font-size: 51%; display: inline-block; margin: 0 1vw;}
.footer .cp {background: #333; padding: 1vw 0; width: 100%; text-align: center; color: #fff; font-size: 40%;}
.footer .logo img { width: 100%; height: auto!important; aspect-ratio:1/.202; object-fit: contain;}

.pagetop { position: fixed; right: 3vw; bottom: 3vw; width: 3.5vw; height: auto; z-index: 6;}

.paperbg { position: relative; padding: 6vw 3vw; background: url(../../../system_panel/uploads/images/bg_1.jpg) center center; background-size: 100% auto; box-sizing: border-box;}

.info .paperbg .deco1 {position: absolute; top: -2vw; left: -2vw; width: 6vw; height: auto;}
.info .paperbg .deco2 {position: absolute; top: -2vw; right: -2vw; width: 6vw; height: auto;}

.recruit .paperbg .deco1 {position: absolute; top: -2vw; left: -2vw; width: 9vw; height: auto;}
.recruit .paperbg .deco2 {position: absolute; top: -4vw; right: -2vw; width: 6vw; height: auto;}




.txtlist {position: relative; z-index: 2; width: 100%; height: auto; margin: 0 auto; border-top: dotted 1px #707070; font-size: 70%;}
.txtlist .flcell { position: relative; z-index: 2; display: flex; justify-content: flex-start; width: 100%; margin: 0 auto; border-bottom: dotted 1px #707070;}
.txtlist .flcell .fleft { width: 25%; text-align: left; padding: 1vw; box-sizing: border-box; color: #9C323E;}
.txtlist .flcell .fright { width: 75%; text-align: left; padding: 1vw; box-sizing: border-box;}

.menulist {position: relative; width: 100%; display: flex; justify-content: flex-start; flex-wrap: wrap; gap: 7vw 3.5vw;}
.menulist .cell {position: relative; width: 30%; height: auto; padding-bottom: 1vw;}
.menulist .cell::after {position: absolute; z-index: 1; bottom: -5vw; left: -15%; margin: auto; content: ""; display: block; width: 140%; height: auto; background: url(../../../system_panel/uploads/images/bgred.png) bottom center no-repeat; background-size: auto; background-size: contain; aspect-ratio: 1/.8;}
.menulist .cell .menuMain {position: relative; z-index: 2; width: 100%; height: auto;}
.menulist .cell .menuMain img {display: block; position: relative; width: 100%; height: auto; margin-bottom: 1vw; aspect-ratio: 1/1; overflow: hidden;}
.menulist .cell .menuMain .name{font-size: 200%; font-weight: bold; color: #fff;}
.menulist .cell .menuMain .price{font-size: 200%; font-weight: bold; color: #FFF50D;}
.menulist .cell.rec::before {position: absolute; z-index: 3; top: -8%; left: -22%; margin: auto; content: ""; display: block; width: 75%; height: auto; background: url(../../../system_panel/uploads/images/label.png) bottom center no-repeat; background-size: auto; background-size: contain; aspect-ratio: 1/.4;}

iframe {width: 100%; height: 30vw;}


/*form*/
.form {font-size: 70%;}
.form .formRow input[type="text"],.form .formRow input[type="email"],button,textarea { -webkit-appearance: none; -moz-appearance: none; appearance: none; background: transparent; border: none; border-radius: 0; font: inherit; outline: none; border:solid 1px #ccc;}
.form {width: 100%; margin: 0 auto;}
.form .forminside {width: 70%; margin: 0 auto;}
.form .formRow { display: flex; justify-content: flex-start; margin: 0 0 2vw; padding: 0; text-align: left;}
.form .formTh {width: 35%;}
.form .formTd {width: 65%;}
.form .formRow .radioarea {display: flex;}
.form .formRow input[type="text"],.form .formRow input[type="email"],.form .formRow select,.form .formRow textarea {width: 100%; background: #fff;}
.form .formRow textarea {height: 10em;}
.form .formRow .radioArea {display: flex;}
.form p {margin-bottom: 0;}
.form .pp { display: block;width: 100%;height: 20vw; margin: 2vw auto; overflow: auto; border: solid 1px #fafafa;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 2vw; border-radius: 20px; }
.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; background: #000;}
.form #submit.active {opacity: 1;}
.formTd .d-inline-block {display:block!important; width:fit-content; margin-right: 2vw;}
.formTd .d-inline-block input { margin-right: .4vw;}
/*form*/

.recruitsubttl {position: relative; width: 100%; height: auto; aspect-ratio:1/.6;}
.recruitsubttl .txt {position: absolute; z-index: 2; width: 100vw; height: fit-content; margin: 23vw auto 0; display: flex; justify-content: center; align-items: center;}
.recruitsubttl .txt img {display: block; width: 65vw;}
.recruitsubttl .bg {position: absolute; z-index: 1; width: 100%; height: auto; overflow: hidden; aspect-ratio:1/.396;}
.recruitsubttl .bg img { width: 100%; height: 100%; object-fit: cover; object-position: top;}

.odensubttl {position: relative; width: 100%; height: auto; aspect-ratio:1/.396; margin-bottom: 10vw;}
.odensubttl .txt {position: absolute; z-index: 2; width: 100vw; height: auto; aspect-ratio:1/.396; margin: 0 auto 0; display: flex; justify-content: center; align-items: center;}
.odensubttl .txt img {display: block; width: 15vw; height: auto;}
.odensubttl .bg {position: absolute; z-index: 1; width: 100%; height: auto; overflow: hidden; aspect-ratio:1/.396;}
.odensubttl .bg img { width: 100%; height: 100%; object-fit: cover; object-position: top;}

.menu1 .odensubttl {margin-bottom: 0;}
.menu1 .odensubttl .txt {position: absolute; z-index: 2; width: 100vw; height: auto; aspect-ratio:1/.396; margin: 0 auto 0; display: flex; justify-content: flex-start; align-items: center;}
.menu1 .odensubttl .txt img {display: block; width: 15vw; height: auto; margin-left: 16vw;}

.triphotocell {position: relative; display: flex; justify-content: center; align-items: center; width: 100%; padding-top: 1vw; }
.triphotocell .cell {position: relative; width: 30%; aspect-raito:1/.75; padding: .6vw; box-sizing: border-box; background: url(../../../system_panel/uploads/images/bg_1.jpg) center center; background-size: 100% auto;}
.triphotocell .cell:before {position: absolute; z-index: 2; top: -1vw; left: 30%; display: block; content:""; width: 38%; height: 4vw; background: url(../../../system_panel/uploads/images/tape.png) center center; background-size: 100% auto;}
.triphotocell .cell:nth-of-type(1) {transform: rotate(-4deg); z-index: 1; margin-right: -3vw;}
.triphotocell .cell:nth-of-type(2) {transform: rotate(1deg); margin-top: 3vw; z-index: 2;}
.triphotocell .cell:nth-of-type(3) {transform: rotate(3deg); z-index: 1; margin-left: -3vw;}

.imgttl {width: 50%; margin-right: auto; margin-left: auto;}
.descTxt {font-size: 80%; color: #9C323E; line-height: 1.4; display: block; width: 80%; margin-right: auto; margin-left: auto;}


.basement {position: relative; width: 100%; height: auto; aspect-ratio:1/.5; margin-bottom: 3vw;}
.basement .txt {position: absolute; z-index: 2; width: 100vw; height: auto; aspect-ratio:1/.5; margin: 0 auto 0; display: flex; justify-content: center; align-items: center;}
.basement .txt img {display: block; width: auto; height: 10vw;}
.basement .bg {position: absolute; z-index: 1; width: 100%; height: auto; overflow: hidden; aspect-ratio:1/.5;}
.basement .bg img { width: 100%; height: 100%; object-fit: cover; object-position: top;}

.menunavi {position: relative; display: flex; justify-content: center; align-items: space-between; width: 90%; margin: 0 auto 3vw; }
.menunavi .cell {display: block; position: relative; width: 30%; aspect-raito:1/.92; padding: .6vw; box-sizing: border-box; background: url(../../../system_panel/uploads/images/bg_1.jpg) center center; background-size: 100% auto;}
.menunavi .cell:before {position: absolute; z-index: 2; top: -1vw; left: 30%; display: block; content:""; width: 38%; height: 4vw; background: url(../../../system_panel/uploads/images/tape.png) center center; background-size: 100% auto;}
.menunavi .cell:nth-of-type(1) {transform: rotate(-3deg); z-index: 1;}
.menunavi .cell:nth-of-type(2) {transform: rotate(-1deg); z-index: 2;}
.menunavi .cell:nth-of-type(3) {transform: rotate(3deg); z-index: 1;}

#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; background: rgba(0,0,0,.8); transition: all .6s;}
#galleryMain.on { opacity: 1; z-index: 30;}
#galleryMain .img { display: block; width: 60%; max-width: 60%; overflow: hidden; margin: 0; opacity: 0; z-index: -1;}
#galleryMain .img.on { opacity: 1; z-index: 1;}
#galleryMain img { width: 100%; height: 100%; object-fit: contain; cursor: pointer;}

.printingslist { display: flex; justify-content: flex-start; flex-wrap: wrap; width: 100%; gap:1vw;}
.printingslist .cell {position: relative; display: block; width: 23%; height: auto; overflow: hidden; aspect-ratio: 1/.667;}
.printingslist .cell img {display: block; position: absolute; top: 0; bottom: 0; right: 0; left: 0; transform: scale(1); transition: all 1s; width: 100%; height: 100%; object-fit: cover;}
.printingslist .cell:hover img {transform: scale(1.1); transition: all 1s;}
.printingslist .cell:nth-of-type(3n) {margin-right: 0;}

.closebtn { position: absolute;  width: 2.5vw; height: 2.5vw; display: block; margin: auto; top: 6vw; right: 15vw;}
.closebtn p { position: absolute; display: block; left: 0; width: 100%; height: 1px; background: #fff; font-size: 0.1em; box-sizing: border-box;}
.closebtn p:nth-of-type(1) { transform: translateY(.25vw) rotate(-45deg); }
.closebtn p:nth-of-type(2) { transform: translateY(0.29vw) rotate(45deg); }

.reccoarea {position: relative; width: 100%; height: auto; padding: 5vw 0; margin-bottom: 10vw; background: url(../../../system_panel/uploads/images/wood.jpg) repeat-y center center; background-size: 100% auto;}
.reccoarea .deco1 {position: absolute; z-index: 2; top: 7vw; left: 11vw; width: 10vw; height: auto;}
.reccoarea .deco2 {position: absolute; z-index: 2; top: 7vw; right: 11vw; width: 7vw; height: auto;}
.reccoarea .deco3 {position: absolute; z-index: 2; bottom: 7vw; right: 11vw; width: 7vw; height: auto;}
.reccoarea .mainCell {position: relative; z-index: 1; width: 70%; margin: 0 auto;}

.reccoarea .mainCell .panel {position: relative; display: flex; justify-content: center; flex-wrap: wrap; gap:2vw; width: 100%; }
.reccoarea .mainCell .panel .cell {position: relative; width: 45%; aspect-raito:1/.75; padding: 1vw; box-sizing: border-box; background: url(../../../system_panel/uploads/images/bg_1.jpg) center center; background-size: 100% auto;}
.reccoarea .mainCell .panel .cell:before {position: absolute; z-index: 2; top: -1vw; left: 30%; display: block; content:""; width: 38%; height: 4vw; background: url(../../../system_panel/uploads/images/tape.png) center center; background-size: 100% auto;}
.reccoarea .mainCell .panel .cell .ttl {width: 100%; display: flex; justify-content: space-between; margin-bottom: 1vw; color: #9C323E;}
.reccoarea .mainCell .panel .cell .ttl .left {width: fit-content; text-align: left;}
.reccoarea .mainCell .panel .cell .ttl .right {width: fit-content; text-align: right;}
.reccoarea .mainCell .panel .cell .desc { text-align: left; color: #B96E17; font-size: 70%;}

.textmenu {position: relative; width: 70%; margin: 0 auto; display: block;}
.textmenu .cell {position: relative; border-bottom: dotted 1px rgba(0,0,0,.7);}
.textmenu .cell .menuMain {position: relative; width: 100%; height: auto; padding: 1.5vw 0; position: relative; width: 100%; margin-left: auto;margin-right: auto; display: flex; justify-content: flex-start; align-items: center; text-align: left; font-size: 50%; border-top: dotted 1px rgba(0,0,0,.7);}
.textmenu .cell .menuMain img {display: block; position: relative; width: 7.5%; height: auto; margin-right: 1vw;}
.textmenu .cell .menuMain .name{display: flex; font-size: 200%; font-weight: bold; color: #9C323E;}
.textmenu .cell .menuMain .price{flex:1;font-size: 200%; text-align: right;}
.textmenu .cell .menuMain.rec::before {position: absolute; z-index: 2; content: ""; top: 0; bottom: 0; margin: auto 0; left: -1vw; display: block; margin-left: 1vw; width: 8%; height: auto; background: url(../../../system_panel/uploads/images/label.png) bottom center no-repeat; background-size: auto; background-size: contain; aspect-ratio: 1/1;}
.textmenu .cell .menuMain.rec .name {padding-left: 4vw; }

.menu3 .reccoarea .mainCell .panel {position: relative; display: flex; justify-content: center; width: 100%; margin: 0 auto; }
.menu3 .reccoarea .mainCell .panel .cell { display: flex; justify-content: center; align-items: center; position: relative; width: 100%; padding: 5vw; box-sizing: border-box; background: url(../../../system_panel/uploads/images/bg_1.jpg) center center; background-size: 100% auto;}
.menu3 .reccoarea .mainCell .panel .cell:before {display: none;}
.menu3 .reccoarea .mainCell .panel .label {position: absolute; z-index: 3; top: 2vw; left: 2vw; width: 6vw; height: auto;}
.menu3 .reccoarea .mainCell .panel .cell .img { width: 28%; margin-right: 4%;}
.menu3 .reccoarea .mainCell .panel .cell .txt { width: 68%; text-align: left; font-size: 80%;}
.menu3 .reccoarea .mainCell .panel .cell .ttl {width: 100%; display: block; margin-bottom: 1vw; color: #9C323E;}
.menu3 .reccoarea .mainCell .panel .cell .ttl .left {width: fit-content; text-align: left;}
.menu3 .reccoarea .mainCell .panel .cell .ttl .right {width: fit-content; text-align: right;}
.menu3 .reccoarea .mainCell .panel .cell .desc { text-align: left; color: #B96E17; font-size: 70%;}

.scenecell { position: relative; width: 90%; display: flex; justify-content: flex-start; align-items: center; margin: 0 auto 10vw;}
.scenecell:nth-of-type(even) {flex-direction: row-reverse;}
.scenecell .txt {position: relative; z-index: 2; width: 50%;}
.scenecell .txt .ttl { text-align: left; width: auto; margin-bottom: 1vw;}
.scenecell .txt .ttl img { width: auto; height: 7vw; display: block;}
.scenecell .txt .txtmain { padding: 3vw; box-sizing: border-box; background: url(../../../system_panel/uploads/images/bg_1.jpg) center center; background-size: 100% auto;}
.scenecell .txt .txtmain p { text-align: left; font-size: 80%;}
.scenecell:nth-of-type(odd) .img {position: absolute; z-index: 1; width: 65%; top: 0; right: 0; transform: rotate(-2deg);}
.scenecell:nth-of-type(even) .img {position: absolute; z-index: 1; width: 65%; top: 0; left: 0; transform: rotate(2deg);}
.scenecell .img .cell {display: block; position: relative; width: 100%; aspect-raito:1/.92; padding: .6vw; box-sizing: border-box; background: url(../../../system_panel/uploads/images/bg_1.jpg) center center; background-size: 100% auto;}
.scenecell .img .cell:before {position: absolute; z-index: 2; top: -2vw; left: 30%; display: block; content:""; width: 38%; height: 4vw; background: url(../../../system_panel/uploads/images/tape.png) center center; background-size: 100% auto;}
.scenecell .img .cell img {}


.kv {position: relative; z-index: 2; width: 100vw; height: auto; aspect-ratio:1/.474;}
.kv .txt {position: absolute; z-index: 2; width: 100vw; height: fit-content; margin: 15vw 0 0 9vw; box-sizing: border-box; display: flex; justify-content: center; align-items: center; flex-direction: column; }
.kv .txt img {display: block; width: 15vw; height: auto;}
.kv .bg {position: absolute; z-index: 1; width: 100vw; height: auto; overflow: hidden; aspect-ratio:1/.474;}

.kvsub {position: relative; z-index: 1; width: 100vw; height: auto; aspect-ratio:1/.3; overflow: hidden;}
.kvsub .txt {position: absolute; z-index: 3; width: fit-content; height: fit-content; margin: 3vw 0 0 5vw; box-sizing: border-box; display: block;}
.kvsub .txt img {display: block; width: 15vw; height: auto;}
.kvsub .main { position: absolute; z-index: 2; top: 5%; left: 7%; width: 86%; height: 90%; background: rgba(156,50,62,.8); padding: 2vw; box-sizing: border-box; display: flex; justify-content: space-between;}
.kvsub .main .left { width: 40%; margin-left: 17%; text-align: left; color: #fff; font-size: 87%;}
.kvsub .main .right { width: 40%;}
.kvsub .main .right img { width: 100%; height: auto;}
.kvsub .bg {position: absolute; z-index: 1; width: 100vw; height: auto; overflow: hidden; aspect-ratio:1/.3;}

.maincont.index .reccoarea {margin-bottom: 0;}
.maincont.index .reccoarea .deco1 {position: absolute; z-index: 2; top: 3vw; left: 10vw; width: 15vw; height: auto;}
.maincont.index .reccoarea .deco2 {position: absolute; z-index: 2; top: 3vw; right: 10vw; width: 13vw; height: auto;}
.maincont.index .reccoarea .mainCell {position: relative; z-index: 1; width: 90%; margin: 0 auto;}

.maincont.index .reccoarea .mainCell .panel {position: relative; display: flex; justify-content: center; flex-wrap: wrap; gap:2vw; width: 100%; }
.maincont.index .reccoarea .mainCell .panel .cell {position: relative; width: 30%; aspect-raito:1/.75; padding: 1vw; box-sizing: border-box; background: url(../../../system_panel/uploads/images/bg_1.jpg) center center; background-size: 100% auto;}
.maincont.index .reccoarea .mainCell .panel .cell:before {position: absolute; z-index: 2; top: -1vw; left: 30%; display: block; content:""; width: 38%; height: 4vw; background: url(../../../system_panel/uploads/images/tape.png) center center; background-size: 100% auto;}
.maincont.index .reccoarea .mainCell .panel .cell .ttl {width: 100%; display: flex; justify-content: space-between; margin-bottom: 1vw; color: #9C323E;}
.maincont.index .reccoarea .mainCell .panel .cell .ttl .left {width: fit-content; text-align: left;}
.maincont.index .reccoarea .mainCell .panel .cell .ttl .right {width: fit-content; text-align: right;}
.maincont.index .reccoarea .mainCell .panel .cell .desc { text-align: left; color: #B96E17; font-size: 70%;}
.maincont.index .reccoarea .mainCell .panel .cell .label { position: absolute; z-index: 3; top: -1vw; left: -3vw; width: 9vw; height: auto;}

.maincont.index .reccoarea .mainCell:nth-of-type(2) {margin-top: 7vw; }
.maincont.index .reccoarea .mainCell:nth-of-type(2) .imgttl {width: 25%;}
.maincont.index .reccoarea .mainCell:nth-of-type(2) .menunavi .cell { padding: 0; margin: 0 auto;}

.indexrecruit {position: relative; z-index: 1; width: 100vw; height: auto; aspect-ratio:1/.243; overflow: hidden;}
.indexrecruit .txt {position: absolute; z-index: 2; width: 100vw; height: auto; aspect-ratio:1/.243; overflow: hidden; display: flex; justify-content: center; align-items: center; flex-direction: column;}
.indexrecruit .txt .ttl { width: 30%; height: auto; margin: 10vw auto 0; text-align: center;}
.indexrecruit .txt .ttl img { display: block; width: 100%; height: auto; object-fit: cover;}
.indexrecruit .txt a {display: block; width: fit-content; height: auto; padding: .5vw 3vw; border-radius: 3vw; border: solid 2px #FEF2C6; background: #9C323E; opacity: 1; transition: all .5s;}
.indexrecruit .txt a:hover {opacity: .8; transition: all .5s;}
.indexrecruit .txt a p { color: #fff; font-size: 120%; font-weight: bold;}
.indexrecruit .bg {position: absolute; z-index: 1; width: 100vw; height: auto; aspect-ratio:1/.243; overflow: hidden;}
.indexrecruit .bg img { display: block; width: 100%; height: 100%; object-fit: cover;}

.indexscenearea {position: relative; width: 100%; height: auto; padding: 4vw; margin: 0 auto; background: url(../../../system_panel/uploads/images/bg_scene.jpg) center center; background-attachment: fixed; background-size: 100% auto;}
.indexscenearea .box { width: 90%; margin: 0 auto; position: relative; display: flex; justify-content: center; align-items: flex-start;}
.indexscenearea .box .left { width: 20%; height: auto;}
.indexscenearea .box .left img { display: block; width: 90%; margin: 0 auto; }
.indexscenearea .box .right { width: 80%;	}
.indexscenearea .box .right .photo { position: relative; display: flex; justify-content: center; flex-wrap: wrap; width: 100%; gap:2vw;}
.indexscenearea .box .right .photo .cell {position: relative; width: 45%; aspect-raito:1/.75; padding: 1vw; box-sizing: border-box; background: url(../../../system_panel/uploads/images/bg_1.jpg) center center; background-size: 100% auto;}
.indexscenearea .box .right .photo .cell:before {position: absolute; z-index: 2; top: -1vw; left: 30%; display: block; content:""; width: 38%; height: 4vw; background: url(../../../system_panel/uploads/images/tape.png) center center; background-size: 100% auto;}
.indexscenearea .box .right .photo .cell:nth-of-type(1) { transform: rotate(3deg);}
.indexscenearea .box .right .photo .cell:nth-of-type(2) { transform: rotate(-3deg);}
.indexscenearea .box .right .photo .cell:nth-of-type(3) { transform: rotate(1deg);}
.indexscenearea .box .right .photo .cell:nth-of-type(4) { transform: rotate(-1deg);}
.indexscenearea .box .right .photo .cell:nth-of-type(5) { transform: rotate(2deg);}
.indexscenearea .box .right .txt {display: block; text-align: left; margin-top: 3vw;}
.indexscenearea .box .right .txt p { color: #fff; font-size: 70%;}

.indexnewsarea {}
.indexnewsarea .section {position: relative; width: 75%; height: 40vw; padding: 4vw; margin: 0 auto;}
.indexnewsarea .section .main { position: relative; z-index: 1; width: 51vw; height: 21vw; left: 0; top: 6vw; background: url(../../../system_panel/uploads/images/bg_news.png) center center; background-size: 100% auto;padding:3vw; box-sizing: border-box; text-align: left;}
.indexnewsarea .section .main article {width: 100%; margin-bottom: 1vw;}
.indexnewsarea .section .main article a { display: flex; justify-content: flex-start; align-items: center;}
.indexnewsarea .section .main article a .date { font-size: 60%; color: #9C323E; margin: 0 .5em 0 0; display: block; width: fit-content; border: solid 1px #9C323E; border-radius: 50%; padding: .3vw 1vw;}
.indexnewsarea .section .main article a h1 { font-size: 60%; color: #9C323E; margin-bottom: 0;}
.indexnewsarea .section .ttl {position: absolute; z-index: 2; top: 5vw; right: 0; width: 35%; height: auto;}

.footerdeco1 {position: fixed; right: 4vw; bottom: -20vw; width: 20vw; height: auto; z-index: 6; transition: all 1s;}
.footerdeco2 {position: fixed; right: 12vw; bottom: -11vw; width: 13vw; height: auto; z-index: 7; transition: all 1s;}
.footerdeco3 {position: fixed; right: 7vw; bottom: -9vw; width: 9vw; height: auto; z-index: 8; transition: all 1s;}

.footerdeco1.on {bottom: 15vw;}
.footerdeco2.on {bottom: 11vw;}
.footerdeco3.on {bottom: 9vw;}

.videocont{ width: 100%; height: 100vh; position: absolute; top: 0; left: 0; overflow: hidden; z-index: -1; aspect-ratio:1/.474;}
.videocont video{ width: 100%; height: auto; object-fit: cover; aspect-ratio:1/.474; }
}

















/* gjs-dashed */
.gjs-dashed * {padding: 1vw!important;}
.gjs-dashed .wow {opacity: 1!important;}
.gjs-dashed .dn {display: block!important;}
.gjs-dashed .header {top: 1vw!important; opacity: 1!important;}
.gjs-dashed .footer { opacity: 1!important;}
.gjs-dashed #spMenu  {opacity: 1!important;}
.gjs-dashed .section { width: 100%; padding: 10px;}
.gjs-dashed .maincont { width: 100%!important; margin: 10px auto!important; opacity: 1!important;}
.gjs-dashed .pagettl .bg {opacity: 1!important;}
.gjs-dashed .spnavi { opacity: 1!important; z-index: 20!important; right: 0!important;}
.gjs-dashed .spnavi a {filter: blur(0); margin: 0!important; padding: .5vw!important;}
.gjs-dashed .spnavi a p {padding: 0!important; margin: 0!important;}
.gjs-dashed .image-container {position: relative; z-index: 1;}
.gjs-dashed .image-container img {position: relative; display: block!important;opacity: 1!important;}
.gjs-dashed #progress {z-index: -100!important;}
.gjs-dashed .productlist .item .imgbox .sub {display: block!important;}
.gjs-dashed .productlist .item .imgbox .sub a {display: block!important;}
.gjs-dashed .newslist .webgene-blog article { filter: blur(0); opacity: 1;}
.gjs-dashed .box p { opacity: 1!important; filter: blur(0)!important; margin-bottom: 0!important;}
.gjs-dashed .hbox h2 { opacity: 1!important; filter: blur(0)!important;}
.gjs-dashed .menu .cell { opacity: 1!important; filter: blur(0)!important;}
.gjs-dashed .slidebox {position: relative; width: 100%; height: auto; aspect-ratio:auto; overflow: auto;}
.gjs-dashed .slide {position: relative; width: 100%;height: fit-content;}
.gjs-dashed .slide img { display: block; width: 100%; height: auto; aspect-ratio:1/.6; padding: 0;}
.gjs-dashed img { width: 100%; height: auto; object-fit: cover;}
.gjs-dashed #galleryMain,.gjs-dashed #productMain {display: none!important; z-index: -100!important;}
.gjs-dashed .gjs-hover-reference {display: none!important;}