@charset "UTF-8";
h1, h2, h3, h4{
	font-weight: 400;
}

.bellefair-regular {
  font-family: "Bellefair", serif;
  font-weight: 400;
  font-style: normal;
}
.shippori-mincho-medium {
  font-family: "Shippori Mincho", serif;
  font-weight: 500;
  font-style: normal;
}
.noto-sans-jp-regular {
  font-family: "Noto Sans JP", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
}
.noto-sans-jp-medium {
  font-family: "Noto Sans JP", sans-serif;
  font-optical-sizing: auto;
  font-weight: 500;
  font-style: normal;
}

*{
	box-sizing: border-box;
}
img{
	display: block;
}

.resizing *,
.resizing :before,
.resizing :after{
	transition: none !important;
}


html, body{
	line-height: 1.8;
	font-size: 62.5%;
	font-family: "Shippori Mincho", serif;
	font-weight: 400;
	font-style: normal;
	overflow-x: hidden;
}
body{
	opacity: 0;
}
body.loaded{
	opacity: 1;
}
.abs{
	position: absolute;
	display: block;
}
.rel{
	position: relative;
	display: block;
}
.flexBlock{
	display: flex;
	justify-content: space-between;
}
.anim{
	transition:0.3s ease-out;
}
.inner{
	position: relative;
}
#header{
	width: 100%;
	display: flex;
	position: fixed;
	top: 0; left: 0;
	justify-content: space-between;
	z-index: 999;
}
#header .inner{
	padding-left: 30px;
	width: 77%;
	display: flex;
	justify-content: space-between;
	align-items: center;
	height: 80px;
	background: #FFFFFF;
}
#header .inner h1{
	max-width: 176px; margin-right: 15px;
	width: 23%;
}
#header .inner h1 > img{
	width: 100%;
}
.top-nav .link{
	display: flex;
	justify-content: flex-end;
	align-items: center;
}
.top-nav .link li{
	margin-right: 40px;
}
.top-nav .link li a{
	color: #373737;
	font-size: clamp(1.0rem, calc(0.8rem + 0.625vw), 1.6rem);
}
.top-nav .link li a{
	padding-bottom: 5px;
	position: relative;
	text-decoration: none;
}
.top-nav .link li a:before {
  background: #BA0015;
  content: '';
  width: 100%;
  height: 2px;
  position: absolute;
  left: 0;
  bottom: 0;
  margin: auto;
  transform-origin: right top;
  transform: scale(0, 1);
  transition: transform .3s;
}
@media screen and (min-width:769px) {
	.top-nav .link li a:hover::before {
		transform-origin: left top;
		transform: scale(1, 1);
	}
}
#header .info{
	position: absolute; display: flex;
	top: 0; right: 0;
	height: 120px;
	width: 23%;
}

#header .info li a{
	position: relative; display: flex;
	justify-content: center;
	align-items: center;
	padding: 10px;
	width: 100%; height: 100%;
}
#header .info li a > img{
	max-width: 100%;
}
#header .info li:nth-child(1){
	width: 67%;
}
#header .info li:nth-child(2){
	width: 33%;
}
#header .info li:nth-child(1) a:nth-child(1){
	background: #158C5D;
	height: 80px;
	cursor: default;
}
#header .info li:nth-child(1) a:nth-child(2){
	background: #373737;
	height: 40px;
	transition:0.3s ease-out;
}
#header .info li:nth-child(2) a{
	background: #BA0015;
	height: 120px;
	transition:0.3s ease-out;
}

@media screen and (min-width:769px) {
	#header .info li:nth-child(1) a:nth-child(2):hover{
		background: #171717;
	}
	#header .info li:nth-child(2) a:hover{
		background: #9A0005;
	}
}


.top_tilt_r {
  clip-path: polygon(0 60px, 50% 0, 100% 0, 100% 100%, 50% 100%, 0 100%);
}
.tilt_r {
  clip-path: polygon(0 60px, 50% 0, 100% 0, 100% calc(100% - 60px), 50% 100%, 0 100%);
}
.top_tilt_l {
  clip-path: polygon(0 0, 50% 0, 100% 60px, 100% 100%, 50% 100%, 0 100%);
}
.tilt_l {
  clip-path: polygon(0 0, 50% 0, 100% 60px, 100% 100%, 50% 100%, 0 calc(100% - 60px));
}
section{
	position: relative; display: block;
}
main{
	padding-top: 80px;
}
#header:before,
.baActive:before,
.baActive:after{
	content: '';
	height: 60px;
	position: absolute; display: block;
	width: 50%;
	z-index: 1;
}
#header:before{
	bottom: -60px; left: 0;
	clip-path: polygon(0 0, 100% 0, 0 100%);
	background: rgba(186, 0, 21, 0.9);
}
.baActive:before{
	top: 0; left: 0;
	clip-path: polygon(0 0, 100% 0, 0 100%);
}
.baActive:after{
	bottom: 0; right: 0;
	clip-path: polygon(0 100%, 100% 0, 100% 100%);
}
.top_img:before{
	display: none;
}
.top_img:after{
	background: #FFFFFF;
	opacity: 0.75;
}
.top_img .container{
	position: relative; display: block;
	height: calc(100vh - 80px);
	overflow: hidden;
	width: 100%;
}
.top_img .container:before{
	content: '';
	position: absolute; display: block;
	width: 100%; height: 100%; top: 0; left: 0;
	background: url("../img/top/top_img.png") no-repeat center center;
	background-size: cover;
	transition: 1.5s ease-out;
	transform: scale(1.2);
	opacity: 0;
}
.start .top_img .container:before{
	transform: scale(1);
	opacity: 1;
}

.sub_top:after{
	display: none;
}

.bg-field::before, .bg-field::after {
	pointer-events: none;
	content: "";
	position: absolute;
	bottom: 0;
	top: 0;
	right: 0;
	left: 0;
}

.bg-field::before {
	z-index: 1;
	background: #FFFFFF;
	mix-blend-mode: difference;
}

.bg-field::after {
	z-index: -1;
	background: #000000;
}
.fixed_area{
	position: fixed;
	display: block;
	top: 38vh;
	width: 100%;
	max-width: 1100px;
	margin: 0 auto;
	left: 0; right: 0;
	padding: 0 15px;
	pointer-events: none;
}
.firstActive .fixed_area{
	display: none;
}
.fixed_area h2{
	line-height: 1.5;
	font-size: 7rem; color: #FFFFFF;
	font-weight: 500;
}
.fixed_area h2 > span{
	opacity: 0; transform: scale(1.4);
}
.fixed_area h2 > span:nth-child(1){
	transition:1.5s ease-out 0.8s;
}
.fixed_area h2 > span:nth-child(2){
	transition:1.5s ease-out 1.2s;
}
.start .fixed_area h2 > span{
	opacity: 1; transform: scale(1);
}

.rotate{
	animation:rotate 12s infinite;
	animation-timing-function: linear;
}
.top_banner{
	width: 250px; height: 250px;
	right: 30px; bottom: -30px;
	z-index: 3;
	transition:0.5s ease-out;
	transform: perspective( 600px ) rotateY( -15deg );
}
.top_banner img{
	transition:0.7s ease-out 1.8s;
	opacity: 0;
}
.start .top_banner img{
	opacity: 1;
}
@media screen and (min-width:769px) {
	.button:hover{
		opacity: 0.7;
	}
	.banner:hover,
	.top_banner:hover{
		transform: scale(1.05);
	}
}
.top_banner .out{
	width: 100%;
	top: 0; left: 0;
}
.top_banner .in{
	width: 200px; height: 200px;
	top: 0; left: 0; bottom: 0; right: 0;
	margin: auto;
}

@keyframes rotate {
    from { transform: rotate(0deg) } 
    to { transform: rotate(360deg) } 
}
.inAnim{
    animation-name:inAnim;
    animation-duration: 7s;
    animation-timing-function: ease-in-out;
    animation-iteration-count: infinite;
}
 
@keyframes inAnim {
    0% {
        transform: scale(0.95);
    }
 
    50% {
        transform: scale(1.05);
    }
     
    100% {
        transform: scale(0.95);
    }
}
.rotateG:before{
	content: ''; position: absolute; display: block;
	width: 162px; height: 162px;
	top: -100px; left: -100px;
	background: url("../img/top/circle_chiba_koumuten.svg") no-repeat center center;
	background-size: contain;
	animation:rotate 12s infinite;
	animation-timing-function: linear;
	transform: perspective( 600px ) rotateY( 15deg );
}
.subArea{
	padding: 150px 0;
}
section .inner{
	max-width: 1100px;
	width: 100%;
	padding-left: 15px;
	padding-right: 15px;
	margin: 0 auto;
}
#first .inner{
	z-index: 1;
}
#first .inner #firstTitle{
	font-weight: 500;
	font-size: 7rem;
	color: #000000;
	line-height: 1.5;
	opacity: 0;
	margin-top: 40px;
}
.firstActive #first .inner #firstTitle{
	opacity: 1;
}
#first .inner .text{
	font-size: 1.6rem;
	max-width: 450px;
	opacity: 0;
	transition:1.1s ease-out;
}
.onceActive #first .inner .text{
	opacity: 1;
}

#first .baActive:before{
	display: none;
}
#first .baActive:after{
	background: #BA0015;
}
.overflow{
	overflow: hidden;
}
.effect-img{
	transform: scale(1.25);
	transition:1.1s ease-out;
	opacity: 0;
}
.effect-scroll .effect-img{
	transform: scale(1);
	opacity: 1;
}
h3 .bellefair-regular{
	font-size: 20rem;
	color: rgba(255, 255, 255, 0.25);
	line-height: 1;
	position: absolute;
	transform: translate(-7%, -57%);
	transition:1.2s ease-out 0.8s;
	opacity: 0;
}
.effect-scroll h3 .bellefair-regular{
	opacity: 1;
}

h3 .noto-sans-jp-medium{
	font-size: 2.0rem;
	color: #BA0015;
	position: relative;
}
h3 .shippori-mincho-medium{
	font-size: 3.0rem;
	color: #FFFFFF;
}
.textArea .noto-sans-jp-regular{
	font-size: 1.6rem;
	color: #FFFFFF;
}
#about .textArea .noto-sans-jp-regular,
#about h3 .shippori-mincho-medium{
	color: #FFFFFF;
}
#interview-page .textArea .noto-sans-jp-regular{
	font-size: 1.8rem;
}

