:root {
    --color-text-main: #05193B;
    --color-main1: #2438A7;
    --color-main2: #9D9D9D;
    --color-main3: #F8B500 ;
    --color-sub1:#FFCE48;
    --color-sub2:#E3E0E0;
    --color-sub3:#A2B7FF;

    --color-bg: #FFFFFF;
    --color-bg2: #EFEFEF;
    --color-white: #FFFFFF;
    --color-over: #FFFFFF;
    --color-error: #F45353;
    --color-form: #747686;
    --font-main: "Zen Kaku Gothic New", sans-serif;
    --font-sub: "Oswald", sans-serif;

    --font-weight-Regular: 400;
    --font-weight-Medium: 500;

    --font-size-m: 18px;
    --font-size-l: 30px;
    --font-size-s: 14px;

    --font-size-l1: 40px;
    --font-size-l2: 85px;
    --font-size-l3: 60px;
    --font-size-l4: 70px;

    --font-size-title: 20px;
    --font-size-subtitle: 34px;
    --font-size-strong: 26px;
    --font-size-form: 20px;
    --font-size-docment: 16px;

    

}

/* common
===================================*/
html {
    min-width:1100px;
    overflow: auto;

}

body {
    font-family: var(--font-main);
    font-size: var(--font-size-m);
    font-weight: var(--font-weight-Medium);
    line-height: 1.8;
    color:var(--color-text-main);
    font-style: normal;

}

main {
    padding-top:116px;

}

strong,th,b, dt {
    font-weight: var(--font-weight-Medium);

}


.pcOnly {
    display:block;
}
.spOnly {
    display: none;
}


a {
    position: relative;
    transition: all .8s;
    text-decoration: none;

}
a:hover {
    color:var(--color-main1);

}

a.fade {
    opacity: 1;
}

a.fade:hover{
    opacity: 0.7;
}

a::before {
    position: absolute;
    left: 0;
    content: '';
    width: 100%;
    height: 1px;
    background: var(--color-main1);
    bottom: -5px;
    transform: scale(0, 1);
    transform-origin: right top; /*変形（アンダーラインの伸長）の原点がaタグ（各メニュー）の右端*/
    transition: transform 0.3s;  /*変形の時間*/
}
    
a:hover::before {
    transform: scale(1, 1);     /*ホバー後、x軸方向に1（相対値）伸長*/
    transform-origin: left top; /*左から右に向かう*/
}

a:link {

}

a:visited {

}

img {
    width:100%;
}
.noDeco::before {
    content:none;
    position: relative;
    width: auto;
    height: auto;
    background: none;
    transform: none;
    bottom:inherit;
    left:inherit;
    transform-origin: center center; 
}


.wrapperA {
    margin:0 auto;
    padding:0;
    width:1000px;

}

.paddingA {
    padding:120px 0 60px;
}



.btnStyleA {
    background-color: var(--color-main1);
    border-radius: 100px;
    padding:0.8em 1em;
    color:var(--color-sub1);
    font-size: var(--font-size-s);
}

.btnStyleA:hover{
    background-color: var(--color-sub1);
    border-radius: 100px;
    padding:0.8em 1em;
    color:var(--color-main1);
}

.btnStyleB {
    background-color: var(--color-white);
    border-radius: 6px;
    padding:1em 1.8em 1.2em;
    border:2px solid var(--color-main3);
    font-size: var(--font-size-s);

}
.btnStyleB strong {
    font-family: var(--font-sub);
    font-weight: var(--font-weight-Regular);

    font-size: var(--font-size-l1);
    color:var(--color-main3);

}
.btnStyleB strong::after {
    transition: all 0.8s;
    content: url(../img/icon-arrow1.svg);
   
    vertical-align:text-top;

}
.btnStyleB span {
    display: block;
}

.btnStyleB:hover {
    background-color: var(--color-white);
    border:2px solid var(--color-main1);
    font-size: var(--font-size-s);
}

.btnStyleB:hover strong {
    color:var(--color-main1);

}

.btnStyleB:hover strong::after {
    padding-left:0.5em;
    content: url(../img/icon-arrow1on.svg);
}


