@charset "utf-8";
/* オフィスの様子 */

#section01,
#section01of {
    position: relative;
    height: 100%;
    background: #EBEFF5;
	margin-bottom: 5rem;
}

#section01 .section-inner-of,
#section01of .section-inner-of{
    z-index: 1;position: relative;
	padding: 5rem 1rem 2rem !important;
}
#section01 #svg-bg,
#section01of #svg-bg02 {
    position: absolute;width: 100%;height: 100%;top: 0;left: 0;z-index: 0;
}
#section01 .section-inner-of dl.inner-area {
    display: flex;
    justify-content: space-between;
}
#section01of .section-inner-of dl.inner-area {
    display:flex;
    justify-content:space-between;
	flex-direction: row-reverse;
}
#section01 .section-inner-of dl.inner-area dt,
#section01of .section-inner-of dl.inner-area dt {
    width:calc(100% * (600 / 1060));
}
#section01 .section-inner-of dl.inner-area dd,
#section01of .section-inner-of dl.inner-area dd {
    width:calc(100% * (390 / 1060));
}
section.recruit-content dl.inner-area > dd {
    /*font-size: 2.125em;*/
    line-height: 1.64;
}

h4 {font-size: 1.725em; font-weight:600; text-align:center;}
dl.inner-area dd h4 {text-align: left;}
figure {margin-bottom:1em;}

#recruitTop .officeMovie {
margin: 6rem calc(50% - 50vw) 6rem calc(50% - 50vw);
width: 100vw;
background:url("/assets/images/recruit/bg_officeMovie.png");
background-repeat: no-repeat;
background-position: center center;
background-size:cover;
padding-top:4rem; 
padding-bottom:4rem;
text-align: center;
}

#recruitTop .officeMovie .officeMovieInner {
max-width:1060px;
margin:0 auto;
}

#recruitTop .ofMitemflame {
display: flex;
width:100%;
justify-content: space-between;
}

#recruitTop .ofMitemflame .ofMitem {
background: #FFF;
padding: 2.185rem;
text-align: center;
font-size: 1.125rem;
font-weight: 500;
}

#recruitTop .ofMitemflame .ofMitem .mov_thum {
display:block;
height: 24.2vw;
width: 43vw;
max-width: 430px;
max-height: 242px;
margin: 1rem auto 0 auto;
}



@media all and (max-width: 768px) {
#section01 .section-inner-of dl.inner-area,
#section01of .section-inner-of dl.inner-area {
    flex-direction: column;
}
#section01 .section-inner-of dl.inner-area dt,
#section01of .section-inner-of dl.inner-area dt,
#section01 .section-inner-of dl.inner-area dd,
#section01of .section-inner-of dl.inner-area dd {
    width:100%;
}
	
#recruitTop .aofficeMovie .officeMovieInner {
max-width:none;
margin:0 1.5rem;
}

#recruitTop .ofMitemflame {
display: block;
}

#recruitTop .ofMitemflame .ofMitem {
    width: 100%;
    padding: 5vw;
}

#recruitTop .ofMitemflame .ofMitem .mov_thum {
    width: 100%;
    height: 56.27vw;
}
}