.btnArrow{
	font-family: "Noto Sans JP", sans-serif;
	font-optical-sizing: auto;
	font-weight: 400;
	font-style: normal;
	height: 60px; position: relative; display: block;
	width: 100%;
	border-radius: 30px;
	max-width: 320px;
	overflow: hidden;
	text-decoration: none;
	cursor: pointer;
}
.btnArrow > span{
	position: relative; display: flex;
	justify-content: flex-start; align-items: center;
	font-size: 1.8rem;
	padding: 0 30px;
	width: 100%; height: 100%;
	color: #FFFFFF;
	z-index: 1;
}
.btnArrow.prev > span{
	justify-content: flex-end;
}
.btnArrow:before{
	content: '';
	position: absolute; display: block; left: 0; top: -5%;
	transition: 0.3s ease-out;
	width: 110%;
	height: 110%;
	border-radius: 30px;
	background: #FFFFFF;
	transform: translateX(-105%);
}
.btnArrow.prev:before{
	transform: translateX(105%);
}
.btnArrow:after{
	width: 60px; height: 60px;
	content: ''; position: absolute; display: block;
	right: 0; bottom: 0; top: 0; margin: auto 0;
	border-radius: 50%;
}
.btnArrow.prev:after{
	right: auto; left: 0;
	transform: rotate(-180deg);
}

.btnArrow.gray{
	background: #373737;
	border: 3px solid #373737;
}
.btnArrow.red{
	background: #BA0015;
	border: 3px solid #BA0015;
}
.btnArrow.gray:after{
	background: url("../img/common/btn_arrow_gray.svg") center center no-repeat;
	background-size: contain;
}
.btnArrow.red:after{
	background: url("../img/common/btn_arrow_red.svg") center center no-repeat;
	background-size: contain;
}
@media screen and (min-width:769px) {
	.btnArrow.gray:hover > span{
		color: #373737;
	}
	.btnArrow.red:hover > span{
		color: #BA0015;
	}
	.btnArrow:hover:before{
		transform: translateX(-15%);
	}
	.btnArrow.prev:hover:before{
		transform: translateX(5%);
	}
}
#about .inner{
	padding-top: 150px;
	padding-bottom: 120px;
}
#about .inner .textArea{
	flex-direction: column;
	width: 100%; max-width: 460px;
}
#about .inner .textArea > h3{
	display: flex; position: relative;
	flex-direction: column;
	margin-bottom: 50px;
}

#topImgSub .effect-img > div,
#topImgSub .effect-img,
#about .effect-img > div,
#about .effect-img{
	height: 100%;
	width: 100%;
}
#topImgSub .effect-img > div img,
#about .effect-img > div img{
	height: 100%; width: auto;
	left: 50vw;
	margin-left: -50vw;
	position: relative;
	display: block;
}
@media screen and (min-width: 1500px) {
	#topImgSub .effect-img > div img,
	#about .effect-img > div img{
		height: auto; width: 100%;
		left: 0;
		margin-left: auto;
	}
}
#about.baActive:after{
	display: none;
}
#about.baActive:before{
	background: #FFFFFF;
}
#about .inner .textArea p{
	line-height: 2;
}
#about .inner .textArea .btnArrow{
	margin-top: 50px;
}

#about .inner{
	padding-top: 150px;
	padding-bottom: 120px;
}
#about .inner .textArea > h3{
	display: flex; position: relative;
	flex-direction: column;
	margin-bottom: 50px;
}
#about .effect-img > div,
#about .effect-img{
	height: 100%;
	width: 100%;
}
#about .effect-img > div img{
	height: 100%; width: auto;
	left: 50vw;
	margin-left: -50vw;
	position: relative;
	display: block;
}
@media screen and (min-width: 1500px) {
	#about .effect-img > div img{
		height: auto; width: 100%;
		left: 0;
		margin-left: auto;
	}
}
#about.baActive:after{
	display: none;
}
#about.baActive:before{
	background: #FFFFFF;
}
#about .inner .textArea p{
	line-height: 2;
}
#about .inner .textArea .btnArrow{
	margin-top: 50px;
}

h3 .shippori-mincho-medium,
.textArea .noto-sans-jp-regular{
	color: #373737;
}
#works h3 .bellefair-regular{
	color: #F5F3F0;
}

#works .inner{
	padding-top: 150px;
	padding-bottom: 120px;
	display: flex;
	justify-content: flex-end;
}
#works .inner .textArea{
	flex-direction: column;
}
#works .inner .textArea > h3{
	display: flex; position: relative;
	flex-direction: column;
	margin-bottom: 50px;
}
#works .effect-img > div{
	height: 100%;
	width: 100%;
}
#works .effect-img{
	height: 100%;
	width: 50%;
}
#works .effect-img > div img{
	height: 100%; width: auto;
	left: 50vw;
	margin-left: -50vw;
	position: relative;
	display: block;
}
@media screen and (min-width: 1500px) {
	#works .effect-img > div img{
		height: auto; width: 100%;
		left: 0;
		margin-left: auto;
	}
}
#works.baActive:after{
	background: url("../img/common/bg_green.jpg");
	background-size: cover;
}
#works.baActive:before{
	background: #F5F3F0;
}
#works .inner .textArea{
	width: 100%; max-width: 460px;
}
#works .inner .textArea p{
	line-height: 2;
}
#works .inner .textArea .btnArrow{
	margin-top: 50px;
}
#case,
#threeStrengths,
#interview,
#strengths{
	background: url("../img/common/bg_green.jpg") no-repeat;
	background-size: cover;
}
#strengths.baActive:before,
#strengths.baActive:after{
	background: #FFFFFF;
}
#strengths .inner{
	padding-top: 100px;
	padding-bottom: 100px;
	max-width: 1200px;
}
#threeStrengths h4,
#strengths .inner h4{
	color: #FFFFFF;
	font-size: 3.0rem;
	text-align: center;
	margin-bottom: 50px;
}
#threeStrengths h4 > big{
	font-size: 4.0rem;
}
#strengths .inner > ul{
	display: flex; justify-content: center;
	width: 100%;
}
#strengths .inner > ul > li{
	width: calc(33.3% - 70px); margin-right: 35px; margin-left: 35px;
	position: relative;
	color: #FFFFFF;
	padding-bottom: 60px;
}
#strengths .inner > ul > li:nth-child(2) .img{
	transition-delay: 0.3s;
}
#strengths .inner > ul > li:nth-child(3) .img{
	transition-delay: 0.6s;
}
@media screen and (max-width: 1010px) {
	#strengths .inner > ul > li{
		width: calc(33.3% - 40px); margin-right: 15px; margin-left: 15px;
	}
}

#strengths .inner > ul > li .info .title{
	font-size: 2.4rem;
	margin-bottom: 20px;
	margin-top: 55px;
}
#strengths .inner > ul > li .info > span{
	position: relative;
	display: block;
}
#strengths .inner > ul > li .info .text{
	font-size: 1.6rem;
	margin-bottom: 30px;
}
#strengths .inner > ul > li .info > .btnArrow{
	width: 100%; margin-left: auto; margin-right: auto;
	position: absolute; bottom: 0; left: 0; right: 0;
}
#strengths .inner > ul > li .info > .btnArrow:after{
	transform: rotate(-45deg)
}
#recruit h3 .shippori-mincho-medium,
#recruit .textArea .noto-sans-jp-regular{
	color: #FFFFFF;
}
#recruit.baActive:before{
	background: url("../img/common/bg_green.jpg");
	background-size: cover;
}
#recruit.baActive:after{
	display: none;
}
#recruit .inner{
	padding-top: 140px; padding-bottom: 50px;
	display: flex;
}
#recruit .inner .textArea{
	flex-direction: column;
}
#recruit .inner .textArea > h3{
	display: flex; position: relative;
	flex-direction: column;
	margin-bottom: 50px;
}
#recruit .effect-img,
#recruit .effect-img > div{
	height: 100%;
	width: 100%;
}

#recruit .effect-img > div img{
	height: 100%; width: auto;
	left: 50vw; margin-left: -50vw;
	position: relative;
	display: block;
}
@media screen and (min-width: 1500px) {
	#recruit .effect-img > div img{
		height: auto; width: 100%;
		left: 0; margin-left: auto;
	}
}

#recruit .inner .textArea{
	width: 100%; max-width: 460px;
}
#recruit .inner .textArea p{
	line-height: 2;
	margin-bottom: 20px;
}
#recruit .inner .textArea .btnArrow{
	margin-top: 50px;
}
#about-page #access{
	background: #F5F3F0;
}
#about-page #access:before,
#about-page #access:after{
	background: #FFFFFF;
}
#access h3 .bellefair-regular{
	color: #F5F3F0;
}

#access:before,
#access:after{
	background: #F5F3F0;
}
#access .inner{
	padding-top: 150px;
	padding-bottom: 120px;
	display: flex;
	justify-content: flex-end;
}
#about-page #access .inner{
	justify-content: flex-start;
}
#access .inner .textArea{
	padding-left: 10%;
	flex-direction: column;
}
#access .inner .textArea > h3{
	display: flex; position: relative;
	flex-direction: column;
	margin-bottom: 50px;
}
#access .effect-img > div{
	height: 100%;
	width: 100%;
}
#access .effect-img{
	height: 100%;
	width: 50%;
	overflow: hidden;
}
#about-page #access .effect-img{
	left: 50%;
}
#access .effect-img > iframe{
	width: 100%;
    height: calc(100% + 300px);
    margin-top: -150px;
}
#access .effect-img > div img{
	height: 100%; width: auto;
	left: 50vw;
	bottom: 0;
	margin-left: -50vw;
	position: relative;
	display: block;
}
@media screen and (min-width: 1500px) {
	#access .effect-img > div img{
		height: auto; width: 100%;
		left: 0;
		margin-left: auto;
	}
}
#access h3 .shippori-mincho-medium{
	font-size: 1.6rem;
}