.btnStyleC {
    background-color: var(--color-main1);
    border-radius: 100px;
    padding:1.4em 4em;
    color:var(--color-sub1);
    font-size: var(--font-size-title);
    line-height: 1.0;
    position: relative;
    display: inline-block;


}
.btnStyleC::after {
    content: url(../img/icon-arrow2-yellow.svg);
    padding-left:0.2em;
    transition: all 0.8s ;
    position: absolute;
    
}
.btnStyleC:hover{
    background-color: var(--color-sub1);
    border-radius: 100px;
    color:var(--color-main1);
}
.btnStyleC:hover::after{
    content: url(../img/icon-arrow2-blue.svg);
    transform: translateX(10px);

}

.btnStyleD h2 {
    font-size: var(--font-size-l3);
    font-family: var(--font-sub);
    font-weight: var(--font-weight-Regular);

    line-height: 1.2;
}

.btnStyleD h2::after {
    content: url(../img/icon-arrow1-white.svg);
    padding-left:0.4em;    
    transition: all 0.8s ;

}

.btnStyleD:hover h2::after {
    padding-left:1em; 
}

.btnStyleD h3 {
    padding-top:1em;
    font-size: var(--font-size-strong);
    line-height: 1;
    
}

.btnStyleE {
    border:1px solid var(--color-main1);
    border-radius: 100px;
    padding:1.4em 4em;
    color:var(--color-main1);
    font-size: var(--font-size-title);
    line-height: 1.0;
    position: relative;
    display: inline-block;


}
.btnStyleE::before {
    content: url(../img/icon-arrow2-blue.svg);
    transform: rotate(-180deg);
    padding-left:0.2em;
    transition: all 0.8s ;
    display: inline-block;
    vertical-align: middle;
    
}
.btnStyleE:hover{
}
.btnStyleE:hover::before{
    transform: rotate(-180deg) translateX(10px);
    transform-origin: center center; 

}



.titleStyleA {
    color: var(--color-main1);
    margin-bottom:2em;
}
.titleStyleA.yellow {
    color: var(--color-main3);
}

.titleStyleA h2 {
    font-size:var(--font-size-title);
    padding-top:0.5em;
    line-height: 1.0;

}

.titleStyleA h3 {
    font-family: var(--font-sub);
    font-weight: var(--font-weight-Regular);

    font-size:var(--font-size-l3);
    line-height: 1.0;
}
.titleStyleB h4 {
    color: var(--color-main1);
    border-left: 16px solid var(--color-main1);
    padding: 0.2em 0.5em;
    font-size: var(--font-size-subtitle);
    margin-top: 1em;
}


.titleStyleC {
    color: var(--color-over);
    margin-bottom:2em;
}

.titleStyleC h2 {
    font-size:var(--font-size-title);
    padding-top:2em;
    line-height: 1.8;

}

.titleStyleC h3 {
    font-family: var(--font-sub);
    font-weight: var(--font-weight-Regular);

    font-size:var(--font-size-l3);
    line-height: 1.0;
}

.btnAreaCenter {
    text-align: center;
    margin:1em 0;
}

.flex {
    display: flex;
}

.flex.flex-nowrap {
    flex-wrap: nowrap;
}

.flex.flex-wrap {
    flex-wrap: wrap;
}

.flex.flex-jc {
    flex-wrap: wrap;
}

.flex.flex-ai-start {
    align-items: flex-start;
}
.flex.flex-ai-center {
    align-items: center;
}
.flex.flex-ai-stretch {
    align-items: stretch;
}
.flex.flex-jc-sa {
    justify-content: space-around;
}
.flex.flex-jc-center {
    justify-content: center;
}
.flex.flex-jc-sb {
    justify-content: space-between;
}

.separatorA {
    background-color: var(--color-sub2);
    display: block;
    height:8px;
    position: relative;
    margin-top:4em;

}

.separatorA::before {
    content: "";
    position: absolute;
    top:0;
    left:0;
    width:72px;
    height:8px;
    display: block;
    background-color: var(--color-main1);
}


.tableStyleA {
    width:100%;
    margin-bottom:2em;
}
.tableStyleA th {
    font-weight: var(--font-weight-Medium);
    border-bottom:1px solid var(--color-main2);
    padding:1.6em 0;
    width: 160px;

}
.tableStyleA td {
    font-weight: var(--font-weight-Regular);
    border-bottom:1px solid var(--color-main2);
    padding:1.6em 0;
    padding-left:2em;
    line-height: 1.8;
}
.tableStyleA td img {
    margin-top:1em;
}

.tableStyleB {
    width:100%;

}

