@charset "UTF-8";
*{margin: 0; padding: 0; border: none;}
img { display: block; width: 100%; height: 100%; object-fit: contain;}
a:active {color: #000; text-decoration: none;}
a:link {color: #000; text-decoration: none;}
a:hover {color: #000; text-decoration: none;}
a:visited{color: #000; text-decoration: none;}

.cp {text-align: center; margin: 2vw auto;}

.bnr{background-color: #968AF6; display: flex; justify-content: center; position: relative;}
.bnr_link{display: inline-block; padding: 40px 16px; margin: 0 auto; position: relative; z-index: 9; display: flex; justify-content: center;}
.bnr_link img{max-width: 70%;}
.bnr .bgbtm{position: absolute; bottom: 0; left: 0; width: 100%; height: auto; object-fit: cover;}
.bnr .bgtop{position: absolute; top: 0; left: 0; width: 100%; height: auto; object-fit: cover;}

.recruitinfo_btnlist{
    display: flex;
    justify-content: space-between;
    margin-top: 5vw;
}
.recruitinfo_btnitem{
    width: 49%;
    text-align: center;
    cursor: pointer;
    list-style: none;
}
.recruitinfo_btn{
    display: block;
    padding: 0.5em 0;
    border: solid 6px #000;
    font-weight: bold;
    font-size: 140%;
}
.recruitinfo_btnitem:first-child .recruitinfo_btn{
    background-color: #F599C2;
}
.recruitinfo_btnitem:last-child .recruitinfo_btn{
    background-color: #69CCC9;
}
@media screen and (max-width: 999px) {
    .recruitinfo_btn{
        font-size: 100%;
    }
}
@media screen and (max-width: 767px) {
    .recruitinfo_btnlist{
        flex-direction: column;
        gap: 16px;
    }
    .recruitinfo_btnitem{
        width: 100%;
    }
    .recruitinfo_btn{
        font-size: 130%;
    }
}

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

body {margin: 0; padding: 0; font-family: sans-serif; font-size: 3.5vw; font-weight: 700;  background: #F9FB7C;}
header {position: fixed; z-index: 10; top: 0; left: 0; width: 100%; padding: 0; background: #fff; border: solid 3px #000; box-sizing: border-box; display: flex; justify-content: space-between; font-weight: 700;}
header .logo {color: #000; flex:1; margin-left: 3vw; padding: 1vw 0; font-size: 70%; display: flex; justify-content: flex-start; align-items: center;}
header .logo img {display: block; width: 20vw; height: auto; margin-right: 3vw;}
header .gmenu { display: none;}
header .contact {display: flex; justify-content: center; align-items: center; padding: 0 3vw; background: #FF5E90; border-left: solid 3px #000; border-right: solid 3px #000;}
header .contact p {color: #fff;}


#spMenu { display: flex; justify-content: center; align-items: center; width: 6.5vw; height: 3.5vw; transition: all 1s; padding: 0 1vw; align-items: center; margin: 0; opacity: 1; transition: all .6s;}
#spMenu .menu-trigger { position: relative; width: 6.5vw; height: 3.5vw; display: block; justify-content: center; align-items: center; margin: auto; top: 0; bottom: 0; left: 0; right: 0; }

.menu-trigger,.menu-trigger p { display: block; transition: all .4s; box-sizing: border-box; }
.menu-trigger.down p { position: absolute; left: 0; width: 100%; height: 1px; background: #000; font-size: 0.1em; }
.menu-trigger p { position: absolute; left: 0; width: 100%; height: 2px; background: #000; font-size: 0.1em; box-shadow: 0px 0px 8px rgba(0,0,0,0.2); }
.menu-trigger p:nth-of-type(1) { top: 2vw; }
.menu-trigger p:nth-of-type(2) { top: 3.3vw; }
.menu-trigger.active p:nth-of-type(1) { transform: translateY(1.2vw) rotate(-45deg); background: #000; }
.menu-trigger.active p:nth-of-type(2) { transform: translateY(-.05vw) rotate(45deg); background: #000; }
.spnavi { display: flex; justify-content: flex-start; align-items: center; flex-direction: column; position: fixed; top: 0; left: 0; z-index: -21; opacity: 0; background: rgba(255,255,255,.9); width: 100%; height: 100vh; padding-top: 20vw; -webkit-box-sizing: border-box; box-sizing: border-box; overflow: hidden; transition: all 1s; }
.spnavi.active { opacity: 1; z-index: 8;}
.spnavi a {position: relative; display: block; width: 100%; color: #000; font-size: 150%; font-weight: bold; margin: 0 auto 0; text-align: center;filter: blur(1.5rem); transition: all 1s;}
.spnavi a p {font-weight: 700;}
.spnavi.active a {filter: blur(0); transition: all 1s; margin-top: 4vw;}





main {position: relative; z-index: 2;}


.faq {background: #69CCC9;}
.entryform {background: #DDC7FF;}

.kv { width: 100%; position: relative; height: auto; aspect-ratio:1/.7; overflow: hidden;}
.kv .txt { position: absolute; top: 5vw; left: 0; z-index: 4; width: 100%; height: auto; overflow: hidden; aspect-ratio:1/.7;}
.kv .txt img:nth-child(1) {display: block; position: absolute; top: 16%; left: 1%; z-index: 1; height: 22vw; width: auto;}
.kv .txt img:nth-child(2) {display: block; position: absolute; top: 45%; left: 2%; z-index: 2; height: 23vw; width: auto;}
.kv .txt img:nth-child(3) {display: block; position: absolute; top: 49%; left: 1%; z-index: 3; height: 25vw; width: auto;}
.kv .deco { position: absolute; top: 0; left: 0; z-index: 3; width: 100%; height: auto; overflow: hidden; aspect-ratio:1/.7;}
.kv .deco img:nth-child(1) {display: block; position: absolute; top: 0; left: 0; z-index: 1; height: 22vw; width: auto;}
.kv .deco img:nth-child(2) {display: block; position: absolute; bottom: 2%; left: 3%; z-index: 2; height: 17vw; width: auto;}
.kv .deco img:nth-child(3) {display: block; position: absolute; bottom: -2vw; right: 1%; z-index: 3; height: 61vw; width: auto;}
.kv .maincont { position: absolute; top: 10vw; left: 0; z-index: 2; width: 100%; height: auto; aspect-ratio:1/.6; overflow: hidden; display: flex; justify-content: center; align-items: center;}
.kv .maincont .linebox { margin-top: 8vw;position: relative; display: block; width: 80%; height: 30vw; border-radius: 2vw; overflow: hidden; border: solid 3px #000; background: url(https://craftfix.co.jp/wp-content/themes/craftfix/images/recruit/bg_line.webp);}
.kv .bg { position: absolute; top: 0; left: 0; z-index: 1; width: 100%; height: auto; aspect-ratio:1/.7; overflow: hidden;}
.kv .bg img { display: block; width: 100%; height: 100%; object-fit: cover;}

section { width: 100%; position: relative; height: auto; overflow: hidden; }
section.sec1 {background: #968AF6;}
section.sec2 {background: #F599C2;}
section.sec3 {background: #DDC7FF;}
section.sec4 {}
section .ttl {position: absolute; top: 10vw; left: 0; right: 0; margin: auto; width: fit-content; height: 10vw; z-index: 5; }
section .ttl .subttl {padding: 1vw; background: #8BF4E7; border: solid 3px #000; text-align: center; width: fit-content; margin: 0 auto .5vw; font-size: 100%; font-weight: 900;}
section .ttl img { display: block; margin: auto; width: auto; height: 10vw;}
section .bg { position: absolute; top: 0; left: 0; z-index: 1; width: 100%; height: auto; aspect-ratio:1/.677; overflow: hidden;}
section .bg img { display: block; width: 100%; height: 100%; object-fit: cover;}
section .maincont {position: relative; top: 0; left: 0; z-index: 2; width: 100%; height: auto; ; overflow: hidden; display: flex; justify-content: center; align-items: center; flex-direction: column;}
section .maincont .linebox { margin-top: 13vw; position: relative; display: block; width: 80%; height: auto; border-radius: 2vw; overflow: hidden; border: solid 3px #000; background: url(https://craftfix.co.jp/wp-content/themes/craftfix/images/recruit/bg_line.webp); background-size: 10px auto;}
section .maincont .linebox .inner { padding: 8vw; }

.inner { padding: 7vw 1vw!important; box-sizing: border-box;}


.sec1 { padding: 10vw 0;}
.sec1 .maincont {}
.sec1 .bgtop {position: absolute; top: 0; left: 0; width: 100%; height: auto; object-fit: cover;}
.sec1 .bgbtm {position: absolute; bottom: 0; left: 0; width: 100%; height: auto; object-fit: cover;}
.sec1 .deco_lt { position: absolute; left: 0; top: 15vw; width: 15vw; height: auto; display: block; z-index: 5;}
.sec1 .deco_rt { position: absolute; right: 0; top: 20vw; width: 15vw; height: auto; display: block; z-index: 5;}
.sec1 .deco_lb { position: absolute; left: 0; bottom: 5vw; width: 15vw; height: auto; display: block; z-index: 5;}
.sec1 .deco_rb { position: absolute; right: 0; bottom: 5vw; width: 15vw; height: auto; display: block; z-index: 5;}
.sec1 .ttl .subttl {background: #8BF4E7;}
.sec1 figure {margin-bottom: 5vw;}
.sec1 .sp { position: absolute; right: 1%; top: 0; width: 30vw; height: auto; display: block; z-index: 5;}
.sec1 .maincont .linebox .head {background: #FF5E90;}
.sec1 .maincont .linebox img {display: block; width: 80%; margin: 0 auto 8vw;}
.sec1 .maincont .linebox img:nth-last-of-type(1) {margin-bottom: 0;}

.sec2 {}
.sec2 .maincont .linebox{ margin-top: 25vw;}
.sec2 .bg {}
.sec2 .bg {position: relative; width: 100%; height: 100%;}
.sec2 .bgtop {position: absolute; top: 0; left: 0; width: 100%; height: auto; object-fit: cover;}
.sec2 .bgbtm {position: absolute; bottom: 0; left: 0; width: 100%; height: auto; object-fit: cover;}
.sec2 .ttl .subttl {background: #F9FB7C;}
.sec2 .maincont .linebox .head {background: #3EA8EA;}
.sec2 .inner { padding: 2vw 6vw!important; box-sizing: border-box;}
.sec2 .maincont .sec2btm {display: block; width: 80%; margin: 5vw auto 10vw;}
.sec2 .deco_lt {position: absolute; top: 21vw; left: 2vw; width: 15vw; height: auto; z-index: 5;}
.sec2 .deco_rt {position: absolute; top: 1vw; right: 0; width: 20vw; height: auto; z-index: 5;}
.sec2 .deco_lb{ position: absolute; bottom: 1vw; left: 1vw; width: 45vw; height: auto; z-index: 5;}
.sec2 .deco_rb {position: absolute; top: 105vw; right: 1vw; width: 28vw; height: auto; z-index: 5;}



.sec3 .deco img { position: absolute; right: 0; bottom: 0; width: 15vw; height: auto; display: block; z-index: 5;}
.sec3 .ttl .img {width: 70%; height: auto;}
.sec3 .ttl .subttl {background: #F9FB7C;}
.sec3 .sp { position: absolute; right: 5%; top: 1vw; width: 20vw; height: auto; display: block; z-index: 5;}
.sec3 .maincont .linebox {margin: 30vw auto 10vw;}
.sec3 .maincont .linebox .head {background: #3EA8EA;}
.sec3 .maincont .linebox .inner {padding: 5vw 0;}
.sec3 .inner .interview {position: relative; margin-top: 3vw;}
.sec3 .inner .interview .cell { display: none; width: 90%; margin: 0 auto;}
.sec3 .inner .interview .cell.on { display: flex; justify-content: flex-start; align-items: flex-start; flex-wrap: wrap;}
.sec3 .inner .interview .cell .left { width: 30%; margin-right: 5%; }
.sec3 .inner .interview .cell .right { width: 65%; }
.sec3 .inner .interview .cell .right .interviewttl {width: 100%; font-weight: 900; font-size: 130%; margin-bottom: 2vw; line-height: 1.3;}
.sec3 .inner .interview .cell .right .interviewmain {text-align: left; font-size: 90%; font-weight: bold;}
.sec3 .inner .interview .cell .txt {width: 100%; margin: 3vw auto;}
.sec3 .inner .interview .cell .txt .mb3 {margin-bottom: 3vw;}
.sec3 .inner .interview .cell .txt .mb3:nth-last-of-type(1) {margin-bottom: 0;}
.sec3 .inner .interview .cell .txt .q {font-weight: bold; font-size: 100%; margin-bottom: 1vw;}
.sec3 .inner .interview .cell .txt .a {line-height: 1.2; font-size: 90%;}
.sec3 .navi {position: absolute; top: 2vw; left: 5vw; display: flex;}
.sec3 .navi a {display: block; width: 4vw; height: 4vw; border: solid 3px #000; position: relative; margin-right: 2vw; background: #fff;}
.sec3 .navi a p {display: flex; justify-content: center; align-items: center; width: 4vw; height: 4vw; border: solid 3px #000; font-size: 90%; font-weight: 900; margin: 1vw 0 0 1vw;}
.sec3 .navi a:nth-child(1) p {background: #FF5E90;}
.sec3 .navi a:nth-child(2) p {background: #F9FB7C;}
.sec3 .navi a:nth-child(3) p {background: #3EA8EA;}
.sec3 .navi a:nth-child(4) p {background: #8BF4E7;}
.sec3 .bgtop {position: absolute; top: 0; left: 0; width: 100%; height: auto; object-fit: cover;}
.sec3 .bgbtm {position: absolute; bottom: 0; left: 0; width: 100%; height: auto; object-fit: cover;}

.sec4 {padding-top: 10vw;}
.sec4 .ttl {position: relative; top: 0;  height: 7vw; background: linear-gradient(transparent 30%, #FF5E90 0%); margin: 0 auto 6vw;}
.sec4 .subttl {display: flex; justify-content: center; align-items: center; width: fit-content; height: auto; padding: 1vw 4vw ; margin: 3vw auto; border: solid 5px #000; color: #000; font-size: 100%; font-weight: bold;}
.sec4 .tabbtn	{ position: relative; z-index: 3;width: fit-content; margin: 6vw auto 0;}
.sec4 .tabbtn	a {width: fit-content; font-size: 80%; font-weight: bold; padding: 1vw 2vw 4vw; margin: 0 .5vw; border-top: solid 4px #000; border-bottom: solid 4px #000; border-left: solid 4px #000; border-right: solid 4px #000; background: #69CCC9;}
.sec4 .tabbtn	a.current { background: #F599C2; border-bottom: none;}
.sec4 .maincont { position: relative; z-index: 4; display: block; margin: 12px auto 0; width: 100%; height: auto; overflow: visible;}
.sec4 .maincont .tab {display: none;}
.sec4 .maincont .tab.on {display: block;}
.sec4 .maincont .tab1 {background: #F599C2; padding: 3vw 0; border-top: solid 4px #000; position: relative;}
.sec4 .maincont .tab2 {background: #69CCC9; padding: 3vw 0; border-top: solid 4px #000; position: relative;}
.sec4 .maincont .cell {width: 80%; margin: 0 auto 0;}
.sec4 .deco1_lt { position: absolute; left: -2vw; top: -6vw; width: 22vw; height: auto; display: block; z-index: 5;}
.sec4 .deco1_rt { position: absolute; right: -2vw; top: -6vw; width: 20vw; height: auto; display: block; z-index: 5;}
.sec4 .deco1_lb { position: absolute; left: -2vw; bottom: 5vw; width: 22vw; height: auto; display: block; z-index: 5;}
.sec4 .deco1_rb { position: absolute; right: -2vw; bottom: 5vw; width: 20vw; height: auto; display: block; z-index: 5;}
.sec4 .deco2_lt { position: absolute; left: -2vw; top: -6vw; width: 22vw; height: auto; display: block; z-index: 5;}
.sec4 .deco2_rt { position: absolute; right: -2vw; top: -6vw; width: 20vw; height: auto; display: block; z-index: 5;}
.sec4 .deco2_lb { position: absolute; left: -2vw; bottom: 5vw; width: 22vw; height: auto; display: block; z-index: 5;}
.sec4 .deco2_rb { position: absolute; right: -2vw; bottom: 5vw; width: 20vw; height: auto; display: block; z-index: 5;}

.sec5 {position: relative; margin: 0 auto;}
.sec5 .maincont { width: 100%; padding: 3vw; box-sizing: border-box; display: flex; justify-content: center; flex-wrap: wrap; flex-direction: row;margin: 0 auto;}
.sec5 .maincont .cell { width: 32%; height: auto; display: block; position: relative;}

.faq {display: block; position: relative; width: 100%; background: #8BF4E7; padding: 3vw 0;}
.faq .ttlbox { width: fit-content; height: 10vw; background: linear-gradient(transparent 30%, #FF5E90 0%); margin: 0 auto 2vw;}
.faqcell {width: 90%; margin: 0 auto;}
.faqcell .cell { font-size: 100%; font-weight: 900; margin-top: 3vw; position: relative; display: block; width: 100%; height: auto; overflow: hidden; border: solid 3px #000; background: url(https://craftfix.co.jp/wp-content/themes/craftfix/images/recruit/bg_line.webp);-webkit-filter: drop-shadow(3px 3px 5px rgba(0,0,0,.3)); filter: drop-shadow(3px 3px 5px rgba(0,0,0,.3)); padding:4vw; box-sizing:border-box;}
.faqcell .cell .q {width: 100%; display: flex; justify-content: flex-start; align-items: center; margin-bottom: 2vw;}
.faqcell .cell .a {width: 100%; display: flex; justify-content: flex-start; align-items: flex-start;}
.faqcell .cell .q .ttl { width: 6vw; height: 6vw; display: flex; justify-content: center; align-items: center; border: solid 3px #000; border-radius: 50%; margin-right: 2vw; background: #968AF6; color: #fff;}
.faqcell .cell .a .ttl { width: 6vw; height: 6vw; display: flex; justify-content: center; align-items: center; border: solid 3px #000; border-radius: 50%; margin-right: 2vw; background: #fff;}
.faqcell .cell .q .ttl + p,.faqcell .cell .a .ttl + p { width: 80%; text-align: left;}

.recruitinfo {display: block; position: relative; width: 100%; padding: 3vw 0;}
.recruitinfo .ttlbox { width: fit-content; height: 10vw; background: linear-gradient(transparent 30%, #FF5E90 0%); margin: 0 auto 2vw;}
.recruitinfo {width: 90%; margin: 0 auto;}
.recruitinfo .txtlist { font-size: 100%; margin-top: 5vw; position: relative; display: block; width: 100%; height: auto; overflow: hidden; border: solid 3px #000; background: url(https://craftfix.co.jp/wp-content/themes/craftfix/images/recruit/bg_line.webp);-webkit-filter: drop-shadow(3px 3px 5px rgba(0,0,0,.3)); filter: drop-shadow(3px 3px 5px rgba(0,0,0,.3)); padding:4vw; box-sizing:border-box;}
.recruitinfo .txtlist .cell { width: 100%; display: block; margin-bottom: 7vw;}
.recruitinfo .txtlist .cell .left { width: 100%; margin-bottom: 1vw; font-weight: 900; text-align: left;line-height: 1.3; font-size: 110%;}
.recruitinfo .txtlist .cell .right { width: 100%; text-align: left; line-height: 1.3;}

.entryform {display: block; position: relative; width: 100%; background: #DDC7FF; padding: 3vw 0;}
.entryform .ttlbox { width: fit-content; height: 10vw; background: linear-gradient(transparent 30%, #FF5E90 0%); margin: 0 auto 2vw;}
.entryform .maincont { width: 90%; margin: 0 auto; font-size: 100%; font-weight: 900; margin-top: 3vw; position: relative; display: block; height: auto; overflow: hidden; border: solid 3px #000; background: url(https://craftfix.co.jp/wp-content/themes/craftfix/images/recruit/bg_line.webp);-webkit-filter: drop-shadow(3px 3px 5px rgba(0,0,0,.3)); filter: drop-shadow(3px 3px 5px rgba(0,0,0,.3)); padding:4vw; box-sizing:border-box;}
.entryform .maincont dl {width: 100%; display: block; }
.entryform .maincont dl dt { width: 100%;}
.entryform .maincont dl dt label span {color: red;}
.entryform .maincont dl dd { width: 100%; margin-bottom: 5vw;}
form dd input,form dd select,form dd textarea {padding: .4vw; border: solid 2px #000; font-weight: 900; width: 90%;}

.entryform .maincont .sendbox { text-align: center; margin: 2vw auto;}
.entryform .maincont .sendbox .pp { width: 100%; display: flex; justify-content: center; align-items: center;}
.entryform .maincont .sendbox .pp label {margin-left: 1vw;}
.entryform .maincont .sendbox .submit {border: solid 2px #000; background: #FF5E90; padding: 1vw; color: #fff; font-size: 900px; font-size: 130%;}
}






















































@media screen and (min-width: 1000px) {
#spMenu,.spnavi {display: none;}
body {margin: 0; padding: 0; font-family: "kozuka-gothic-pr6n", sans-serif; font-weight: 2vw;background: #F9FB7C;}
header {position: fixed; z-index: 10; top: 0; left: 0; width: 100%; padding: 0; background: #fff; border: solid 4px #000; box-sizing: border-box; display: flex; justify-content: space-between; font-weight: 700;}
header .logo {color: #000; flex:1; margin-left: 3vw; padding: 1vw 0; font-size: 100%; display: flex; justify-content: flex-start; align-items: center;}
header .logo img {display: block; width: 10vw; height: auto; margin-right: 1vw;}
header .gmenu { display: flex; justify-content: space-between; align-items: center;}
header .gmenu a {display: block; margin-right: 2vw;}
header .contact {display: flex; justify-content: center; align-items: center; padding: 0 3vw; background: #FF5E90; border-left: solid 4px #000;}
header .contact p {color: #fff;}

main {position: relative; z-index: 2;}

.kv { width: 100%; position: relative; height: auto; aspect-ratio:1/.6; overflow: hidden;}
.faq {background: #69CCC9;}
.entryform {background: #DDC7FF;}

.kv .txt { position: absolute; top: 13vw; left: 0; z-index: 4; width: 100%; height: auto; overflow: hidden; aspect-ratio:1/.6;}
.kv .txt img:nth-child(1) {display: block; position: absolute; top: 0; left: 5%; z-index: 1; height: 22vw; width: auto;}
.kv .txt img:nth-child(2) {display: block; position: absolute; top: 32%; left: 6%; z-index: 2; height: 23vw; width: auto;}
.kv .txt img:nth-child(3) {display: block; position: absolute; top: 45%; left: 3%; z-index: 3; height: 19vw; width: auto;}
.kv .deco { position: absolute; top: 0; left: 0; z-index: 3; width: 100%; height: auto; overflow: hidden; aspect-ratio:1/.6;}
.kv .deco img:nth-child(1) {display: block; position: absolute; top: 4%; right: auto; left: 15%; z-index: 1; height: 15vw; width: auto;}
.kv .deco img:nth-child(2) {display: block; position: absolute; bottom: 4%; left: 5%; z-index: 2; height: 12vw; width: auto;}
.kv .deco img:nth-child(3) {display: block; position: absolute; bottom: 0; right: 1%; z-index: 3; height: 54vw; width: auto;}
.kv .maincont { position: absolute; top: 0; left: 0; z-index: 2; width: 100%; height: auto; aspect-ratio:1/.6; overflow: hidden; display: flex; justify-content: center; align-items: center;}
.kv .maincont .linebox { margin-top: 8vw;position: relative; display: block; width: 80%; height: 30vw; border-radius: 2vw; overflow: hidden; border: solid 6px #000; background: url(https://craftfix.co.jp/wp-content/themes/craftfix/images/recruit/bg_line.webp);}
.kv .bg { position: absolute; top: 0; left: 0; z-index: 1; width: 100%; height: auto; aspect-ratio:1/.6; overflow: hidden;}
.kv .bg img { display: block; width: 100%; height: 100%; object-fit: cover;}


section { width: 100%; position: relative; height: auto; overflow: hidden;}
section.sec1 {background: #968AF6;}
section.sec2 {background: #F599C2;}
section.sec3 {background: #DDC7FF;}
section .ttl {position: absolute; top: 3vw; left: 0; right: 0; margin: auto; width: fit-content; height: 10vw; z-index: 5; }
section .ttl .subttl {padding: 0 1.5vw; background: #8BF4E7; border: solid 6px #000; text-align: center; width: fit-content; margin: 0 auto .5vw; font-size: 230%; font-weight: 900;}
section .ttl img { display: block; margin: auto; width: auto; height: 7vw;}
section .bg { position: absolute; top: 0; left: 0; z-index: 1; width: 100%; height: auto; overflow: hidden;}
section .bg img { display: block; width: 100%; height: 100%; object-fit: cover;}
section .maincont { position: relative; top: 0; left: 0; padding-bottom: 5vw; z-index: 2; width: 100%; height: auto; margin: auto; overflow: hidden; display: flex; justify-content: center; align-items: center; flex-direction: column;}
section .maincont .linebox { margin-top: 14vw; position: relative; display: block; width: 70%; height: auto; border-radius: 2vw; overflow: hidden; border: solid 6px #000; background: url(https://craftfix.co.jp/wp-content/themes/craftfix/images/recruit/bg_line.webp); }
section .maincont .linebox .head { width: 100%; height: 3vw; border-bottom: solid 6px #000; background: #444;}
section .maincont .linebox .inner { padding: 2vw; }
section .deco img {width: 100%; height: 100%; object-fit: contain;}


.sec1 {}
.sec1 .maincont {}
.sec1 .bg {position: relative; width: 100%; height: 100%;}
.sec1 .bgtop {position: absolute; top: 0; left: 0; width: 100%; height: auto; object-fit: cover;}
.sec1 .bgbtm {position: absolute; bottom: 0; left: 0; width: 100%; height: auto; object-fit: cover;}
.sec1 .deco_lt { position: absolute; left: 0; top: 15vw; width: 17vw; height: auto; display: block; z-index: 5;}
.sec1 .deco_rt { position: absolute; right: 0; top: 20vw; width: 17vw; height: auto; display: block; z-index: 5;}
.sec1 .deco_lb { position: absolute; left: 0; bottom: 1vw; width: 17vw; height: auto; display: block; z-index: 5;}
.sec1 .deco_rb { position: absolute; right: 0; bottom: 5vw; width: 17vw; height: auto; display: block; z-index: 5;}
.sec1 .ttl .subttl {background: #8BF4E7;}
.sec1 .sp { position: absolute; right: 8%; top: 4vw; width: 20vw; height: auto; display: block; z-index: 5;}
.sec1 .maincont .linebox .head {background: #FF5E90;}
.sec1 .maincont .linebox figure {display: block; width: 80%; margin: 0 auto 5vw;}
.sec1 .maincont .linebox figure:nth-last-of-type(1) {margin-bottom: 0;}

.sec2 {}
.sec2 .maincont {}
.sec2 .bg {}
.sec2 .bg {position: relative; width: 100%; height: 100%;}
.sec2 .bgtop {position: absolute; top: 0; left: 0; width: 100%; height: auto; object-fit: cover;}
.sec2 .bgbtm {position: absolute; bottom: 0; left: 0; width: 100%; height: auto; object-fit: cover;}
.sec2 .ttl .subttl {background: #F9FB7C;}
.sec2 .maincont .linebox .head {background: #3EA8EA;}
.sec2 .inner { padding: 2vw 6vw!important; box-sizing: border-box;}
.sec2 .maincont .sec2btm {display: block; width: 70%; margin: 5vw auto ;}
.sec2 .deco_lt {position: absolute; top: 21vw; left: 2vw; width: 15vw; height: auto; z-index: 5;}
.sec2 .deco_rt {position: absolute; top: 11vw; right: 0; width: 20vw; height: auto; z-index: 5;}
.sec2 .deco_lb{ position: absolute; bottom: 1vw; left: 2vw; width: 23vw; height: auto; z-index: 5;}
.sec2 .deco_rb {position: absolute; bottom: 1vw; right: -0.5vw; width: 22vw; height: auto; z-index: 5;}
.sec2 .deco_rb img{width: 120%;}



.sec3 .deco img { position: absolute; right: 0; bottom: 0; width: 15vw; height: auto; display: block; z-index: 5;}
.sec3 .ttl .subttl {background: #F9FB7C;}
.sec3 .sp { position: absolute; right: 5%; top: 1vw; width: 20vw; height: auto; display: block; z-index: 5;}
.sec3 .maincont .linebox .head {background: #3EA8EA;}
.sec3 .maincont .linebox .inner {padding: 5vw 0;}
.sec3 .inner .interview {position: relative; margin-top: 3vw;}
.sec3 .inner .interview .cell { display: none; width: 90%; margin: 0 auto;}
.sec3 .inner .interview .cell.on { display: flex; justify-content: flex-start; align-items: flex-start; flex-wrap: wrap;}
.sec3 .inner .interview .cell .left { width: 30%; margin-right: 5%; }
.sec3 .inner .interview .cell .right { width: 65%; }
.sec3 .inner .interview .cell .right .interviewttl {width: 100%; font-weight: 900; font-size: 240%; margin-bottom: 2vw; line-height: 1.3;}
.sec3 .inner .interview .cell .right .interviewmain {text-align: left; font-size: 160%; font-weight: bold;}
.sec3 .inner .interview .cell .txt {width: 100%; margin: 3vw auto;}
.sec3 .inner .interview .cell .txt .mb3 {margin-bottom: 3vw;}
.sec3 .inner .interview .cell .txt .mb3:nth-last-of-type(1) {margin-bottom: 0;}
.sec3 .inner .interview .cell .txt .q {font-weight: bold; font-size: 150%; margin-bottom: 1vw;}
.sec3 .inner .interview .cell .txt .a {line-height: 1.2; font-size: 120%;}
.sec3 .navi {position: absolute; top: 2vw; left: 5vw; display: flex;}
.sec3 .navi a {display: block; width: 4vw; height: 4vw; border: solid 6px #000; position: relative; margin-right: 2vw; background: #fff;}
.sec3 .navi a p {display: flex; justify-content: center; align-items: center; width: 4vw; height: 4vw; border: solid 6px #000; font-size: 240%; font-weight: 900; margin: .3vw 0 0 -1vw;}
.sec3 .navi a:nth-child(1) p {background: #FF5E90;}
.sec3 .navi a:nth-child(2) p {background: #F9FB7C;}
.sec3 .navi a:nth-child(3) p {background: #3EA8EA;}
.sec3 .navi a:nth-child(4) p {background: #8BF4E7;}
.sec3 .bgtop {position: absolute; top: 0; left: 0; width: 100%; height: auto; object-fit: cover;}
.sec3 .bgbtm {position: absolute; bottom: 0; left: 0; width: 100%; height: auto; object-fit: cover;}

.sec4 .ttl {position: relative; height: 7vw; background: linear-gradient(transparent 30%, #FF5E90 0%); margin: 0 auto 6vw;}
.sec4 .subttl {display: flex; justify-content: center; align-items: center; width: fit-content; height: auto; padding: 1vw 4vw ; margin: 3vw auto; border: solid 5px #000; color: #000; font-size: 200%; font-weight: bold;}
.sec4 .tabbtn	{ position: relative; z-index: 3;width: fit-content; margin: 6vw auto 0;}
.sec4 .tabbtn	a {width: fit-content; font-size: 140%; font-weight: bold; padding: 1vw 2vw 4vw; margin: 0 .5vw; border-top: solid 4px #000; border-bottom: solid 4px #000; border-left: solid 4px #000; border-right: solid 4px #000; background: #69CCC9;}
.sec4 .tabbtn	a.current { background: #F599C2; border-bottom: none;}
.sec4 .maincont { position: relative; z-index: 4; display: block; margin: 12px auto 0; width: 100%; height: auto; overflow: visible;}
.sec4 .maincont .tab {display: none;}
.sec4 .maincont .tab.on {display: block;}
.sec4 .maincont .tab1 {background: #F599C2; padding: 3vw 0; border-top: solid 4px #000; position: relative;}
.sec4 .maincont .tab2 {background: #69CCC9; padding: 3vw 0; border-top: solid 4px #000; position: relative;}
.sec4 .maincont .cell {width: 70%; margin: 0 auto 0;}
.sec4 .deco1_lt { position: absolute; left: 2vw; top: -6vw; width: 22vw; height: auto; display: block; z-index: 5;}
.sec4 .deco1_rt { position: absolute; right: 0; top: -6vw; width: 20vw; height: auto; display: block; z-index: 5;}
.sec4 .deco1_lb { position: absolute; left: 2vw; bottom: 5vw; width: 22vw; height: auto; display: block; z-index: 5;}
.sec4 .deco1_rb { position: absolute; right: 0; bottom: 5vw; width: 20vw; height: auto; display: block; z-index: 5;}
.sec4 .deco2_lt { position: absolute; left: 2vw; top: -6vw; width: 22vw; height: auto; display: block; z-index: 5;}
.sec4 .deco2_rt { position: absolute; right: 0; top: -6vw; width: 20vw; height: auto; display: block; z-index: 5;}
.sec4 .deco2_lb { position: absolute; left: 2vw; bottom: 5vw; width: 22vw; height: auto; display: block; z-index: 5;}
.sec4 .deco2_rb { position: absolute; right: 0; bottom: 5vw; width: 20vw; height: auto; display: block; z-index: 5;}



.sec5 {position: relative; margin: 0 auto;}
.sec5 .maincont { width: 100%; padding: 3vw; box-sizing: border-box; display: flex; justify-content: center; flex-wrap: wrap; flex-direction: row; margin: 0 auto;}
.sec5 .maincont .cell { width: 32%; height: auto; display: block; position: relative;}

.faq {display: block; position: relative; width: 100%; background: #8BF4E7; padding: 3vw 0;}
.faq .ttlbox { width: fit-content; height: 7vw; background: linear-gradient(transparent 30%, #FF5E90 0%); margin: 0 auto 2vw;}
.faqcell {width: 60%; margin: 0 auto;}
.faqcell .cell { font-size: 180%; font-weight: 900; margin-top: 3vw; position: relative; display: block; width: 100%; height: auto; overflow: hidden; border: solid 6px #000; background: url(https://craftfix.co.jp/wp-content/themes/craftfix/images/recruit/bg_line.webp);-webkit-filter: drop-shadow(3px 3px 5px rgba(0,0,0,.3)); filter: drop-shadow(3px 3px 5px rgba(0,0,0,.3)); padding:4vw; box-sizing:border-box;}
.faqcell .cell .q {width: 100%; display: flex; justify-content: flex-start; align-items: center; margin-bottom: 2vw;}
.faqcell .cell .a {width: 100%; display: flex; justify-content: flex-start; align-items: flex-start;}
.faqcell .cell .q .ttl { width: 4vw; height: 4vw; display: flex; justify-content: center; align-items: center; border: solid 4px #000; border-radius: 50%; margin-right: 2vw; background: #968AF6; color: #fff;}
.faqcell .cell .a .ttl { width: 4vw; height: 4vw; display: flex; justify-content: center; align-items: center; border: solid 4px #000; border-radius: 50%; margin-right: 2vw; background: #fff;}
.faqcell .cell .q .ttl + p,.faqcell .cell .a .ttl + p { width: 80%; text-align: left;}

.recruitinfo {display: block; position: relative; width: 100%; padding: 3vw 0;}
.recruitinfo .ttlbox { width: fit-content; height: 7vw; background: linear-gradient(transparent 30%, #FF5E90 0%); margin: 0 auto 2vw;}
.recruitinfo {width: 70%; margin: 0 auto;}
.recruitinfo .txtlist { font-size: 130%; margin-top: 5vw; position: relative; display: block; width: 100%; height: auto; overflow: hidden; border: solid 6px #000; background: url(https://craftfix.co.jp/wp-content/themes/craftfix/images/recruit/bg_line.webp);-webkit-filter: drop-shadow(3px 3px 5px rgba(0,0,0,.3)); filter: drop-shadow(3px 3px 5px rgba(0,0,0,.3)); padding:4vw; box-sizing:border-box;}
.recruitinfo .txtlist .cell { width: 100%; display: flex; justify-content: flex-start; align-items: flex-start; margin-bottom: 3vw;}
.recruitinfo .txtlist .cell .left { width: 19%; margin-right: 2%; font-weight: 900; text-align: left;line-height: 1.3;}
.recruitinfo .txtlist .cell .right { width: 79%; text-align: left; line-height: 1.3;}

.entryform {display: block; position: relative; width: 100%; background: #DDC7FF; padding: 3vw 0;}
.entryform .ttlbox { width: fit-content; height: 7vw; background: linear-gradient(transparent 30%, #FF5E90 0%); margin: 0 auto 2vw;}
.entryform .maincont { width: 60%; margin: 0 auto; font-size: 120%; font-weight: 900; margin-top: 3vw; position: relative; display: block; height: auto; overflow: hidden; border: solid 6px #000; background: url(https://craftfix.co.jp/wp-content/themes/craftfix/images/recruit/bg_line.webp);-webkit-filter: drop-shadow(3px 3px 5px rgba(0,0,0,.3)); filter: drop-shadow(3px 3px 5px rgba(0,0,0,.3)); padding:4vw; box-sizing:border-box;}
.entryform .maincont dl {width: 100%; display: flex; justify-content: flex-start; flex-wrap: wrap; }
.entryform .maincont dl dt { width: 30%; margin-bottom: 2vw;}
.entryform .maincont dl dt label span {color: red;}
.entryform .maincont dl dd { width: 70%; margin-bottom: 2vw;}
form dd input,form dd select,form dd textarea {padding: .4vw; border: solid 2px #000; font-weight: 900; width: 90%;}

.entryform .maincont .sendbox { text-align: center; margin: 2vw auto;}
.entryform .maincont .sendbox .pp { width: 100%; display: flex; justify-content: center; align-items: center;}
.entryform .maincont .sendbox .pp label {margin-left: 1vw;}
.entryform .maincont .sendbox .submit {border: solid 4px #000; background: #FF5E90; padding: 1vw; color: #fff; font-size: 900px; font-size: 130%;}

.bnr_link img{max-width: 600px;}
}