#access .inner .textArea{
	width: 100%; max-width: 460px;
}
#access .inner .textArea p{
	line-height: 2;
}
.buttonIcon{
	display: flex; position: relative;
	justify-content: flex-start;
	align-items: center;
	color: #373737;
	font-size: 1.8rem;
	text-decoration: none;
	transition:0.3s ease-out;
}
.buttonIcon > .icon{
	width: 60px;
	height: 60px;
	position: relative; display: block;
	margin-right: 10px;
}
.buttonIcon > .icon:before,
.buttonIcon > .icon:after{
	position: absolute;
	display: block;
	content: '';
	width: 100%; height: 100%;
	background: url("../img/common/btn_arrow_gray.svg") no-repeat;
	background-size: cover;
	transition:0.3s;
}
.buttonIcon > .icon:after{
	background: url("../img/common/btn_arrow_red.svg") no-repeat;
	background-size: cover;
	opacity: 0;
	transition:0.3s;
}
.buttonIcon.down > .icon:before{
	background: url("../img/common/btn_arrow_down.svg") no-repeat;
	background-size: cover;
}
.buttonIcon.down > .icon:after{
	background: url("../img/common/btn_arrow_down_gray.svg") no-repeat;
	background-size: cover;
}


@media screen and (min-width:769px) {
	.buttonIcon:hover{
		color: #BA0015;
	}
	.buttonIcon.down:hover{
		color: #373737;
	}
	.buttonIcon:hover > .icon:before{opacity: 0;}
	.buttonIcon:hover > .icon:after{opacity: 1;}
}
.in-page{
	width: 100%; max-width: 315px;
	justify-content: space-between;
	align-items: center;
}
.sub_top .in-page{
	position: absolute; right: 0px;
	top: 25px; bottom: 0; margin: auto 0;
}
.sub_top .in-page .buttonIcon{
	min-width: 130px;
}
.modal{
	position: fixed; display: none;
	top: 0; left: 0; width: 100%; height: 100%;
	z-index: 99999;
}
.modalArea .in ul{
	flex-wrap: wrap;
	color: #FFFFFF;
	font-size: 1.4rem;
}
.modalArea .in ul li{
	width: calc(50% - 30px);
	margin-bottom: 40px;
}
.modalArea .in ul li > .img{
	margin-bottom: 15px;
}
.modalArea .in ul li > :last-child{
	font-size: 1.6rem; margin-top: 5px;
}
.modalArea .in ul li:nth-child(2n-1){
	margin-right: 60px;
}
.modal .modal_bg{
	position: absolute; display: block;
	width: 100%; height: 100%; background: rgba(0,0,0,0.8);
	top: 0; left: 0;
}
.modal .modalArea{
	position: relative; display: block;
	width: calc(100% - 30px); height: 96%;
	max-width: 900px; margin: 2% auto;
}
.modal .modalArea .in{
	position: relative; display: block;
	overflow-y: auto;
	height: 100%;
	width: 100%;
	padding-top: 40px;
}
.modal .modalArea .in.scroll__inner{
	padding-right: 30px; padding-left: 30px;
}
.simplebar-scrollbar::before {
  background: #BA0015;
  border-radius: 0;
  width: 2px;
  z-index: 1;
  display: block;
  top: 0px;
  bottom: 0px;
  left: 0px;
  right: 0px;
}
.simplebar-scrollbar.simplebar-visible::before {
  opacity: 1;
}
.simplebar-track {
  background: rgba(255,255,255,0.3);
  width: 2px !important;
}
.modal .modalArea .title{
	font-size: 3.0rem;
	margin-bottom: 50px; color: #FFFFFF;
}
.modal .modalArea .img > img{
	width: 100%; height: auto;
}
.modal .modalArea .btnClose{
	width: 50px; height: 50px;
	top: 43px; right: 30px;
	cursor: pointer;
	z-index: 1;
}
.modal .modalArea .btnClose:before,
.modal .modalArea .btnClose:after{
	content: ''; position: absolute; display: block;
	width: 100%; height: 2px;
	background: #FFFFFF;
	transform-origin: center center;
	top: 0; left: 0; right: 0; bottom: 0;
	margin: auto;
	transition:0.3s ease-out;
}
.modal .modalArea .btnClose:before{
	transform: rotate(30deg);
}
.modal .modalArea .btnClose:after{
	transform: rotate(-30deg);
}
#youtube .modalArea{
	position: absolute;
	margin: auto;
	top: 0; left: 0; right: 0; bottom: 0;
	height: auto;
	aspect-ratio: 16 / 9;
}
#youtube .modalArea .btnClose{
	top: -100px;
}
.movieWrap,
.movieWrap iframe {
  width: 100%; height: 100%;
}

@media screen and (min-width:769px) {
	.modal .modalArea .btnClose:hover:before{
		transform: rotate(45deg);
	}
	.modal .modalArea .btnClose:hover:after{
		transform: rotate(-45deg);
	}
}

#news{
	background: #F5F3F0;
}
#news.baActive:before{
	background: #FFFFFF;
}
#news.baActive:after{
	background: url("../img/common/bg_green.jpg");
	background-size: cover;
}
#news .inner{
	padding-top: 110px;
	padding-bottom: 150px;
}
#news .inner h4{
	color: #373737;
	font-size: 3.0rem;
	text-align: center;
	margin-bottom: 40px;
}
#news .snsArea{
	justify-content: space-between;
	align-items: stretch;
}
#news .snsArea > div{
	width: calc(50% - 50px);
	position: relative;
}

#news .snsArea > div.facebook{
	height: 800px; background: #FFFFFF;
	display: block;
}
.fb_iframe_widget,
.fb_iframe_widget span,
.fb_iframe_widget iframe{
    width: 100% !important;
	height: 800px !important;
}

#news .snsArea > div.right{
	display: flex; justify-content: space-between;
	flex-direction: column;
}
#news .snsArea > div.right > div.x{
	background: #FFFFFF;
	display: block;
	height: 375px;
	width: 100%;
}
#news .snsArea > div.right > div.x iframe{
  width: 100% !important;
}
#news .snsArea > div.right > div.sdgs{
	border: 6px solid #0098D8; background: #FFFFFF;
	padding: 20px 20px 25px;
	font-size: 1.6rem;
	color: #373737;
	height: auto;
}
#news .snsArea > div.right > div.sdgs > img{
	margin-bottom: 20px;
}
#news .snsArea > div.right > div.sdgs > .btnArrow{
	margin: 20px auto 0;
}
#news .snsArea > div.right > div.sdgs > .btnArrow:after{
	transform: rotate(-45deg);
}
.footerArea2,
.footerArea{
	height: 200px; z-index: 3;
}
.footerArea2.baActive:before{
	background: #F5F3F0;
}
.footerArea.baActive:before{
	background: url("../img/common/bg_green.jpg");
	background-size: cover;
}
.footerArea2.baActive:after,
.footerArea.baActive:after{
	display: none;
}
.footerArea .helmet,
.footerArea2 .helmet{
	right: 10px; top: -45px;
	position: absolute; display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	width: 195px;
}
.footerArea .helmet > :nth-child(1),
.footerArea2 .helmet > :nth-child(1){
	margin-bottom: 5px;
}

@media screen and (min-width:769px) {
	.footerArea .helmet:hover > :nth-child(2),
	.footerArea2 .helmet:hover > :nth-child(2) {
		animation: hoverShake 0.15s linear 3;
	}
}

@keyframes hoverShake {
  0% {transform: skew(0deg,0deg);}
  25% {transform: skew(1deg, 1deg);}
  75% {transform: skew(-1deg, -1deg);}
  100% {transform: skew(0deg,0deg);}
}

section .inner .subText{
	color: #373737;
	font-size: 1.6rem;
	line-height: 2;
	text-align: center;
	margin-bottom: 40px;
}
.bottomArea:before{
	background: #F5F3F0;
}
.bottomArea:after{
	background: #FFFFFF;
}
.bottomArea .effect-img > .rel > img{
	opacity: 0;
}
.bottomArea .effect-img > .rel:after{
	content: '';
	position: absolute; display: block;
	width: 200%; height: 100%;
	top: 0;
	transition:3.3s ease-out;
}
.bottomArea .effect-img > .img01:after{
	background: url("../img/top/bottom_img01.png") repeat-x;
	background-size: auto 100%;
	background-position: left top;
	left: -25%;
}
.bottomArea .effect-img > .img02:after{
	background: url("../img/top/bottom_img02.png") repeat-x;
	background-size: auto 100%;
	background-position: left top;
	right: -25%;
}
.bottomArea .effect-img > .img03:after{
	background: url("../img/top/bottom_img03.png") repeat-x;
	background-size: auto 100%;
	background-position: left top;
	left: -25%;
}

.bottomArea.effect-scroll .effect-img > .img01:after,
.bottomArea.effect-scroll .effect-img > .img03:after{
	left: 0;
}
.bottomArea.effect-scroll .effect-img > .img02:after{
	right: 0;
}
.btn{
	cursor: pointer;
}
.bannerArea{
	background: #F5F3F0;
	padding: 100px 0 100px;
}
section .button,
section .banner{
	transition: 0.5s ease-out;
}
.bannerArea .banner{
	width: calc(100% - 30px); max-width: 1100px;
	margin: 0 auto;
	cursor: pointer;
}
.baActive.bannerArea:before{
	display: none;
}
.baActive.bannerArea:after{
	background: #FFFFFF;
}
footer{
	position: relative; display: block;
	margin-top: -50px;
	line-height: 1.5;
	padding-bottom: 40px;
}
footer > .inner > a,
footer > .inner > p{
	text-align: center;
	color: #373737;
	position: relative; display: block;
}
footer > .inner{
	flex-direction: column;
	align-items: center;
}
footer > .inner > :nth-child(1){
	display: block; margin: 0 auto 20px;
}
footer > .inner > :nth-child(2){
	font-size: 1.8rem;
	margin-bottom: 5px;
	margin-bottom: 10px;
}
footer > .inner > :nth-child(3){
	font-size: 1.6rem;
	margin-bottom: 20px;
}
footer > .inner > ul.flexBlock{
	justify-content: center;
	align-items: center;
	margin-bottom: 20px;
}
footer > .inner > ul.flexBlock > li{
	width: 40px;
	margin: 0 10px;
}
footer > .inner > ul.flexBlock > li > a > img{
	display: block; max-width: 100%;
	transition:0.3s ease-out;
}
footer > .inner > ul.flexBlock > li > a:after{
	content: '';
	width: 100%; height: 100%;
	position: absolute; display: block;
	top: 0; left: 0;
	background: url("../img/common/icon_facebook_r.svg") no-repeat;
	background-size: contain;
	transition:0.3s ease-out;
	opacity: 0;
}
footer > .inner > ul.flexBlock > li:nth-child(2) > a:after{
	background: url("../img/common/icon_x_r.svg") no-repeat;
	background-size: contain;
}
footer > .inner > ul.flexBlock > li > a{
	display: block; position: relative;
}
@media screen and (min-width:769px) {
	footer > .inner > ul.flexBlock > li > a:hover > img{
		opacity: 0;
	}
	footer > .inner > ul.flexBlock > li > a:hover:after{
		opacity: 1;
	}
}