.tableStyleB th {
    font-weight: var(--font-weight-Medium);
    padding:1em 0 0;
    display: block;

}
.tableStyleB td {
    width:100%;
    font-weight: var(--font-weight-Regular);
    border-bottom:1px solid var(--color-main2);
    padding:0.5em 0 1em;
    line-height: 1.8;
    display: block;

}

.linkStyleA {
    color:var(--color-main3);
    text-decoration: underline;

}
.linkStyleMap {
    color:var(--color-main3);
    text-decoration: underline;
    font-weight: var(--font-weight-Medium);
    display: block;
    padding:0.5em 0 0.5em 1.5em;
    margin:0.5em 0;
    background: url(../img/icon-map-pin.svg) center left no-repeat;
    transition: all 0.8s;
}

.imgWidthHalf{
    width:50%;
}

.pageInLink{
    margin-bottom:1em;
    margin-top:3em;
}
.pageInLink .list {
    margin:30x;
    gap:0 30px;
}

.pageInLink .list a {
    width:50%;
    margin-top:0;
    padding:2em 0 2em;
    border-top: 2px solid var(--color-main1);
    color: var(--color-main1);

}

.pageInLink .list a strong {
    font-family: var(--font-sub);
    font-weight: var(--font-weight-Regular);

    font-size:var(--font-size-l1);

}

.pageInLink .list a strong::after {
    content: url(../img/icon-arrow1on.svg);
    vertical-align:text-top;
    padding-left:0.5em;
    transition: all 0.8s ;
}

.pageInLink .list a:hover strong::after {
    padding-left:1em;

}

.pageInLink .list a span {
    display: block;
    font-size:var(--font-size-m);

}

.pageInLink .separatorA {
    margin-top:0;
}
.pageInLink .list a.iconRotate strong::after {
    display: inline-block;
    content: url(../img/icon-arrow01-under.svg);
    vertical-align: middle;
    margin-bottom:0em;
    transition: all 0.8s ;
    transform: translateY(-0em);
}

.pageInLink .list a.iconRotate:hover strong::after {
    padding-left:0.5em;
    transform: translateY(0.5em);

}

.err {
    margin:2em 0;
    padding:1em 2em;
    border:1px solid var(--color-bg2);
    border-radius: 100px;
    text-align: center;
}
.grecaptcha-badge { visibility: hidden; }

/* navi
===================================*/

header {
    background-color: var(--color-bg);
    position: fixed;
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 30px 43px;
    z-index: 100;
}

header #siteLogo {
   width:247px;
}

header nav ul {
    display: flex;
    gap:2em;
    font-size: var(--font-size-m);
}

header nav ul li a {
    white-space: nowrap;
}


/* footer
===================================*/
footer {
    background-color: var(--color-sub2);
    padding:50px 0 40px;
}

footer #footerLogo {
    width:250px;
    padding:1em 0;
}


footer #footerNav {

    gap:2em;
}

footer #footerNav a {
    margin:2em 0 2em;
    line-height: 1;

}

footer #footerCopy {
    font-size: var(--font-size-s);
    font-weight: var(--font-weight-Regular);
    
}

footer .footerLink {
    border-top:1px solid var(--color-main2);
    display: flex;
    margin: 1em 0;
    padding:1em 0;
}



footer .footerLink a {
    display: flex;
    align-items: center;
    gap: 1em;
}

footer .footerLink a img {
    height: 60px;
    width: auto;
}

#btnToTop {
    position: fixed;
    bottom:15px;
    right:15px;
    z-index: 100;
}

footer .footerLink #link01 {
    color:#0196E0;
}



/* top
===================================*/

#secFv {
    position: relative;
}

#secFv ul{

}

#secFv ul li {

}

#secFv > div {
    position: relative;
}
#secFv .copy {
    color:var(--color-over);
    position: absolute;
    top:13vw;
    left:0%;
    z-index: 9;
}
#secFv .copy h1 {
    font-size:var(--font-size-l1);
}

#secFv .copy h2 {
    padding-top:2em;
    font-size:var(--font-size-title);

}
#secFv #copy2 {
    position: absolute;
    left:0;
    bottom:0;
    font-size:var(--font-size-l2);
    z-index: 10;
    font-family: var(--font-sub);
    font-weight: var(--font-weight-Regular);

    line-height:0.9;
    color:var(--color-sub3);
    mix-blend-mode:overlay;


}