footer > .inner > a{
	font-size: 1.4rem;
	text-decoration: none;
}
.copyright{
	font-size: 1.8rem;
	margin-top: 35px;
}

.sub_top{
	height: 370px;
	padding-top: 100px; padding-bottom: 70px;
}
.breadcrumbs{
	font-family: "Noto Sans JP", sans-serif;
	font-optical-sizing: auto;
	font-weight: 400;
	font-style: normal;
	
	display: flex;
	justify-content: flex-start;
	align-items: flex-start;
}
.breadcrumbs li{
	font-size: 1.4rem;
	color: #707070;
	display: flex;
	justify-content: flex-start;
	align-items: center;
}
.breadcrumbs li:after{
	content: '>';
	position: relative; display: block;
	margin: 0 5px;
}
.breadcrumbs li:last-child:after{
	display: none;
}
.breadcrumbs li a{
	text-decoration: underline;
	color: #707070;
	display: block;
	position: relative;
	z-index: 1;
}
@media screen and (max-width:768px) {
  .breadcrumbs{
    display:flex;
    overflow-x: scroll;
    word-break: keep-all;
    white-space: nowrap;
  }
}
@media screen and (min-width:769px) {
	.breadcrumbs li a:hover{
		text-decoration: none;
	}
}
.sub_top h2{
	position: relative; display: block;
}
.sub_top h2 span.bellefair-regular{
	font-size: clamp(10rem, 6.364rem + 18.18vw, 20rem);
	color: #F5F3F0;
	line-height: 1;
	transform: translateX(-3.5%);
	position: relative; display: block;
	white-space: nowrap;
}
.sub_top h2 span:nth-child(1){
	color: #373737;
	font-size: 4.0rem;
	position: absolute;
	display: flex;
	height: 100%;
	justify-content: flex-start;
	align-items: center;
	z-index: 1;
	letter-spacing: 0.1em;
}
#topImgSub .inner{
	height: 500px;
}
#topImgSub .inner .textArea{
	height: 100%; justify-content: flex-start;
	align-items: center;
	width: 100%; max-width: 450px;
}
#topImgSub .inner .textArea > p{
	font-size: 1.6rem;
	line-height: 2;
	color: #FFFFFF;
}
#topImgSub.baActive:before{
	display: none;
}
#topImgSub.baActive:after{
	background: #862f2d;
}
#movie.baActive{
	background: #BA0015;
}
#movie.baActive:before{
	background: #FFFFFF;
}
#movie.baActive:after{
	background: url("../img/common/bg_green.jpg");
	background-size: cover;
}
#about-page #movie.baActive:after{
	background: #F2F2F2;
}

#movie .inner{
	padding-top: 100px;
	padding-bottom: 100px;
	display: flex;
	justify-content: space-between;
}
#movie .inner > div{
	width: calc(50% - 50px);
	color: #FFFFFF;
	letter-spacing: 0.5em;
}
#movie .inner h3{
	font-size: 3.0rem;
	margin-bottom: 25px;
}
#movie .inner p{
	font-size: 1.6rem; line-height: 2;
}
#interview.baActive:before{
	background: #BA0015;
}
#interview.baActive:after{
	background: #F5F3F0;
}
#interview .inner{
	padding-top: 90px;
	padding-bottom: 90px;
	color: #FFFFFF;
}
.interview_top{
	width: 100%; max-width: 1100px;
	height: 370px;
	margin-bottom: 70px;
}
.interview_top .effect-img{
	left: 50%; transform: translateX(-50%);
}
.interview_top .effect-img > div,
.interview_top .effect-img{
	height: 100%;
}
.interview_top .effect-img img{
	height: 100%; width: auto;
}
.interview_top .text{
	width: 75%; max-width: 500px;
	margin-left: auto; margin-right: 50px;
	height: 100%; display: flex; position: relative;
	align-items: center; justify-content: center;
	flex-direction: column;
	font-size: 1.6rem; line-height: 2;
	text-align: left;
}
.interview_top .text h3{
	margin-bottom: 25px;
}
#history h4,
#overview h4,
#faq h4,
.jobsArea h4,
.interviewArea h4{
	font-size: 3.0rem; text-align: center;
	margin-bottom: 40px;
}
.jobsArea ul{
	display: flex; justify-content: flex-start;
	padding-left: 20px;
	overflow-x: auto;
	padding-bottom: 50px;
	align-items: stretch;
}
.interviewArea ul{
	display: flex; justify-content: center;
	align-items: stretch;
	padding-left: 20px;
}
.jobsArea ul li,
.interviewArea ul li{
	width: 33.3%;
	padding-left: 50px; padding-right: 20px;
	position: relative;
	padding-bottom: 90px;
}
.jobsArea ul li .nmb > span{
	position: relative; display: block;
}
.jobsArea ul li > :nth-child(3),
.interviewArea ul li > :nth-child(3){
	padding-top: 30px;
}
.jobsArea ul li > :nth-child(3) > span,
.interviewArea ul li > :nth-child(3) > span,
.jobsArea ul li > span,
.interviewArea ul li > span{
	display: block;
}
.jobsArea ul li .btnArrow,
.interviewArea ul li .btnArrow{
	margin-left: auto; margin-right: auto;
	position: absolute;
	width: calc(100% - 20px);
	left: 0; right: 0;
	bottom: 0;
}
.jobsArea ul li > span,
.interviewArea ul li > span{
	width: 100%;
	position: relative; display: block;
	font-size: 1.8rem;
	color: #FFFFFF;
}
.jobsArea ul li > span{
	font-size: 1.6rem;
}
#strengthsList > .rel .nmb,
#strengths ul li .nmb,
.jobsArea ul li .nmb,
.interviewArea ul li .nmb{
	position: absolute;
	width: 30%; aspect-ratio: 1;
	display: flex; text-align: center;
	justify-content: center; align-items: center;
	font-size: clamp(3rem, 2.273rem + 3.64vw, 5rem);
	color: #FFFFFF;
	transform: translate(-46%, -56%);
	line-height: 1;
}
#strengthsList > .rel .nmb{
	right: 0; top: 0; transform: translateY(-100%);
	width: 100px;
}
.jobsArea ul li .nmb,
.jobsArea ul li > span{
	color: #373737;
}
#strengthsList > .rel .nmb:after,
#strengths ul li .nmb:after,
.jobsArea ul li .nmb:after,
.interviewArea ul li .nmb:after{
	content: ''; position: absolute; display: block;
	background: url("../img/common/chibakoumuten_ring_w.svg") no-repeat;
	background-size: cover;
	width: 100%; height: 100%;
	animation:rotate 12s infinite;
	animation-timing-function: linear;
	top: 4px;
}
.jobsArea ul li .nmb:after{
	background: url("../img/common/chibakoumuten_ring_b.svg") no-repeat;
	background-size: cover;
}
#strengthsList > .rel .nmb{
	color: #BA0015;
}
#strengthsList > .rel .nmb:after{
	background: url("../img/common/chibakoumuten_ring_r.svg") no-repeat;
	background-size: cover;
}
#strengthsList .btnArrow.gray:after {
	transform: rotate(-45deg);
}

.jobsArea ul li > span .name{
	text-align: center;
	font-size: 1.8rem;
	font-weight: 500;
}
.interviewArea ul li > span .name{
	text-align: center;
	font-size: 3.0rem;
}
.jobsArea ul li > span .name small,
.interviewArea ul li > span .name small{
	font-size: 1.8rem;
}
.jobsArea ul li > span .text{
	text-align: left;
}
.interviewArea ul li > span .text{
	text-align: center;
}

.jobsArea ul li > span{
	break-after: always; word-break: break-all;
	white-space: normal;
}
.jobs{
	background: #F5F3F0;
}
.jobs .inner{
	padding-top: 90px; padding-bottom: 60px;
}
.jobs:before,
.jobs:after{
	background: #FFFFFF;
}
#jobs:before{
	background: url("../img/common/bg_green.jpg");
	background-size: cover;
}

#faq .inner{
	padding-top: 100px; padding-bottom: 100px;
}
#faq.baActive:before,
#faq.baActive:after{
	background: #F5F3F0;
}

.jobsArea ul li{
	white-space: nowrap;
	width: 390px;
	min-width: 390px;
	box-sizing: border-box;
}

.faqList{
	position: relative;
	display: block;
	width: 100%;
	max-width: 900px; margin: 0 auto 20px;;
}
.faqList > div{
	position: relative; display: flex;
	width: 100%;
	justify-content: flex-start;
	align-items: center;
	padding: 20px 10px 20px 20px;
}
.faqList > div:nth-child(2){
	align-items: flex-start;
}
.faqList > div > :nth-child(2){
	text-align: left;
}
.faqList > div:nth-child(1) > .toggleBtn{
	position: relative; display: block; margin-left: auto;
	width: 40px;
}
.faqList > div:nth-child(1) > .toggleBtn > img{
	display: block; transition:0.3s ease-out;
	transform: rotate(0deg);
}
.faqList.active > div:nth-child(1) > .toggleBtn > img{
	transform: rotate(180deg);
}
.faqList > div:nth-child(1){
	font-size: 1.8rem; color: #FFFFFF;
	background: #158C5D; cursor: pointer;
}
.faqList > div > :nth-child(2){
	width: calc(100% - 80px);
}
.faqList > div > .bellefair-regular{
	font-size: 3.0rem; line-height: 1; width: 40px;
}
.faqList > div:nth-child(2){
	font-size: 1.6rem; color: #373737;
}
.faqList > div:nth-child(2) > .bellefair-regular{
	color: #BA0015;
	padding-top: 3px;
}

.menuOpen{
	width: 40px;
	height: 40px;
	right: 20px;
	top: 0; bottom: 0;
	margin: auto 0;
	cursor: pointer;
}
.menuOpen > span{
	width: 40px; height: 2px; background: #373737;
	transition:0.3s ease-out;
	transform-origin: center center;
	position: absolute; display: block;
	left: 0;
}
.menuOpen > span:nth-child(1){
	top: 9px;
}
.menuOpen > span:nth-child(2){
	top: 0; bottom: 0;
	margin: auto 0;
	transform-origin: center right;
}
.menuOpen > span:nth-child(3){
	bottom: 9px;
}
.open .menuOpen > span:nth-child(1){
	top: 19px; transform: rotate(30deg);
}
.open .menuOpen > span:nth-child(2){
	transform: scale(0, 0);
}
.open .menuOpen > span:nth-child(3){
	bottom: 19px; transform: rotate(-30deg);
}
#philosophy{
	background: #F2F2F2;
}
#philosophy.baActive:before{
	background: #BA0015;
}
#philosophy.baActive:after{
	background: #FFFFFF;
}
#philosophy .inner{
	padding-top: 150px;
	padding-bottom: 150px;
	max-width: 900px;
}
#message h3.red,
#philosophy h3.red{
	font-size: 2.0rem;
	color: #BA0015;
	text-align: center;
}
#message h4,
#philosophy h4{
	font-size: 3.0rem;
	color: #373737;
	text-align: center;
	margin-bottom: 50px;
}
#message h3.red,
#message h4{
	text-align: left;
}

#message:before{
	background: #F2F2F2;
}
#message:after{
	background: #F5F3F0;
}
#message .inner{
	padding-top: 140px; padding-bottom: 110px;
}
#message > .effect-img{
	width: 50%; height: 100%; left: 0; top: 0;
	overflow: hidden;
}
#message > .inner > .textArea{
	padding-left: 10%;
	width: 50%; flex-direction: column;
	margin-left: auto; margin-right: 0;
}
#message > .effect-img > img{
	height: 100%; width: auto;
	left: 50%; transform: translateX(-50%);
	position: absolute; display: block;
}
#message > .inner > .textArea p{
	font-size: 1.6rem; color: #373737;
	margin-top: 40px;
}
#message > .inner > .textArea p.right{
	text-align: right;
}
#message > .inner > .textArea p strong{
	font-size: 20px;
}
#overview{
	background: #F5F3F0;
}
#overview:after,
#overview:before{
	background: #FFFFFF;
}
#overview .inner{
	padding-top: 100px; padding-bottom: 150px;
}
#overview .inner .table{
	width: 100%; max-width: 900px;
	margin-left: auto; margin-right: auto;
	border-top: 1px #B3B3B3 solid;
}
#overview .inner .table > div{
	position: relative; display: flex; width: 100%;
	justify-content: flex-start;
	align-items: flex-start;
	padding: 30px 0;
	font-size: 1.6rem;
	color: #373737;
	border-bottom: 1px #B3B3B3 solid;
}
#overview .inner .table > div > p{
	position: relative; display: block;
}
#overview .inner .table > div > :nth-child(1){
	width: 150px;
	font-weight: 500;
}
#entry-page #overview .inner .table > div > :nth-child(1){
	width: 28%;
}
#overview .inner .table > div > :nth-child(2){
	font-weight: 400;
	width: calc(100% - 150px);
	display: flex; align-items: flex-start;
	justify-content: flex-start;
	flex-direction: column;
	letter-spacing: 0.1em;
}
#overview .inner .table strong{
	font-weight: 500;
}
#entry-page #overview .inner .table > div > :nth-child(2){
	width: 72%;
}
#history:before,
#history:after{
	background: #F5F3F0;
}
#history .inner{
	padding-top: 100px;
	padding-bottom: 100px;
}
#history .table{
	padding: 50px 0 0;
	width: 100%; max-width: 900px;
	margin: 0 auto;
	border-top: 1px solid #B3B3B3;
	font-size: 2.0rem;
}
#history .table > div{
	display: flex; position: relative;
	width: 100%;
	justify-content: flex-start;
	align-items: center;
	color: #373737;
	margin-bottom: 30px;
}
#history .table > div > .red{
	background: #BA0015;
	display: flex;
	width: 260px;
	max-width: 260px; min-width: 260px;
	height: 60px;
	color: #FFFFFF;
	align-items: center;
	justify-content: center;
	padding-left: 10px;
	margin-right: 30px;
	position: relative;
}
#history .table > div:before{
	width: 2px; height: 30px;
	background: #BA0015;
	content: '';
	position: absolute; display: block;
	bottom: 0;
	transform: translateY(100%);
	left: 130px;
}

#history .table > div > .red > :nth-child(1){
	width: 125px;
	font-size: 3.0rem;
	letter-spacing: 0.1rem;
}
#history .table > div > .red > :nth-child(2){
	width: 103px; font-size: 1.6rem;
	text-align: center;
	font-weight: 400;
}
#interview-page #topImgSub.baActive:after,
#works-page #topImgSub.baActive:after {
	background: url("../img/common/bg_green.jpg");
	background-size: cover;
	opacity: 0.75;
}
#threeStrengths:before{
	display: none;
}
#threeStrengths:after{
	background: #F5F3F0;
}
#threeStrengths .inner{
	padding-top: 100px; padding-bottom: 100px;
}
#threeStrengths .inner ul{
	width: 100%; max-width: 960px;
	position: relative; display: flex;
	justify-content: center;
	align-items: center;
	margin: 0 auto;
}

#threeStrengths .inner ul li{
	aspect-ratio: 1;
	width: 30%;
	margin: 0 3%;
	background: #FFFFFF;
	border-radius: 50%;
}
#strengthsList > .rel:nth-child(1):before{
	background: url("../img/common/bg_green.jpg");
	background-size: cover;
}
#strengthsList > .rel:nth-child(1):after{
	background: #FFFFFF;
}
#strengthsList > .rel:nth-child(2):before{
	background: #F5F3F0;
}
#strengthsList > .rel:nth-child(2):after{
	background: #F5F3F0;
}
#strengthsList > .rel:nth-child(3):before{
	background: #FFFFFF;
}
#strengthsList > .rel:nth-child(3):after{
	background: #FFFFFF;
}
#strengthsList > .rel{
	background: #F5F3F0;
}
#strengthsList > .rel:nth-child(2){
	background: #FFFFFF;
}
#strengthsList > .rel .effect-img{
	width: 50%; height: 100%;
}
#strengthsList > .rel .effect-img > div{
	height: 100%;
}
#strengthsList > .rel .effect-img > div img{
	width: auto; height: 100%;
	left: 50%; margin-left: -50%;
	position: relative; display: block;
}
@media screen and (min-width: 1500px) {
	#strengthsList > .rel .effect-img > div img{
		height: auto; width: 100%;
		left: 0;
		margin-left: auto;
	}
}

#strengthsList > .rel:nth-child(2) .effect-img{
	left: 50%;
}
#strengthsList > .rel .textArea{
	width: 50%; position: relative;
	left: 50%;
	display: flex;
	justify-content: flex-start; align-items: flex-start;
	padding: 140px 0 100px 10%;
}
#strengthsList > .rel:nth-child(2) .textArea{
	left: 0; padding-right: 10%; padding-left: 0;
	justify-content: flex-end;
}
#strengthsList > .rel .textArea .in{
	width: 100%; max-width: 450px;
	position: relative; display: flex;
	flex-direction: column;
}
#strengthsList > .rel .textArea .in h3{
	font-size: 2.0rem;
	color: #BA0015;
	margin-bottom: 5px;
}
#strengthsList > .rel .textArea .in h4{
	font-size: 3.0rem;
	color: #373737;
	margin-bottom: 50px;
}
#strengthsList > .rel .textArea .in p{
	font-size: 1.6rem;
	color: #373737;
	margin-bottom: 50px;
}
#interview-page #topImgSub .inner .textArea{
	flex-direction: column;
	justify-content: center;
	align-items: flex-start;
	max-width: 600px;
	margin-left: auto; margin-right: 0;
}
#case:before{
	background: #FFFFFF;
}
#case:after{
	background: #F5F3F0;
}
#case .inner{
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding-top: 100px;
	padding-bottom: 80px;
}
#case .inner > div{
	width: 50%;
}
#case .inner > .textArea{
	padding-left: 8%;
	font-size: 1.6rem;
}
#case .inner > .textArea h4{
	font-size: 6.0rem;
	margin-bottom: 5px;
	color: #FFFFFF;
}
#case .inner > .textArea h5{
	font-size: 3.0rem;
	margin-bottom: 10px;
	color: #FFFFFF;
}
#case .inner > .textArea h5 small{
	font-size: 1.8rem;
}
#case .inner > .textArea p{
	color: #FFFFFF;
}
#interview-page #jobs2:before,
#inverviewArea:before,
#inverviewArea:after{
	background: url("../img/common/bg_green.jpg");
	background-size: cover;
}
#inverviewArea{
	padding-top: 140px; padding-bottom: 140px;
	background: #F5F3F0;
	color: #373737;
}
#inverviewArea .inner{
	display: flex; justify-content: center;
	align-items: flex-start;
	flex-wrap: wrap;
	margin-bottom: 100px;
	text-align: left;
}
#inverviewArea .inner h4{
	font-size: 2.0rem;
	color: #BA0015;
	margin-bottom: 5px;
	width: 100%;
}
#inverviewArea .inner h5{
	font-size: 3.0rem;
	margin-bottom: 40px;
	width: 100%;
}
#inverviewArea .inner p{
	font-size: 1.6rem;
	width: 50%;
}
#inverviewArea .inner p > span,
#inverviewArea .inner p > strong{
	display: block; position: relative;
}
#inverviewArea .inner p strong{
	font-size: 1.8rem; font-weight: 500;
	margin-top: 40px; margin-bottom: 25px;
}
#inverviewArea .inner:nth-child(2n - 1) .img{
	width: 50%; padding-left: 10%;
}
#inverviewArea .inner:nth-child(2n) .img{
	width: 50%; padding-right: 10%;
}