#secFv #btn {
    position:absolute;
    bottom:25px;
    right:25px;
    z-index: 10;

}

.slick-dots {
    display: flex;
    flex-direction: column;
    width: auto;
    right:20px;
    top:50%;
    bottom: inherit;
    gap:18px;

}
.slick-dots li {
    
}

.slick-dots li button:before {
    font-size: 18px;
    color:var(--color-white);
    opacity: 1;

}

.slick-dots li button:hover:before {
    color:var(--color-sub2);
    -webkit-text-stroke: 2px #FFF;
    text-stroke: 2px #FFF;
}

.slick-dots li.slick-active button:before {
    color:var(--color-main2);
    -webkit-text-stroke: 2px #FFF;
    text-stroke: 2px #FFF;
    
}

.slick-dotted.slick-slider {
    margin-bottom: 0;
}

#secService .flex {
    gap:60px;
}

#secService .text {
    width:40%;
}

#secService .img {
    width:60%;
    position: relative;
}

#secService .img img {
   position: absolute;
   top:-400px;
   right:-200px;
   z-index: -1;
   width:140%;
}

#secService02 #serviceList {
    gap:20px;
}

#secService02 #serviceList li {
    width:33%;
    border: 6px solid var(--color-sub2);
    padding:40px 28px 20px;
}

#secService02 #serviceList li strong {
    font-size:var(--font-size-subtitle);
    line-height: 1;
}

#secService02 #serviceList li  p {
    padding-top:1em;
    text-align: justify;
}

#secRecruit {
    background-image: url(../img/img-bg-rectuit01.jpg);
    background-size: cover;
    padding-bottom:60px;
}

#secRecruit #secRecruit01 {
    color:var(--color-over);
}

#secRecruit #secRecruit01 h2 {
}

#secRecruit #secRecruit01 h2::after {
    content: url(../img/icon-arrow1-white.svg);
}

#secRecruit #secRecruit01:hover h2::after {
}

#secRecruit #secRecruit01 h3 {

    
}

#secRecruit #secRecruit02 {
    margin:30x;
    gap:30px;
}

#secRecruit #secRecruit02 a {
    width:50%;
    margin-top:3em;
    padding:2em 0 0;
    border-top: 2px solid var(--color-main3);
    color: var(--color-main3);

}

#secRecruit #secRecruit02 a strong {
    font-family: var(--font-sub);
    font-weight: var(--font-weight-Regular);

    font-size:var(--font-size-l1);

}

#secRecruit #secRecruit02 a strong::after {
    content: url(../img/icon-arrow1.svg);
    vertical-align:text-top;
    padding-left:0.5em;
    transition: all 0.8s ;
}

#secRecruit #secRecruit02 a:hover strong::after {
    padding-left:1em;

}

#secRecruit #secRecruit02 a span {
    display: block;
    font-size:var(--font-size-m);

}


#secInterview {
    background-color: var(--color-main1);

}

#secInterview a {
    color:var(--color-main3);
}

#secInterview a h2::after {
    content: url(../img/icon-arrow1.svg);
}

#secInterview a h3 {
    padding-top:0.5em;

}

#secInterview #secInterview01 {
    margin-top:3em;
}
#secInterview #secInterview01 {
    width:33.3%;
}


#secWorks {

}

#secWorks #secWorksSlider {
    

}

#secWorks #secWorksSlider li {

}

#secWorks #secWorksSlider li > a {
    display: block;
    border:1px solid var(--color-main2);
    border-right:0px;
    padding:40px 34px 20px;
}

#secWorks #secWorksSlider li > a img {
    width:265px;
    height:auto;
    aspect-ratio: 4 / 3; 
    object-fit: cover;
}

#secWorks #secWorksSlider li > a h4 {
    font-size:var(--font-size-m);
    padding:1em 0;
}

#secWorks #secWorksSlider li > a .category-list {
    font-size:var(--font-size-s);
    color:var(--color-main1);
}

#secWorks #secWorksSlider li > a .category-list a {
    padding-right:1em;
}

#secWorks #secWorksSlider .slick-prev {
    top:-60px;
    right:calc((100vw - 1000px) / 2 + 80px);
    left:inherit;

}

#secWorks #secWorksSlider .slick-next {
    top:-60px;
    right:calc((100vw - 1000px) / 2);
    left:inherit;
}
#secWorks #secWorksSlider .slick-prev::before {
    content: url(../img/icon-slider-prev.svg);
}