#inverviewArea .bottomText{
	border-radius: 20px;
	background: url("../img/common/bg_green.jpg") no-repeat;
	background-size: cover;
	padding: 80px;
	color: #FFFFFF;
	justify-content: flex-start;
	align-items: center;
}
#inverviewArea .bottomText > div{
	display: flex; position: relative;
	align-items: center;
	justify-content: flex-start;
	color: #FFFFFF;
}
#inverviewArea .bottomText .title{
	width: 120px;
	text-align: center;
	font-size: 3.0rem;
}
#inverviewArea .bottomText .text{
	text-align: left;
	width: calc(100% - 120px);
	font-size: 1.6rem;
	padding-left: 80px;
	border-left: 2px solid #FFFFFF;
}
.bottomBtn{
	margin: 0 auto;
}
#interview-page #interview:before,
#interview-page #interview:after{
	background: #F5F3F0;
}

#privacy{
	background: #F5F3F0;
}
#privacy:before{
	display: none;
}
#privacy:after{
	background: #FFFFFF;
}
#privacy .inner{
	max-width: 900px;
	padding-top: 90px;
	padding-bottom: 120px;
	font-size: 1.6rem;
	line-height: 2;
}
#privacy .inner h3{
	font-size: 2.0rem;
	font-weight: 500;
	margin-bottom: 10px;
}
#privacy .inner > div a{
	color: #373737;
}
#privacy .inner > div{
	margin-top: 40px; padding-top: 30px;
	border-top: 1px solid #B3B3B3;
}
#privacy .inner > div > ol{
	counter-reset: number;
	margin-top: 10px;
}
#privacy .inner > div > ol li {
  position: relative;
  padding-left: 40px;
}
#privacy .inner > div > ol li:before {
  counter-increment: number;
  content: '（' counter(number) '）';
  position: absolute;
  left: 0;
}
#privacy .inner > div .info{
	font-size: 1.6rem;
	position: relative;
	display: flex;
	justify-content: flex-start;
	align-items: flex-start;
	flex-direction: column;
	margin-top: 20px;
}
#privacy .inner > div .info > :nth-child(1){
	font-size: 1.8rem;
}
.form-area .sub_top.baActive:before,
.form-area .sub_top.baActive:after{
	background: #F5F3F0;
	display: block;
}
section#form:before,
section#form:after{
	background: #FFFFFF;
}
section#form{
	background: #F5F3F0;
}
section#form .inner{
	max-width: 900px;
	font-size: 1.6rem;
	padding-top: 90px; padding-bottom: 150px;
}
section#form .inner form > .flexBlock > :nth-child(-n+2){
	font-weight: 500;
}
section#form .inner form > .flexBlock{
	justify-content: flex-start;
	align-items: flex-start;
	text-align: left;
	margin-bottom: 40px;
}
section#form .inner form > .flexBlock > :nth-child(1){
	width: 60px;
	text-align: center;
}
section#form .inner form > .flexBlock > :nth-child(2){
	width: calc(33% - 60px);
	padding-left: 30px;
	height: 60px;
	display: flex; justify-content: flex-start;
	align-items: center;
}
section#form .inner form > .flexBlock > :nth-child(3){
	width: calc(100% - 33%);
}
section#form .inner form > .flexBlock > :nth-child(3) > input{
	min-height: 60px;
	font-size: 1.8rem;
	display: flex; position: relative;
	align-items: center; justify-content: flex-start;
	padding: 0 15px;
	background: #FFFFFF;
	width: 100%;
}
section#form .inner form > .flexBlock > .cate input{
	background: #F5F3F0;
	outline: none; border: none;
}
section#form .inner form .required{
	color: #BA0015;
	display: flex;
	position: relative; width: 60px; height: 60px;
	border: 2px solid #BA0015;
	justify-content: center; align-items: center;
}
section#form .inner form > .flexBlock > :nth-child(3) textarea{
	background: #FFFFFF;
	width: 100%; height: 300px; resize: none;
	padding: 15px;
}
section#form .inner form > .flexBlock > :nth-child(3) input[type=checkbox]{
	width: 20px; height: 20px; min-height: 20px;
	margin-right: 15px;
}
section#form .inner form > .hasChk > :nth-child(3){
	display: flex; align-items: center; justify-content: flex-start;
}
section#form .inner form > .hasChk > :nth-child(3) a{
	color: #373737;
	text-decoration: underline;
	font-weight: 500;
}
section#form .btns{
	justify-content: center; align-items: center;
}
section#form .btns #btnNext{
	pointer-events: none; opacity: 0.3;
}
section#form .btns #btnNext.is-active{
	pointer-events: all; opacity: 1;
}
.form-area .step1,
.form-area .step2,
.form-area .step3{
	display: none !important;
}
.form-area.s3 .step3,
.form-area.s2 .step2,
.form-area.s1 .step1{
	display: flex!important;
}

#contact-page.form-area.s3 .subText{
	display: none !important;
}

.form-area.s2 section#form .inner form > .flexBlock > :nth-child(3) > input,
.form-area.s2 section#form .inner form > .flexBlock > :nth-child(3) textarea{
	background: #F5F3F0;
	pointer-events: none;
	height: auto;
}
.form-area.s2 section#form .inner form > .flexBlock > :nth-child(3) > input::placeholder,
.form-area.s2 section#form .inner form > .flexBlock > :nth-child(3) textarea::placeholder{
	opacity: 0;
}

.step2.btns > :nth-child(1){
	margin-right: 50px;
}
.form-area.s2 section#form .inner form > .hasChk > :nth-child(3){
	pointer-events: none;
}
.form-area.s3 #form_body{
	display: none; visibility: hidden;
	pointer-events: none;
}
.contact-success{
	display: flex;
	text-align: center;
	justify-content: center;
	align-items: center;
	flex-direction: column;
}
.contact-success h3{
	font-size: 3.0rem;
	margin-bottom: 50px;
}
.contact-success p{
	font-size: 1.6rem;
	font-weight: 400;
	margin-bottom: 100px;
}

@media screen and (min-width:769px) {
	footer > .inner > a:hover{
		text-decoration: underline;
	}
}

@media screen and (max-width: 1260px) {
	#header .inner{
		padding-left: 15px;
	}
	.top-nav .link li{
		margin-right: 15px;
	}
	#access .effect-img,
	#works .effect-img{
		width: 50%;
	}
}
@media screen and (max-width: 1010px) {
	#strengthsList > .rel .nmb,
	#strengths ul li .nmb,
	.jobsArea ul li .nmb,
	.interviewArea ul li .nmb{
		width: 80px;
		font-size: 4rem;
		transform: translate(-38%, -65%);
	}
	#message > .inner > .textArea{
		padding-right: 50px;
	}
}
@media screen and (max-width: 960px) {
	#works .effect-img{
		width: calc(100% - 500px);
	}
}
@media screen and (max-width: 900px) {
	.modal .modalArea .btnClose{
		top: 37px; right: 15px;
		width: 40px;
	}
	#header .inner{
		padding-left: 5px;
		width: 75%;
	}
	.top-nav .link li{
		margin-right: 5px;
	}
	#header .info{
		width: 25%;
	}
	#first .inner #firstTitle,
	.fixed_area h2{
		font-size: 5.5rem;
		min-width: 330px;
	}
	h3 .bellefair-regular{
		font-size: 16rem;
	}
	h3 .shippori-mincho-medium{
		font-size: 2.6rem;
	}
	#access .effect-img{
		width: calc(100% - 500px);
	}
	#about-page #access .effect-img{
		width: 50%;
	}
	.btnArrow > span{
		font-size: 1.6rem;
	}
	#strengthsList > .rel .nmb,
	#strengths ul li .nmb,
	.jobsArea ul li .nmb,
	.interviewArea ul li .nmb{
		width: 75px;
		font-size: 3.5rem;
		transform: translate(-38%, -65%);
	}
	.jobsArea ul li .nmb:before{
		content: '';
		width: 150%;
		height: 150%;
		background: #F5F3F0;
		border-radius: 50%;
		top: 50%; left: 50%;
		position: absolute; display: block;
		transform: translate(-53%, -45%);
	}
}

@media screen and (max-width:768px) {
	#header .inner{
		padding-left: 15px;
		width: 100%;
	}
	main{
		padding-top: 60px;
	}
	.top_img .container:before{
		background: url("../img/top/top_img_sp.png") no-repeat center center;
		background-size: cover;
		height: calc(100vh - 60px);
	}
	#header .inner{
		height: 60px;
	}
	#header .inner h1{
		width: 176px;
	}
	.top-nav{
		transition:0.35s ease-out;
		z-index: 99;
		transform: translateX(200%);
		position: fixed;
		width: 100%;
		height: calc(100% - 60px);
		top: 60px; left: 0;
		background: rgba(186, 0, 21, 0.9);
	}
	.top-nav:before{
		content: '';
		position: absolute; display: block;
		width: 100%;
		height: 100%;
		background: rgba(186, 0, 21, 0.9);
		left: -100%;
		clip-path: polygon(100% 0, 100% 100%, 0% 50%);
	}
	.open .top-nav{
		transform: translateX(0%);
	}
	#header .info{
		position: fixed;
		bottom: 0;
		width: 100%;
		top: auto;
		right: 0;
		height: 100px;
		z-index: 98;
	}
	#header .info li:nth-child(1) a:nth-child(1){
		height: 60px;
	}
	#header .info li:nth-child(1) a:nth-child(2){
		height: 40px;
	}
	#header .info li:nth-child(2) a{
		height: 100px;
	}
	.top-nav .link{
		padding-top: 50px;
		flex-direction: column;
		width: 250px;
		align-items: flex-start;
		justify-content: space-around;
		margin-left: auto; margin-right: auto;
		height: 100%;
		max-height: 530px;
	}
	.top-nav .link > li a{
		color: #FFFFFF;
		font-size: 1.8rem;
		text-align: left;
	}
	.top-nav .link > li{
		margin-right: 0;
	}
	.top-nav .link > li:last-child a{
		font-size: 1.4rem;
	}
	.top-nav .link > li.link-news{
		display: flex; justify-content: space-between; align-items: center;
		width: 100%;
		margin-bottom: 20px;
	}
	.top-nav .link > li.link-news > ul{
		display: flex;
		align-items: center;
	}
	.top-nav .link > li.link-news > ul li img{
		max-width: 100%;
	}
	.top-nav .link > li.link-news > ul li{
		margin-right: 20px;
	}
	.top-nav .link > li.link-news > ul li:last-child{
		margin-right: 0;
	}
	#header:before{
		height: 33px;
		width: 100%;
		bottom: -33px;
	}
	.baActive:before,
	.baActive:after{
		height: 33px;
		width: 100%;
	}
	.baActive:after{
		display: none;
	}
	.fixed_area{
		padding: 0 25px;
	}
	#first .inner #firstTitle,
	.fixed_area h2{
		font-size: 3.6rem;
	}
	#first .inner #firstTitle{
		margin-bottom: 30px;
	}
	.top_banner {
		width: 162px;
		height: 162px;
		right: 0px;
		bottom: -15px;
	}
	.top_banner .in{
		width: 140px;
		height: 140px;
	}
	#first .inner{
		flex-direction: column;
	}
	section .inner{
		padding-left: 25px; padding-right: 25px;
	}
	.rotateG::before {
		width: 90px;
		height: 90px;
		top: -70px;
		left: 15px;
	}
	.subArea {
		padding: 100px 0 80px;
	}
	#first .inner .text{
		font-size: 1.4rem;
		max-width: 100%;
	}
	h3 .bellefair-regular{
		font-size: clamp(10rem, 8.182rem + 9.09vw, 15rem);
	}
	h3 .noto-sans-jp-medium{
		font-size: 1.6rem;
	}
	h3 .shippori-mincho-medium{
		font-size: 2.4rem;
	}
	#about .textArea .noto-sans-jp-regular,
	#about h3 .shippori-mincho-medium{
		color: #FFFFFF;
	}
	.textArea .noto-sans-jp-regular{
		font-size: 1.4rem;
	}
	#interview-page .textArea .noto-sans-jp-regular{
		font-size: 1.6rem;
	}
	.bannerArea .banner{
		max-width: 295px;
	}
	.bannerArea{
		padding: 40px 0 40px;
	}
	#about .inner .textArea{
		margin-left: auto;
		margin-right: auto;
	}
	#about .inner .textArea .btnArrow{
		margin: 25px auto 0;
	}
	#recruit .effect-img > div img,
	#about .effect-img > div img {
		height: auto;
		width: 100%;
		left: 0;
		margin-left: 0;
	}
	.btnArrow{
		font-size: 1.6rem;
		height: 50px;
	}
	.btnArrow{
		width: 260px;
	}
	#about .inner {
		padding-top: 100px;
		padding-bottom: 100px;
	}
	#works .effect-img {
		position: relative;
		width: 100%;
		height: auto;
	}
	#strengthsList > .rel .effect-img:after,
	#access .effect-img:after,
	#works .effect-img:after{
		content: '';
		height: 33px;
		position: absolute; display: block;
		width: 100%;
		z-index: 1;
		bottom: 0; right: 0;
		clip-path: polygon(0 100%, 100% 0, 100% 100%);
		background: #FFFFFF;
	}
	#works .inner {
		padding-top: 100px;
		padding-bottom: 70px;
		justify-content: center;
	}
	#works .inner .textArea .btnArrow{
		margin-left: auto; margin-right: auto;
	}
	#threeStrengths h4,
	#history h4,
	#overview h4,
	#faq h4,
	.jobsArea h4,
	.interviewArea h4,
	#strengths .inner h4{
		font-size: 2.4rem;
		margin-bottom: 40px;
		text-align: left;
	}
	#threeStrengths h4 > big{
		font-size: 3.0rem;
	}
	#strengths .inner > ul{
		flex-direction: column;
		max-width: 360px;
		margin-left: auto; margin-right: auto;
	}
	#strengths .inner > ul > li {
		width: 100%;
		margin-right: 0px;
		margin-left: 0px;
		margin-bottom: 50px;
	}
	#interview,
	#strengths {
		background: url("../img/common/bg_green.jpg") repeat;
		background-size: auto 500px;
	}
	#strengths .inner > ul > li .info .btnArrow{
		margin: 0 auto;
	}
	#strengths .inner {
		padding-top: 100px;
		padding-bottom: 20px;
		max-width: 1200px;
	}
	#recruit .inner .textArea{
		margin-left: auto;
		margin-right: auto;
	}
	#recruit .inner {
		padding-top: 100px;
		padding-bottom: 30px;
	}
	section#recruit .button, section .banner{
		max-width: 320px;
		margin-left: auto; margin-right: auto;
	}
	#access .effect-img {
		width: 100%;
		height: 375px;
		position: relative;
	}
	#access .inner {
		padding-top: 70px;
		padding-bottom: 30px;
	}
	#access .inner .textArea > h3{
		margin-bottom: 30px;
	}
	#access h3 .shippori-mincho-medium{
		font-size: 1.4rem;
	}
	.buttonIcon{
		font-size: 1.6rem;
	}
	.buttonIcon > .icon{
		width: 50px;
		height: 50px;
	}
	#news .inner h4{
		font-size: 2.4rem;
		text-align: left;
	}
	section .inner .subText{
		font-size: 1.4rem; text-align: left;
	}
	#news .snsArea{
		flex-direction: column;
		justify-content: center;
		max-width: 500px;
		margin-left: auto; margin-right: auto;
	}
	#news .snsArea > div.facebook{
		width: 100%;
		height: 500px;
		margin-bottom: 40px;
	}
	#news .snsArea > div{
		width: 100%;
	}
	#news .snsArea > div.right > div.x{
		margin-bottom: 40px;
	}
	#news .snsArea > div.right > div.sdgs{
		font-size: 1.4rem;
	}
	#news .snsArea > div.right > div.sdgs > .btnArrow{
		width: 100%; max-width: 255px;
	}
	#news .inner {
		padding-top: 70px;
		padding-bottom: 100px;
	}
	#news.baActive:after{
		display: block;
	}
	.bottomArea.baActive:before{
		display: none;
	}
	.footerArea .helmet,
	.footerArea2 .helmet {
		width: 140px;
		right: 0px;
		top: 0px;
		z-index: 1;
	}
	.footerArea .helmet > :nth-child(1),
	.footerArea2 .helmet > :nth-child(1){
		width: 30px;
	}
	.footerArea .helmet > :nth-child(2),
	.footerArea2 .helmet > :nth-child(2){
		width: 100%;
	}
	.copyright,
	footer > .inner > :nth-child(2){
		font-size: 1.6rem;
	}
	footer > .inner > :nth-child(3){
		font-size: 1.4rem;
	}
	footer{
		padding-bottom: 110px;
	}
	.sub_top {
		height: 190px;
		padding-top: 40px;
		padding-bottom: 50px;
	}
	#topImgSub > .effect-img{
		position: relative;
	}
	#topImgSub{
		display: flex;
		flex-direction: column;
	}
	#topImgSub > :nth-child(1){
		order: 2;
	}
	#topImgSub > :nth-child(2){
		order: 1;
	}
	#topImgSub .inner{
		height: auto;
		padding-top: 40px; padding-bottom: 40px;
	}
	#topImgSub .inner .textArea > p{
		font-size: 1.4rem;
		color: #373737;
	}
	#topImgSub .effect-img > div img{
		height: auto;
		width: 100%;
		left: 0;
		margin-left: 0;
	}
	#topImgSub.baActive:after{
		display: block;
		background: rgba(186,0,21,0.75);
	}
	#movie.baActive::before {
		display: none;
	}
	#strengthsList > .rel .nmb,
	#strengths ul li .nmb,
	.jobsArea ul li .nmb,
	.interviewArea ul li .nmb{
		width: 75px;
		transform: translate(-32%, -64%);
	}
	.interviewArea ul li > span .name{
		font-size: 2.4rem;
	}
	.interviewArea ul li > span .name small{
		font-size: 1.6rem;
	}
	#strengths .inner > ul{
		max-width: 300px;
	}
	#strengths .inner > ul > li .info .text{
		font-size: 1.4rem;
	}
	#movie .inner {
		padding-top: 40px;
		padding-bottom: 80px;
		flex-direction: column;
	}
	#movie .inner > div{
		width: 100%;
	}
	#movie .inner > div:nth-child(1){
		margin-bottom: 10px;
	}
	#movie .inner h3{
		font-size: 2.4rem;
	}
	#movie .inner p{
		font-size: 1.4rem;
	}
	.interview_top .text h3{
		margin-bottom: 70px;
	}
	.interview_top .text{
		font-size: 1.4rem;
		width: 100%;
	}
	.interviewArea ul{
		flex-direction: column;
		padding-left: 0;
		max-width: 320px;
		margin-left: auto; margin-right: auto;
	}
	.jobsArea ul{
		margin-left: -25px;
		margin-right: -25px;
		padding-left: 0;
		position: relative;
		padding-bottom: 30px;
	}
	.jobsArea ul li{
		width: 100%;
		margin-bottom: 50px;
		padding-left: 30px;
		padding-right: 20px;
	}
	.jobsArea ul li .btnArrow,
	.interviewArea ul li .btnArrow{
		width: 100%;
		max-width: 260px;
	}
	.interviewArea ul li{
		padding-left: 0; padding-right: 0;
		width: 100%;
		margin-bottom: 50px;
	}
	.jobsArea ul li > span,
	.interviewArea ul li > span {
		font-size: 1.6rem;
		color: #FFFFFF;
	}
	.jobsArea ul li > span{
		color: #373737;
	}
	#interview .inner {
		padding-top: 60px;
		padding-bottom: 20px;
	}
	.jobsArea ul li {
		width: 290px;
		min-width: 290px;
		margin-bottom: 10px;
	}
	.jobs .inner {
		padding-top: 60px;
		padding-bottom: 30px;
	}
	.faqList > div > .bellefair-regular{
		font-size: 2.4rem;
		width: 30px;
	}
	.faqList > div:nth-child(1){
		font-size: 1.6rem;
	}
	.faqList > div:nth-child(2){
		font-size: 1.4rem;
	}
	.faqList > div > :nth-child(2){
		width: calc(100% - 70px);
	}
	#faq .inner {
		padding-top: 50px;
		padding-bottom: 50px;
	}
	.sub_top h2 span:nth-child(1){
		font-size: 3.0rem;
	}
	.sub_top h2.notfound span:nth-child(1){
		white-space: nowrap;
	}
	#topImgSub .inner .textArea{
		max-width: 100%;
	}
	#topImgSub .in-page{
		margin: 40px auto 0;
	}
	#topImgSub .in-page > .buttonIcon{
		min-width: 135px;
	}
	#message h3.red,
	#philosophy h3.red{
		text-align: left;
		font-size: 1.6rem;
	}
	#message h4,
	#philosophy h4{
		font-size: 2.4rem;
		text-align: left;
		margin-bottom: 30px;
	}
	#philosophy .inner {
		padding-top: 80px;
		padding-bottom: 40px;
	}
	#message > div:nth-child(1){
		position: relative;
		width: 100%;
	}
	#message > div:nth-child(1):after{
		content: '';
		height: 30px;
		position: absolute; display: block;
		width: 100%;
		z-index: 1;
		bottom: 0; right: 0;
		clip-path: polygon(0 100%, 100% 0, 100% 100%);
		background: #FFFFFF;
	}
	#message > .effect-img > img{
		height: auto;
		width: 100%;
		left: auto;
		transform: translateX(0%);
		position: relative;
	}
	#message .inner {
		padding-top: 50px;
		padding-bottom: 50px;
	}
	#message > .inner > .textArea{
		padding-left: 0;
		padding-right: 0;
		width: 100%;
	}
	#message > .inner > .textArea p{
		font-size: 1.4rem;
	}
	#message > .inner > .textArea p strong{
		font-size: 1.8rem;
	}
	#overview .inner .table > div{
		flex-direction: column;
		font-size: 1.4rem;
		padding: 25px 0;
	}
	#overview .inner .table > div > :nth-child(1){
		margin-bottom: 10px;
	}
	#overview .inner .table > div > :nth-child(1),
	#overview .inner .table > div > :nth-child(2){
		width: 100% !important;
	}
	#overview .inner {
		padding-top: 70px;
		padding-bottom: 100px;
	}
	#history .inner {
		padding-top: 70px;
		padding-bottom: 70px;
	}
	#history .table {
		padding: 30px 0 0;
		font-size: 1.6rem;
		max-width: 420px;
	}
	#history .table > div{
		flex-direction: column;
		margin-bottom: 0;
	}
	#history .table > div > .red{
		width: 100%; max-width: 100%;
		margin-right: 0;
		justify-content: space-around;
	}
	#history .table > div > :nth-child(2){
		padding: 20px 15px 20px 45px;
		width: 100%;
	}
	#history .table > div:before{
		left: 20px;
		height: 100%;
		transform: translateY(0%);
	}
	#about-page #access .effect-img:after{
		background: #F5F3F0;
	}
	#about-page #access .effect-img > div img{
		height: auto;
		width: 100%;
		left: 0;
		bottom: 0;
		margin-left: 0;
	}
	#about-page #access .effect-img{
		height: auto;
		width: 100%;
		left: 0;
	}
	#about-page #access .inner {
		padding-top: 40px;
		padding-bottom: 90px;
	}
	#threeStrengths .inner ul{
		flex-direction: column;
	}
	#threeStrengths .inner ul li{
		margin-bottom: 40px;
		width: 100%;
		max-width: 260px;
	}
	#threeStrengths h4{
		text-align: center;
	}
	#threeStrengths .inner {
		padding-top: 40px;
		padding-bottom: 50px;
	}
	#strengthsList > .rel .effect-img{
		position: relative; width: 100%; height: auto;
		left: 0 !important;
	}
	#strengthsList > .rel .effect-img > div img {
		width: 100%;
		height: auto;
		left: 0%;
		margin-left: 0%;
	}
	#strengthsList > .rel:nth-child(1) .effect-img:after,
	#strengthsList > .rel:nth-child(3) .effect-img:after{
		background: #F5F3F0;
	}
	#strengthsList > .rel .textArea{
		width: 100%;
		left: 0;
		padding: 50px 0 80px 0 !important;
	}
	#strengthsList > .rel .textArea .in{
		margin-left: auto; margin-right: auto;
	}
	#strengthsList > .rel .textArea .in h3{
		font-size: 1.6rem;
	}
	#strengthsList > .rel .textArea .in h4{
		font-size: 2.4rem;
		margin-bottom: 40px;
	}
	#strengthsList > .rel .textArea .in p{
		font-size: 1.4rem;
		margin-bottom: 40px;
	}
	#strengthsList > .rel .textArea .in .btnArrow.gray{
		margin-left: auto; margin-right: auto;
	}
	#interview-page #topImgSub > .effect-img{
		position: absolute;
	}
	#interview-page #topImgSub .inner .textArea .img{
		width: 300px; margin-left: auto; margin-right: auto;
	}
	#interview-page #topImgSub{
		margin-top: 55px;
	}
	#interview-page #topImgSub .inner .textArea > p{
		color: #FFFFFF;
	}
	#interview-page #topImgSub .inner {
		padding-top: 40px;
		padding-bottom: 70px;
		min-height: 250px;
		display: flex;
		justify-content: center; align-items: center;
	}
	#case:before{
		display: none;
	}
	#case .inner{
		flex-direction: column;
		padding-top: 80px;
		padding-bottom: 40px;
	}
	#case .inner > div{
		width: 100%;
	}
	#case .inner > .textArea{
		font-size: 1.4rem;
		padding-left: 0;
	}
	#case .inner > .textArea h4{
		font-size: 4.0rem;
	}
	#case .inner > .textArea h5{
		font-size: 2.4rem;
	}
	#case .inner > .textArea h5 small{
		font-size: 1.6rem;
	}
	#inverviewArea {
		padding-top: 70px;
		padding-bottom: 110px;
	}
	#inverviewArea .inner{
		flex-direction: column;
		margin-bottom: 60px;
	}
	#inverviewArea .inner > div{
		width: 100%;
	}
	#inverviewArea .inner .textArea{
		padding-right: 0 !important;
		padding-left: 0 !important;
		order: 2;
	}
	#inverviewArea .textArea h4 {
		font-size: 1.6rem;
	}
	#inverviewArea .textArea h5 {
		font-size: 2.4rem;
		margin-bottom: 30px;
	}
	#inverviewArea .bottomText{
		width: calc(100% - 50px);
		padding: 40px 20px 60px;
	}
	#inverviewArea .bottomText .title {
		width: 100%;
		font-size: 2.4rem;
		justify-content: center;
		padding-bottom: 30px;
	}
	#inverviewArea .bottomText .title br{
		display: none;
	}
	#inverviewArea .bottomText .text {
		padding-top: 30px;
		width: 100%;
		font-size: 1.4rem;
		padding-left: 0px;
		border-left: none;
		border-top: 2px solid #FFFFFF;
	}
	#privacy-page .sub_top{
		height: auto;
	}
	#privacy .inner{
		padding-top: 40px;
		padding-bottom: 100px;
		font-size: 1.4rem;
	}
	#privacy .inner h3{
		font-size: 1.6rem;
	}
	#privacy .inner > div .info > :nth-child(1) {
		font-size: 1.5rem;
	}
	#privacy .inner > div {
		margin-top: 30px;
		padding-top: 25px;
	}
	.form-area .sub_top.baActive:after {
		display: none;
	}
	section#form .inner form > .flexBlock{
		flex-wrap: wrap; margin-bottom: 30px;
	}
	section#form .inner form > .flexBlock.hasChk > :nth-child(2),
	section#form .inner form > .flexBlock > :nth-child(1){
		display: none;
	}
	section#form .inner form > .flexBlock.hasRequired > :nth-child(1){
		display: flex; width: 50px; order: 3; 
	}
	section#form .inner form > .flexBlock > :nth-child(2){
		width: 100%; order: 1; padding-left: 0; font-size: 1.4rem;
		height: 40px;
	}
	section#form .inner form > .flexBlock > :nth-child(3){
		width: 100%; order: 2; font-size: 1.6rem;
	}
	section#form .inner form > .flexBlock > :nth-child(3) > input{
		font-size: 1.6rem; height: 50px; min-height: 50px;
	}
	section#form .inner form > .flexBlock.hasRequired > :nth-child(3){
		width: calc(100% - 60px); margin-right: 10px;
	}
	section#form .inner form > .flexBlock.hasRequired.hasTextArea > :nth-child(1){
		order: 2; margin-bottom: 10px;
	}
	section#form .inner form > .flexBlock.hasRequired.hasTextArea > :nth-child(2){
		order: 1; width: calc(100% - 60px); margin-right: 10px; margin-bottom: 10px;
	}
	section#form .inner form > .flexBlock.hasRequired.hasTextArea > :nth-child(3){
		order: 3; width: 100%; margin-right: 0;
	}
	section#form .inner form .required{
		width: 50px; height: 50px;
	}
	section#form .inner form > .flexBlock.hasChk > :nth-child(3){
		font-size: 1.4rem;
	}
	section#form .inner {
		padding-top: 70px;
		padding-bottom: 100px;
	}
	contact-success h3 {
		font-size: 2.2rem;
		margin-bottom: 30px;
	}
	.contact-success p{
		margin-bottom: 40px; font-size: 1.4rem;
		text-align: left;
	}
	section#form .inner .subText > br{
		display: none;
	}
	.modal .modalArea .title{
		font-size: 2.4rem;
	}
	.modalArea .in ul li:nth-child(2n-1){
		margin-right: 0;
	}
	.modalArea .in ul li{
		width: 100%;
	}
	#inverviewArea .inner h4{
		font-size: 1.6rem;
		order: 2;
	}
	#inverviewArea .inner h5 {
		font-size: 2.4rem;
		margin-bottom: 30px;
		order: 3;
	}
	#inverviewArea .inner p{
		font-size: 1.4rem; width: 100%;
		order: 4;
	}
	#inverviewArea .inner p strong {
		font-size: 1.6rem;
	}
	#inverviewArea .inner .img{
		width: 100% !important; padding-left: 0 !important; padding-right: 0 !important;
		max-width: 300px; margin: 40px auto;
		order: 1;
	}
	.modal .modalArea .in.scroll__inner{
		padding-right: 15px;
		padding-left: 15px;
	}
}
@media screen and (max-width:374px) {
	.sub_top h2 span:nth-child(1){
		font-size: 2.6rem;
	}
}
.mb20{
	margin-bottom: 20px;
}
.flexBlock.sp-only,
.sp-only{
	display: none;
}
.pc-only{
	display: block;
}
span.pc-only{
	display: inline-block;
}
.flexBlock.pc-only{
	display: flex;
}
@media screen and (max-width:768px) {
	span.pc-only,
	.flexBlock.pc-only,
	.pc-only{
		display: none;
	}
	.sp-only{
		display: block;
	}
	.flexBlock.sp-only{
		display: flex;
	}
}