#secWorks #secWorksSlider .slick-next::before {
    content: url(../img/icon-slider-next.svg);
    
}


/* under common
================================*/
#pageHead {
    padding:80px 0 0;
}

#pageHead h3 {
    font-size:var(--font-size-l4);

}

#serviceSec01 {
    padding-bottom:60px;
}

#serviceSec01 .img {
    width: 700px;
    margin:2em auto;
    
}
#serviceSec01 .iso {
    gap:1.5em;
}
#serviceSec01 .iso img {
    width:190px;
}

#serviceSec02 {
    background-color: var(--color-main1);
    color:var(--color-over);
}

#serviceSec02 .titleStyleA {
    color:var(--color-over);
}


#serviceSec02_flowSlider {
    color:var(--color-text-main);
}

#serviceSec02_flowSlider li {
    width:336px;
    margin-right:2px;
    background-color: var(--color-white);
    padding:20px 30px 30px;
    
}

#serviceSec02_flowSlider li strong {
    font-family: var(--font-sub);
    font-weight: var(--font-weight-Regular);

    color:var(--color-main1);
    font-size:var(--font-size-title);

}


#serviceSec02_flowSlider li strong span {
    font-size:var(--font-size-l3);
}
#serviceSec02_flowSlider li h4 {
    font-size:var(--font-size-subtitle);
    padding-top:0;

}
#serviceSec02_flowSlider li p {
    font-size:var(--font-size-s);
    padding-top:1em;

}

#serviceSec02_flowSlider .slick-list {

}

#serviceSec02_flowSlider .slick-prev {
    top:-60px;
    right:calc((100vw - 1000px) / 2 + 80px);
    left:inherit;

}

#serviceSec02_flowSlider .slick-next {
    top:-60px;
    right:calc((100vw - 1000px) / 2);
    left:inherit;
}
#serviceSec02_flowSlider .slick-prev::before {
    content: url(../img/icon-slider3-prev.svg);
}

#serviceSec02_flowSlider .slick-next::before {
    content: url(../img/icon-slider3-next.svg);
    
}

.serviceSec03_detail {
    margin-top:5em;
}

.serviceSec03_detail h4 {
    color:var(--color-main1);
    border-left:16px solid var(--color-main1);
    padding:0.2em 0.5em;
    font-size: var(--font-size-subtitle);
    margin-top:1em;

}

.serviceSec03_detail p {
    margin-top:1.5em;

}

.serviceSec03_detail .serviceSec03_detailList {
    padding-left:3em;
    margin-top:2em;
}
.serviceSec03_detail .serviceSec03_detailList .list {
    margin-top:2em;
    line-height: 1;
    font-size:var(--font-size-title);

}
.serviceSec03_detail .serviceSec03_detailList .list p {
    font-size:var(--font-size-s);
    margin-top:1em;
    font-weight: var(--font-weight-Regular);
}

.serviceSec03_detail .serviceSec03_detailList .highlight {
    border:1px solid var(--color-main1);
    padding:1.5em;
    color:var(--color-main1);
    margin-top:2em;
}

.serviceSec03_detail .serviceSec03_detailList .highlight h5 {

}

.serviceSec03_detail .serviceSec03_detailList .highlight p {
    font-size:var(--font-size-s);
    margin-top:1em;
    font-weight: var(--font-weight-Regular);
}

.serviceSec03_detail .serviceSec03_detailList .imgList {
    margin-top:1em;
    gap:2px;
}

.serviceSec03_detail .serviceSec03_detailList .imgList img {

     width:calc(33.3% - 2px);   
}



#companySec01 .wrap {
    padding-top:3em;
}

#companySec01 .text {
    width:700px;
}

#companySec01 .text img {
    width:216px;
    display: block;
    margin:0 auto;

}

#companySec01 .text p {
    margin-top:2em;
    font-weight: var(--font-weight-Regular);
}

#companySec01 .text .name {
    text-align: right;
    font-weight: var(--font-weight-Regular);

}
#companySec01 .text .name strong {
    font-weight: var(--font-weight-Medium);
    font-size:var(--font-size-title);
    padding-left:0.5em;
}

#companySec02 {

}

#companySec02 .table {

}

#companySec03_flexTable h5 {
    color:var(--color-main1);
    font-size:var(--font-size-strong);
}
#companySec03_flexTable {
    gap:64px;
}
#companySec03_flexTable > * {
    width:50%;
}


#introductionSec01 {

}

#introductionSec01 ul {
    gap:0;
}
#introductionSec01 ul li {
    width:33.3%;
}



#introductionSec01 ul li > a {
    display: block;
    border-right:0px;
    padding:40px 34px 20px;
}

#introductionSec01 ul li > a img {
    width:100%;
}

#introductionSec01 ul li > a h4 {
    font-size:var(--font-size-m);
    padding:1em 0;
}

#introductionSec01 ul li > a .category-list {
    font-size:var(--font-size-s);
    color:var(--color-main1);
}
#introductionSec01 ul li > a .category-list a {
    padding-right:1em;
}


#newsSec01 {

}

#newsSec01 ul {
    gap:0;
}
#newsSec01 ul li {
    width:33.3%;
}



#newsSec01 ul li > a {
    display: block;
    border-right:0px;
    padding:40px 34px 20px;
}

#newsSec01 ul li > a img {
    height:auto;
    aspect-ratio: 4 / 3; 
  }
  

#newsSec01 ul li > a date {
    font-size:var(--font-size-s);
    padding-top:2em;

}
#newsSec01 ul li > a h4 {
    font-size:var(--font-size-m);
    padding:0m 0;
}

#newsSec01 ul li > a .category-list {
    padding-top:1em;

    font-size:var(--font-size-s);
    color:var(--color-main1);
}
#newsSec01 ul li > a .category-list a {
    padding-right:1em;
}


#recruitSec01 {
    margin-top:80px;
    padding-bottom:80px;


}
#recruitSec01 >div {
    gap:50px;
    
}
#recruitSec01 .text {
    min-width:400px;
    width:400px;
    
}
#recruitSec01 .img {
    margin-right:calc((100vw - 1000px) / -2);
    width:auto;

}

#recruitSec01 .img img {
    object-fit: cover;
}

#recruitSec01 h2 {
    font-size:var(--font-size-l1);
}

#recruitSec01 p {
    padding-top:2em;
}



#recruitSec02 {
    background-color: var(--color-main1);

}

#recruitSec02 {
    color: var(--color-main3);
}
#recruitSec02 > div > a:hover {
    color: var(--color-main3);
}


#recruitSec02 a h2::after {
    content: url(../img/icon-arrow1.svg);
}

#recruitSec02 a h3 {
    padding-top:0.5em;
}

#recruitSec02 .list {
    margin-top:3em;
    gap:20px;
    color:var(--color-white);
}
#recruitSec02 .list a {
    width:33.3%;
}
#recruitSec02 .list a:hover {
    color:inherit;
}
#recruitSec02 .list a p {
    padding-top:1em;
}
#recruitSec02 .list a span {
    display: block;
    font-size: var(--font-size-s);
    padding-top:1em;
    font-weight: var(--font-weight-Regular);

}

#recruitSec03 h4 {
    font-size:var(--font-size-l1);
}

#recruitSec03 > div {
    padding-top:3em;
    gap:80px;

}
#recruitSec03  .img {
    width:420px;
}
#recruitSec03  .img2 {
    width:100%x;
}

#recruitSec03  .text p {
    padding-top:1em;
}

#recruitSec03  .modelcase {
    margin:5em;
    border:6px solid var(--color-sub2);
    padding:2em;
    width:800px;
}

#recruitSec03  .modelcase .name  {
    color:var(--color-main1);
    gap:0.5em;
    width:40%;
    
}

#recruitSec03  .modelcase .name img  {
    width:94px;
    
}

#recruitSec03  .modelcase .data  {
    width:60%;


}
#recruitSec03  .modelcase .data table   {
    width:100%;
}
#recruitSec03  .modelcase .data th  {
    border-bottom:1px solid var(--color-main2);
    padding:0.6em 0;
    width:150px;
}
#recruitSec03  .modelcase .data td  {
    border-bottom:1px solid var(--color-main2);
    font-weight: var(--font-weight-Regular);
    padding:0.6em 0;

}

#recruitSec03  .modelcase .data .sum  {
    font-weight:var(--font-weight-Medium);
    font-size:var(--font-size-title);
}

#recruitSec04 {

}

#recruitSec04 .imgList img {
    width:333px;
}

.btnRecruit01 {
    display: block;
    padding:3em;
    width:100%;
    border:4px solid var(--color-main3);
    background-color: var(--color-main1) !important;
    background: url(../img/img-logo-wing.svg) right center no-repeat;
    
}
.btnRecruit01 > div {
    color:var(--color-main3);
}

.btnRecruit01 > div h2::after {
    content:url('../img/icon-arrow1.svg');
}

.btnRecruit01:hover > div h2::after {
    padding-left:1em;
}
.btnRecruit01 > div h3 {
    font-size:var(--font-size-title);
    padding-top:0.5em;
}
.btnRecruit01 strong {
    color:var(--color-over);
    display: block;
    padding-top:1em;
    font-size:var(--font-size-strong)
}

.btnRecruit01 p {
    padding-top:0.5em;
    color:var(--color-over);
    font-weight: var(--font-weight-Regular);
}



.interviewLayoutA {

}

.interviewLayoutA .head {
    background-color: var(--color-main1);
    margin-top:60px;
    padding-bottom:350px;
}

.interviewLayoutA .head h4 {
    color:var(--color-over);
    font-size:var( --font-size-l1)
}   
.interviewLayoutA .head img {
    margin:60px 0;
}

.interviewLayoutA .faq  {
    margin-top:-420px;
}

.interviewLayoutA .faq dl  {
}

.interviewLayoutA .faq dl dt  {
    font-size:var(--font-size-strong);
    color:var(--color-main1);
    padding-top:2.5em;


}

.interviewLayoutA .faq dl dt:first-child  {
    padding-top:0;

}
.interviewLayoutA .faq dl dt::before  {
    content:'Q.';
    padding-right:1em;
    font-family: var(--font-sub);
    font-weight: var(--font-weight-Regular);

}

.interviewLayoutA .faq dl dd  {
    padding-top:1em;
}

.interviewLayoutA .faq dl dd.imgList  {
   display: flex;
    margin-top:3em;
}

.interviewLayoutA .faq dl dd.imgList > img  {
   width:50%;

 }
 .interviewLayoutA .faq > img  {
    margin:4em 0;
 }


.contentHead {
    font-family: var(--font-sub);
    font-weight: var(--font-weight-Regular);

    font-size:var(--font-size-title);
    gap:1em;
    margin-top:3em;

}

.contentHead h4 {
    color:var(--color-main3);
    font-size: var(--font-size-l1);

}
.contentHead h5 {
    color:var(--color-main3);

}

.contentHead p {
    width:100%;
    font-weight: var(--font-weight-Medium);
}



.formStyleA {
    margin-top:4em;
    margin-bottom:4em;
    padding:0 60px;

}

.formStyleA dt {

    font-weight :var(--font-weight-Regular);

}
.formStyleA dd {
    margin-top:0.3em;
    margin-bottom:1.5em;
    font-weight :var(--font-weight-Regular);

}
.formStyleA dd.flex {
    gap:1em;
}

.formStyleA dd.flex > a  {
    white-space: nowrap;
}

.formStyleA dd dl {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
}

.formStyleA dd dt {
    width:5em;
}

.formStyleA dd dd {
    width:calc(100% - 5em);

}

.formStyleA .selectbox {
    position: relative;
}

.formStyleA.confirm dt {


}
.formStyleA.confirm dd {
    

}


.selectbox::before,
.selectbox::after {
    position: absolute;
    content: '';
    pointer-events: none;
}

.selectbox::before {
    display: inline-block;
    right: 0;
    top:0;
    width: 2.8em;
    height: 2.8em;
    border-radius: 0 3px 3px 0;
    background-color: var(--color-main1);
}

.selectbox::after {
    position: absolute;
    top: 25px;
    right: 1.4em;
    transform: translate(50%, -70%) rotate(45deg);
    width: 15px;
    height: 15px;
    border-bottom: 1px solid var(--color-over);
    border-right: 1px solid var(--color-over);
}
.selectbox span {
    width: 100%;
}
.selectbox select {
    appearance: none;
    min-width: 230px;
    height: 2.8em;
    padding: .4em 3.6em .4em .8em;
    border: none;
    font-size: 1em;
    cursor: pointer;
}

.selectbox select:focus {
}


.formStyleA dt.require::after {
    content:"（必須）";
    color:var(--color-main1);
    
}

.formStyleA input:not([type='submit']),
.formStyleA textarea
 {
    width:100%;
    border:1px solid var(--color-form);
    border-radius: 6px;
    padding:0.4em 1em;
    font-size:var(--font-size-form);
    font-weight:var(--font-weight-Regular);
}
.formStyleA input[type=submit] {
    
    width:auto;
    -webkit-appearance: none;
    -moz-appearance: none;
        appearance: none;
}

.formStyleA textarea {
    height:15em;
}
.formStyleA select {
    border:1px solid var(--color-form);
    width:100%;
    padding:0.4em 1em;
    border-radius: 6px;
}


.formStyleA label {
    display: flex;
    align-items: center;
}
.formStyleA input[type="checkbox"] {
    position: relative;
    border-radius: 0;
    margin-right:0.8em;
    width: auto;
    padding:0;
    width: 34px;
    height: 34px;
    border: 1px solid var(--color-main2);
    vertical-align: -5px;
    -webkit-appearance: none;
       -moz-appearance: none;
            appearance: none;
            
  }
  
 .formStyleA input[type="checkbox"]:checked:before {
    position: absolute;
    top: 7px;
    left: 12px;
    transform: rotate(50deg);
    width: 8px;
    height: 16px;
    border-right: 4px solid var(--color-main1);
    border-bottom: 4px solid var(--color-main1);
    content: '';
  }

.formStyleA *::placeholder
 {
    color:var(--color-main2);
}

.formStyleA p {
    font-weight:var(--font-weight-Regular);
    margin-top:2em;

}

.formStyleA .privacypolicy {
    overflow-y: auto;
    border:1px solid var(--color-form);
    padding:1.5em 1em;
    height:270px;
    margin:2em 0;
    font-size:var(--font-size-docment);
}
.formStyleA .privacypolicy dt {
    margin-top:2em;
    font-weight: var(--font-weight-Medium);
}

/* BLOG
=============================== */
.categoryLink {
    color:var(--color-main1);


}
.categoryLink h4 {
    font-family: var(--font-sub);
    font-weight: var(--font-weight-Regular);

}


.categoryLink .cat-list {
    display: flex;
    gap:1em;
    margin-top:0.5em;
}

.categoryLink .cat-list a {
    display: inline-block;
    padding:0.4em 1em 0.5em;
    border:1px solid var(--color-main1);
    border-radius: 100px;;
    line-height: 1;
}

.categoryLink .cat-list a.current {
    background-color: var(--color-main1);
    color:var(--color-over);
}

.categoryLink .cat-list a:hover {
    background-color: var(--color-main1);
    color:var(--color-over);
}

.blogPagenation {
    margin-top:4em;
    margin-bottom:4em;
}
.pagination {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-family: var(--font-sub);
    font-weight: var(--font-weight-Regular);

}
.pagination ul {
    display: flex;
    align-items: center;
    gap:0;
    color:var(--color-main1);


}
.pagination li ul li {
    font-size: var(--font-size-strong);

}
.pagination li li {
    padding:0 0.6em;
}
.pagination li li a {
    padding:0 0;
}

.pagination li span.current {
    color:var(--color-main2);
}
.pagination .show-prev {
    height:69px;
    width:200px;
}
.pagination .show-prev a {
    background:url(../img/icon-blog-btn-prev.svg) 1em center no-repeat;
    width:100%;
    height:100%;
    display: block;
    transition: all 0.8s;

}

.pagination .show-prev a:hover {
    background-position:0em;
}
.pagination .show-next {
    height:69px;
    width:200px;
}
.pagination .show-next a {
    background:url(../img/icon-blog-btn-next.svg) calc(100% - 1em) center no-repeat;
    background-origin: 100% 100%;
    width:100%;
    height:100%;
    display: block;
    transition: all 0.8s;



}
.pagination .show-next a:hover {
    background-position:right;
}

.pagination .show-next a::before,
.pagination .show-prev a::before
{
    content:none;
}




.blogDetailHeader {
    padding:2em 0;
    border-bottom:1px solid var(--color-sub2);
}

.blogDetailHeader date {
    display: block;
    font-size:var(--font-size-s);
    font-weight: var(--font-weight-Regular);
    margin-bottom:1em;

}

.blogDetailHeader h1 {
    font-size:var(--font-size-l1);

}

.blogDetailHeader .link-list {
    color:var(--color-main1);
    padding:1em 0;
    display: flex;
    gap:1em;
}

.blogDetailHeader .link-list a {

    font-size:var(--font-size-s);  
}