/*
Theme Name: MC不動産採用サイト
Text Domain: mcfudousan-recruit.com
Author: R-design
*/



.sp {
  display: none;
}

:root {	
--main-color: #de0011;/*少し濃い赤色*/
--main-color2: #ff5144;/*薄い赤*/
--main-color3: #ff0000;/*赤*/
--sub-color: #9fa0a0;/*ロゴ薄いグレー*/
 }

.en{
	font-family: "Barlow", sans-serif;
	font-weight: 800;
	font-style: italic;
}
.no-no{font-size:20px;text-align:center;padding-top:20px;}

#head{
	padding:5px;
	display:flex;
	flex-wrap:wrap;
	justify-content: space-between;
}
#head h1{
	width:30%;
	height:80px;
}
#head h1 img{
	max-height:80px;
	width:auto;
}
.navi{
	width:70%;
	max-width:1000px;
	display:flex;
	flex-wrap:wrap;
	justify-content: flex-end;
	font-weight:600;
}
.navi ul{
	width:70%;
	display:flex;
	flex-wrap:wrap;
	justify-content: space-around;
	line-height:80px;
	position:relative;
}
.navi ul a{
	position: relative;
	transition:0.5s;
	display:block;
}
.navi ul a:hover{
	color:(--main-color);
}
/*.navi ul a::after{
	content: '';
    position: absolute;
    bottom: -10px;
    left: 10%;
    width: 80%;
    height: 2px;
    background:var(--main-color);
    transition: all .3s;
    transform: scale(0, 1);
    transform-origin: center top;
}
.navi ul a:hover::after{
	transform: scale(1, 1);
}*/
/*下の階層を持っているulの指定*/
.navi li.has-child ul{
    /*絶対配置で位置を指定*/
	position: absolute;

	top:70px;
	z-index: 4;
    /*形状を指定*/
	background:#f2f2f2;
	width:250px;
    /*はじめは非表示*/
	visibility: hidden;
	opacity: 0;
    /*アニメーション設定*/
	transition: all .3s;
	flex-wrap:wrap;
}

/*hoverしたら表示*/
.navi li.has-child:hover > ul,
.navi li.has-child ul li:hover > ul,
.navi li.has-child:active > ul,
.navi li.has-child ul li:active > ul{
  visibility: visible;
  opacity: 1;
}

/*ナビゲーションaタグの形状*/
.navi li.has-child ul li{
	/*border-bottom:solid 1px rgba(255,255,255,0.6);*/
	border-bottom:solid 1px var(--main-color);
	width:250px;
	padding:0 20px;
	text-align:left;
	transition:0.5s;
}

.navi li.has-child ul li:last-child > a{
 border-bottom:none;
 }

.navi li.has-child ul li:hover,
.navi li.has-child ul li:active,
.navi li.has-child ul li:visited{
	background:var(--main-color);
	color:#fff;
}

.navi li.has-child ul li:hover a{
	color:#fff;
}
.navi .entry-bt{
	width:25%;
	display:flex;
	flex-wrap:wrap;
	padding:10px;
}
.navi .entry-bt a{
	width:50%;
	display:block;
	color:#fff;
	text-align: center;
	line-height:60px;
}

.new{
	background-color: var(--main-color2);
	border-radius: 10px 0 0 10px;
	transition: 0.5s;
}
.car{
	background-color: var(--main-color);
	border-radius: 0 10px 10px 0;
	transition: 0.5s;
}
.new:hover, .car:hover{
	background-color: var(--main-color3);
}


main{
	position:relative;
}

.topslider li img{
	width:100%;
	height:auto;
	border-radius: 20px;
	padding:7px;
}
main p{
	position:absolute;
	top:50%;
	left:50%;
	transform: translate(-50%,-50%);
}
main p img{
	max-width:1200px;
}
section{
	padding:30px 0;
}
/***********私たちの夢**************************/

#future{
	background: url("image/top/future_bg.png") no-repeat center;
}

.midashi h2{
	font-size:clamp(1.875rem, 1.671rem + 1.02vw, 2.5rem);
	color:var(--main-color);
	padding:50px 0;
	font-style: italic;
}
.midashi span{
	display:block;
	font-size:clamp(1rem, 0.455rem + 2.73vw, 2.5rem);
	color:#2A2A2A;
	font-family: "Noto Sans JP", sans-serif;
}
.future-inner {
	position:relative;
	max-width:800px;
	font-size:clamp(0.938rem, 0.876rem + 0.31vw, 1.125rem);
	text-align: center;
	margin: 50px auto;
	padding:0 10px;
}

.future-inner h3{
	text-align: center;
	font-size:clamp(1.5rem, 0.682rem + 4.09vw, 3.75rem);
	font-weight:800;
	margin-bottom:50px;
	color:var(--main-color);
}
.future-inner .future-text{
	line-height:180%;
	padding-bottom:20px;
}

.common-flex{
	display:flex;
	flex-wrap:wrap;
	margin:auto;
	justify-content: center;
	
}
.top-bt{
	display:block;
	width:250px;
	height:70px;
	display:flex;
	flex-wrap:wrap;
	justify-content: space-between;
	align-items: center;
	background-color: #e7e7e7;
	font-size:18px;
	font-weight:600;
	padding:10px;
	margin:50px 10px;
	border-radius: 10px;
	transition: 0.5s;
}
.top-bt img{
	width:30px;
	height:30px;
}
.top-bt:hover{
	background-color: var(--main-color);
	color:#fff;
}

/***********事業紹介**************************/

#business-top{background-color:var(--main-color);}
#business-top .midashi h2{
	color:#fff;
	max-width:1280px;
	text-align:left;
	margin-inline:auto;
	padding-left:80px;
}
#business-top .midashi h2 span{
	color:#fff;
}

.business-flex{
	max-width:1300px;
	display:flex;
	flex-wrap:wrap;
	gap:20px 0;
	margin:0 auto 80px;
}

.business-flex a{
	width:25%;
	text-align: center;
	clip-path: polygon(18% 0, 100% 0%, 82% 100%, 0% 100%);

}
.business-flex a.b01{background:url(image/top/b01.webp) no-repeat center / cover;}
.business-flex a.b02{background:url(image/top/b02.webp) no-repeat center / cover;}
.business-flex a.b03{background:url(image/top/b03.webp) no-repeat center / cover;}
.business-flex a.b04{background:url(image/top/b04.webp) no-repeat center / cover;}

.business-flex li img{
	width:70%;
	max-width:200px;
	height:auto;
	padding:10px 0;
}
.business-flex a p{
	position:relative;
	font-size:clamp(0.938rem, 0.869rem + 0.34vw, 1.125rem);
	font-weight:800;
	padding:10px;
	background-color:#fff;
	border-bottom:6px solid var(--main-color);
	display:inline-block;
	min-width:73%;
	margin-right: 10%;
	margin-bottom: 30px;
	font-style: italic;
	text-align:left;
	height:78px;
	transition:0.5s
}
.business-flex a:hover p{
	background-color:var(--main-color);
	color:#fff;
}
.business-flex p::after{
	position:absolute;
	content:'';
	width:30px;
	height:30px;
	background:url(image/top/circle-ya.png) no-repeat center / cover;
	right:6px;
	bottom:6px;
}
.zoomIn img{
	transform: scale(1);
	transition: .5s ease-in-out;
}

.zoomIn:hover img{
	transform: scale(1.1);
}

.mask{
    display: block;
    line-height: 0;
}

/***********クロストーク**************************/
#cross{
	background-color: #e7e7e7;
	padding:20px 0;
}
#cross .midashi h2{text-align:left;}
.cross-flex{
	max-width:1300px;
	display:flex;
	flex-wrap:wrap;
	margin:50px auto;
}
.cross-flex .img{
	width:60%;
}
.cross-flex .img img{
	width:100%;
	height:auto;
}
.cross-flex .text{
	width:36%;
	margin:2%;
	align-self: center;
}
.white{
	background-color: #fff;
	margin:50px auto;
}

/***********スタッフ**************************/

#staff{
	background-color: #e7e7e7;
}
#staff .midashi h2{
	max-width:1280px;
	text-align:left;
	margin-inline:auto;
	padding-left:80px;
}
.staff-flex{
    max-width:1300px;
	display:flex;
	flex-wrap:wrap;
	gap:0 3%;
	margin:0 auto;
}
.staff-flex li{
	width:31%;
	margin-bottom:30px;
}
.staff-flex img{
	width:100%;
	height:auto;
	background:#111;
	border-radius: 10px;
}
.staff-flex img:hover{
	opacity:0.5;
	transition:0.3s;
}
.staff-flex .staff-img{
	position: relative;
}
.staff-flex .staff-img p{
	position: absolute;
	font-size:clamp(1rem, 0.918rem + 0.41vw, 1.25rem);
	font-weight:700;
	color:#fff;
	padding:15px;
	bottom:0;
	left:0;
	text-shadow: 0px 0px 10px rgba(0, 0, 0, 0.9);
}
.staff-flex h3{
	font-size:clamp(0.875rem, 0.834rem + 0.2vw, 1rem);
	padding:15px
}

#staff-s .staff-flex h3{
	font-size:clamp(0.875rem, 0.834rem + 0.2vw, 1rem);
	color:#000;
	padding:15px
}

/***********仕事を知る**************************/

#contents .midashi h2{
	max-width:1280px;
	text-align:left;
	margin-inline:auto;
	padding-left:80px;
}
.contents-flex{
	max-width:1300px;
	margin: 0 auto 80px;
	display:flex;
	flex-wrap:wrap;
	gap:20px 1%;
}
.contents-flex a{
	width:24%;
	display:block;
	height:450px;
	position:relative;
}
.contents-flex a.c01{background:url(image/top/c01.webp) no-repeat center / cover;}
.contents-flex a.c02{background:url(image/top/c02.webp) no-repeat center / cover;}
.contents-flex a.c03{background:url(image/top/c03.webp) no-repeat center / cover;}
.contents-flex a.c04{background:url(image/top/c04.webp) no-repeat center / cover;}

.contents-flex p{
	position:absolute;
	bottom:0;
	
}

.contents-flex a .contents-link{
	width:90%;
	margin:10px 5% 30px;
	font-size:clamp(1rem, 0.955rem + 0.23vw, 1.125rem);
	font-weight:800;
	padding:10px;
	background-color:#fff;
	font-style: italic;
	text-align:left;
	height:100px;
	transition:0.5s;
	align-items: flex-end;
}
.contents-flex a .contents-link span{
	display:block;
	color:var(--main-color);
	transition:0.5s;
}
.contents-flex a:hover .contents-link{
	background-color:var(--main-color);
	color:#fff;
}
.contents-flex a:hover .contents-link span{
	color:#fff;
}
.contents-flex .contents-link::after{
	position:absolute;
	content:'';
	width:30px;
	height:30px;
	background:url(image/top/circle-ya.png) no-repeat center / cover;
	right:6px;
	bottom:6px;
}


/***********TOP ENTRY**************************/

#entry-top{background:url(image/base/entry_bg.webp) no-repeat center / cover;}

.entrywaku{
	max-width:750px;
	margin:0  auto;
}
#entry-top .midashi h2{text-align:left;}

.entrywaku-flex{
	display:flex;
	flex-wrap:wrap;
	gap:10px 10%;
	margin:0 10px;
}
#entry-top .top-bt{
	display:block;
	width:45%;
	height:100px;
	display:flex;
	flex-wrap:wrap;
	justify-content: space-between;
	align-items: center;
	background-color: var(--main-color);
	color:#fff;
	font-size:24px;
	font-weight:600;
	padding:10px;
	margin:20px 0;
	border-radius: 10px;
	transition: 0.5s;
}
#entry-top .top-bt img{
	width:30px;
	height:30px;
}
#entry-top .top-bt:hover{
	background-color: var(--main-color3);
	color:#fff;
}
#entry-top .new{
	background-color: var(--main-color2);
	transition: 0.5s;
}
#entry-top .car{
	background-color: var(--main-color);
}
/***********募集要項**************************/

.recruit-flex{
	display:flex;
	flex-wrap:wrap;
}
.recruit-flex .left{
	width:25%;

}
.recruit-flex .right{
	width:75%;
	padding-top:30px;
}
#recruit{
	max-width: 1300px;
	margin:50px auto;
}
#recruit .top-bt{
	margin:10px auto;
	background-color: #ff5144;
}
#recruit .bgchuto{
	background-color: #e52e50;
}
#recruit .top-bt:hover, #recruit .bgchuto:hover{
	background-color: #f2f2f2;
}
#recruit .recruit-flex .sp{
	display:none;
}
.recruit-box{
	width:90%;
	margin:20px auto;
	background-color: #f2f2f2;
	padding:30px;
	border-radius: 10px;
}
.recruit-box span{
	padding:5px 20px;
	border-radius: 10px;
	color:#fff;
	text-align: center;
	margin-right:5px;
	font-size:16px;
}
.recruit-box .new{
	background-color: var(--main-color2)
}
.recruit-box .old{
	background-color: var(--main-color);
}

.recruit-box h3{
	font-size:clamp(1.25rem, 1.168rem + 0.41vw, 1.5rem);
	font-weight:600;
	border-bottom:2px solid #555;
	padding:10px;
	margin:20px 0 ;
}
.recruit-box .text{
	padding:0 10px;
}

.entry-flex{
	display:flex;
	flex-wrap:wrap;
	margin-top:20px;
	justify-content: flex-end;
	gap:10px;
}
.entry-flex .entry{
	width:180px;
	background-color: #fff;
	border-radius: 10px;
	font-weight:700;
	display:flex;
	flex-wrap:wrap;
	justify-content: space-between;
	padding:7px 10px;
	align-content: center;
	transition: 0.5s;
}
.entry-flex .entry:hover{
	background-color: #3f3a39;
	color:#fff;
}
/***********footer**************************/

footer{
	background-color: #3f3a39;
	color:#fff;
	border-top: 1px solid #fff;
}

.footer-waku{
	max-width:1300px;
	margin:0 auto;
	padding:30px 80px;
	display:flex;
	flex-wrap:wrap;
	gap:4%;
}
.footer-waku .logo{
	width:28%;
	max-width:278px;
	height:auto;
	padding-top:30px;
}
.footer-waku .logo img{
	width:100%;
	height:auto;
}
.footer-waku .list{
	width:21%;
	padding-top:30px;
	text-align: left;
	list-style:none;
}
.footer-waku .list a{
	color:#fff;
	line-height: 200%;
}
.footer-waku .list a:hover{
	color:var(--main-color);
}

.copy{
	font-size:14px;
	color:#fff;
	text-align: center;
	padding:10px;
}

/*********************
下層ページ
*********************/
#subtitle{
	width:100%;
	height:300px;
	position:relative;
	background:url(image/base/bg_subtitle.png) no-repeat right bottom;
}

#subtitle-box{
	padding:4vw 10vw 1vw ;
	z-index:2;
}
#subtitle-box h2{
	font-size:clamp(2.25rem, 1.432rem + 4.09vw, 4.5rem);
	font-weight:900;
	color:var(--main-color);
	text-align: left;
	padding-bottom:30px;
}
#subtitle-box h2 span{
	display:block;
	font-size:clamp(1.25rem, 0.886rem + 1.82vw, 2.25rem);
	font-weight:900;
}
#sublink{
	padding:7px 0;
	text-align: left;
	font-size:clamp(0.75rem, 0.705rem + 0.23vw, 0.875rem);
}

#sub-img{
	max-width:1300px;
	height:auto;
	margin:0 auto;
}
#sub-img img{
	width:100%;
	height:auto;
	border-radius:20px;
}
/*****company*****************/
#company{
	background: url("image/company/bg_company.webp") no-repeat center top;
}
.bg-grey{background-color:#f2f2f2;}
.company-cara{
	width:25%;
}
.company-cara img{
	width:100%;
	height:auto;
}
.company-midashi{
	width:75%;
	padding:50px 0;
	font-size:clamp(1.063rem, 0.903rem + 0.8vw, 1.5rem);
	font-weight:800;
	line-height:180%;
}
.company-flex{
	display:flex;
	flex-wrap:wrap;
	max-width:1200px;
	margin:0 auto;
}
.company-flex .img{
	width:50%;
	padding:50px;
}
.company-flex .img img{
	width:100%;
}
.company-flex .text{
	width:50%;
	padding:50px 0;
	line-height:180%;
	font-size:18px;
}
.company-flex .text .name{
	display:block;
	text-align: right;
	padding:50px 0 30px;
}
.company-flex .text .name span{
	font-size:22px;
	padding-left:10px;
}


.company-flex dt{
	width:30%;
	padding:20px 10px 20px;
	border-bottom:solid 1px var(--main-color);
	font-weight:700;
}
.company-flex dd{
	width:70%;
	padding:20px 10px 20px;
	border-bottom:solid 1px #999;
}
.map{
    margin:30px auto 80px;
}
.midashi2{
	max-width:1200px;
	margin:0 auto;
	padding:50px 10px;
}
.midashi2 h3{
	font-size:clamp(1.75rem, 1.523rem + 1.14vw, 2.375rem);
	font-weight:900;
	padding-left:20px;
	position: relative;
}

.midashi2 h3:before {
    background-color: var(--main-color);
    border-radius: 5px;
    content: "";
    display: inline-block;
	width:10px;
    height: 44px;
	position: absolute;
	left:0;
	top:10px;
}

/*******求める人物像*************************/



#personality .p-title{
	font-size:clamp(1.25rem, 0.795rem + 2.27vw, 2.5rem);
	font-weight:800;
	text-align:center;
	padding:50px 0;
	background-color:#f2f2f2;
}


.personality-flex{
	max-width:1400px;
	margin:120px auto;
	padding:0 50px;
	background-color:#fff;
	display:flex;
	flex-wrap:wrap;
	gap: 0 5%;
}
.re{flex-direction:row-reverse;gap:0;}
.personality-flex .text{
	width:55%;
	align-self:center;
	font-size:clamp(1rem, 0.909rem + 0.45vw, 1.25rem);
	position:relative;
	z-index:2;
}
.personality-flex .text2{
	width:60%;
	align-self:center;
	font-size:clamp(1rem, 0.909rem + 0.45vw, 1.25rem);
	position:relative;
	z-index:2;
}
.personality-flex .text::after, .personality-flex .text2::after{
	content:'Check';
	color:#f2f2f2;
	font-size:clamp(4.188rem, 2.074rem + 10.57vw, 10rem);
	font-weight:900;
	z-index:-2;
	position:absolute;
	top: -136px;
    left: 0;
	font-style: italic;
}
.personality-flex h3{
	font-size:clamp(1.5rem, 1.227rem + 1.36vw, 2.25rem);
	padding-bottom:50px;
}
.personality-flex .img{
	width:40%;
}
.personality-flex .img img{
	width:100%;
	height:auto;
}
.bg01{background-color:var(--main-color);}
.bg02{background-color:var(--sub-color);}

.p-midashi-waku{
	padding:100px 0;
	background:url(image/personality/p-bg02.png) no-repeat center / cover;
}
.p-midashi {
	width:100%;
	font-size:clamp(1.125rem, 0.989rem + 0.68vw, 1.5rem);
	padding:10px 0;
	margin:20px 0;
	text-align: center;
	font-weight:400;
}
.p-midashi span{
		position:relative;
		color: var(--main-color);
	font-size:clamp(1.625rem, 1.17rem + 2.27vw, 2.875rem);
}
.p-midashi span::before{
    content: '';
	display:inline-block;
    position: absolute;
    left: -30px;
    top: -10px;
    width: 3px;
    height: 70px;
    background-color: var(--main-color);
    transform: rotate(-35deg);
}
.p-midashi span::after{
    content: '';
	display:inline-block;
    position: absolute;
    right: -30px;
    top: -10px;
    width: 3px;
    height: 70px;
    background-color: var(--main-color);
    transform: rotate(35deg);
}
/*******データで見る*************************/

#data{
	background-color:#f2f2f2;
	padding:80px 0 ;
}
.data-box-flex{
	max-width:1200px;
	margin-inline:auto;
	display:flex;
	flex-wrap:wrap;
	gap: 20px 3%;
}
.data-box-flex li{
	width:31%;
	background-color: #fff;
	padding:10px;
	text-align: center;
	color: #1a2f5d;
}
.data-box-flex li h3{
	font-size:clamp(1.125rem, 0.852rem + 1.36vw, 1.875rem);
	font-weight:900;
}
.data-box-flex li h3 span{
	font-size:clamp(2.625rem, 2.013rem + 3.06vw, 4.5rem);
}
.data-box-flex li figure{
	margin:0;
	padding:0;
}
.data-box-flex li img{
	width:80%;
	height:auto;
}

#data .more .top-bt{
	margin-right:auto;
	margin-left:0;
	margin-top:20px;
}

.uriage{
	max-width:1200px;
	margin:50px auto;
	background-color:#fff;
	padding:20px;
	font-size:clamp(1.25rem, 1.046rem + 1.02vw, 1.875rem);
	font-weight:900;
	color: #1a2f5d;
	text-align:center;
}
.uriage span{
	font-size:clamp(2.625rem, 2.013rem + 3.06vw, 4.5rem);
}

.uriage img{
	width:100%;
	max-width:800px;
	height:auto;
}

/*******スタッフ*************************/

#staff-s{
	padding-bottom:180px;
}

.staffbox-flex{
	max-width:1300px;
	display:flex;
	flex-wrap:wrap;
	margin:50px auto;
}
.staffbox-flex .box{
	width:40%;
}
.staffbox-flex .box img{
	width:100%;
	height:auto;
}
.staffbox-flex .text{
	width:54%;
	padding:10px 3%;
}
.staffbox-flex .text h3{
	font-size:clamp(1.375rem, 0.784rem + 2.95vw, 3rem);
	font-weight:900;
}
.staffbox-flex .text p{
	font-size:clamp(1rem, 0.909rem + 0.45vw, 1.25rem);
	padding:20px 0;
}
.staffbox-flex .text h4{
	font-size:clamp(1.25rem, 1.023rem + 1.14vw, 1.875rem);
	color:var(--main-color);
	font-weight:700;
}

.ffbox-text-left{
	width:70%;
	background: url("image/staff/ff_bg.webp") repeat  center / cover;
	padding:50px 20px 80px 15%;
	position: relative;
	margin:50px 30% 150px 0;
}

.ffbox-title{
	font-size:clamp(1.25rem, 0.977rem + 1.36vw, 2rem);
	padding-bottom:80px;
	display: flex;
    align-items: center;
	line-height:120%;
	font-weight:900;
}
.ffbox-title span{
	font-size:clamp(3.75rem, 2.386rem + 6.82vw, 7.5rem);
	color:var(--main-color);
	padding-right:20px;
}
.ffbox-text-left p{
	margin-right:30%;
	line-height:220%;
	max-width:650px;
	min-height:300px;
}

.ffbox-text-left .img-right{
	position: absolute;
	left:80%;
	top:200px;
	max-height:450px;
	width:auto;
}

.ffbox-text-right{
	width:70%;
	background: url("image/staff/ff_bg.webp") repeat  center / cover;
	padding:50px 10% 80px 30px;
	position: relative;
	margin:50px 0 150px 30%;
}
.ffbox-text-right p{
	margin-left:30%;
	line-height:220%;
	max-width:650px;
	min-height:300px;
}

.ffbox-text-right .img-left{
	position: absolute;
	right:80%;
	top:200px;
	max-height:450px;
	width:auto;
}

/*******ReCRUIT*************************/

section#recruit-s{
	margin-bottom:80px;
	max-width:1100px;
	margin-inline:auto;
}
section#recruit-s .recruit-box{
	width:100%;
}
.recruit-s-flex{
	display:flex;
	flex-wrap:wrap;
	max-width:1100px;
	margin:0 auto;
	border-top:solid 1px #999;
}
.recruit-s-flex dt{
	width:20%;
	padding:20px 10px 20px;
	border-bottom:solid 1px var(--main-color);
	font-weight:600;
	background-color: #f2f2f2;
}
.recruit-s-flex dd{
	width:80%;
	padding:20px 10px 20px;
	border-bottom:solid 1px #999;
}
/*********************************
 お問い合わせ
*********************************/

#apply{
	padding:30px 0 80px;
    
}
  
#apply-box{
    max-width:1200px;
    margin-inline:auto;
	padding:50px;
    display:flex;
    flex-wrap:wrap;
	font-size:18px;
	background-color:  #FFFACD;
	border-radius: 20px;
	margin-bottom:20px;
}   
#apply-box .apply-box-l{
    width:35%;
    border-bottom:1px solid var(--main-color);
    padding:20px 10px;
}
#apply-box .apply-box-l span{
    background-color:var(--main-color);
    color:#fff;
    padding:5px 10px;
    margin-right:10px;
    border-radius: 5px;
    font-size:14px;
}
#apply-box .apply-box-l .nini{
	background-color:#999;
}
#apply-box .apply-box-r{
    width:65%;
    border-bottom:1px solid #ccc;
	padding:20px 10px;
	font-family:  'Noto Sans JP',
	"Helvetica Neue",
    Arial,
    "Hiragino Kaku Gothic ProN",
    "Hiragino Sans",
    "BIZ UDPGothic",
    Meiryo,
    sans-serif;
}
 /* テキストフォームの設定 */
.wpcf7-datetime{
  padding: 7px;
  width: 260px;
  color: #636063;
  font-size: 13px;
  background-color:#F9F9F9;
  border:solid 1px #CCCCCC;
  }

 /* テキストフォームの設定 */
.wpcf7-text{
  padding: 7px;
  width: 100%;
  color: #636063;
  background-color:#F9F9F9;
  border:solid 1px #CCCCCC;
  }

.kazukazu input{width:30px!important;
margin-left:3px;
margin-right:3px;}
 
  /* テキストフォームのフォーカス時の設定 */
.wpcf7-text:focus{
  background-color:#FFFFCC;
  }
 
  /* テキストエリアの設定 */
.wpcf7-textarea{
  padding: 7px;
  width: 100%;
  height: 100px;
  color: #636063;
  background-color:#F9F9F9;
  border:solid 1px #CCCCCC;
  }
 
 /* テキストエリアのフォーカス時の設定 */
.wpcf7-textarea:focus{
background-color:#FFFFCC;
}
 
  /* 送信ボタンの設定 */
.wpcf7-form-control.wpcf7-submit{
display: block;
width: 260px;
border: none;
padding:20px;
background-color:#DD1F30;
color:#fff;
	border-radius:5px;
	font-size:24px;
  }
 
/* 送信ボタンのフォーカス時の設定 */
.wpcf7-form-control.wpcf7-submit:hover{
filter: alpha(opacity=80);
 opacity: .6;
 -moz-transition: all 0.7s ease;
 -webkit-transition: all 0.7s ease;
 }
 
/* リストの縦並び（チェックボックス・ラジオ） */
span.wpcf7-list-item {
display: block!important;
	margin-bottom:10px!important;
}
 
/* セレクト */
select{
padding: 5px;
width:420px;
color: #636063;
font-size: 13px;
background-color:#F9F9F9;
border:solid 1px #CCCCCC;
}
input[type=checkbox] {
	transform: scale(2);
	margin: 0 6px 0 0;
}
.apply-check{
	text-align:center;
	display:block;
	width:100%;
	margin-top:20px;
}
.wpcf7-form-control-wrap .waku {
    border: 2px solid #777;
    border-radius: 5px;
}
.center{
	text-align:center;
	display:block;
	margin:10px auto;
}
.form-small {
    width: 100px;
}

#thx{
	max-width:800px;
	margin:10px auto 80px;
	padding:10px;
	color:#000;
	font-size:20px;
	line-height:180%;
	text-align:center;
}


/**************************************************************
ページネーション
**************************************************************/
.wp-navi{
	margin:30px auto ;
	height:50px;
	text-align:center;
}

.wp-pagenavi a, .wp-pagenavi span {
    text-decoration: none;
    border: 1px solid #BFBFBF;
	padding: 10px!important;
	margin: 2px;
}
wp-pagenavi a:hover, .wp-pagenavi span.current {
    border-color: #bd0026!important;
	background-color:#bd0026!important;
	color:#fff!important;
}
.wp-pagenavi a, .wp-pagenavi span {
    text-decoration: none;
    border: 1px solid #afafaf!important;
	background-color:#afafaf!important;
	color:#fff!important;
}

/**************************************************************
ビジネスモデルと業界の未来
**************************************************************/
.bg-grey{background-color:#f2f2f2;}
.future-cara{
	width:15%;align-self:center;text-align:center;
}
.future-cara img{
	width:100%;
max-width:100px;
	height:auto;
}
.future-midashi{
	width:85%;
	padding:50px 0;
	font-size:clamp(1.125rem, 0.67rem + 2.27vw, 2.375rem);
	font-weight:800;
	line-height:180%;
align-self:center;
text-align:center;
}
.future-midashi span{
background:linear-gradient(transparent 70%,#faff6b 70%);
}
.future-flex{
	display:flex;
	flex-wrap:wrap;
	max-width:1000px;
	margin:0 auto;
}
.future-flex .img{
	width:50%;
	padding:50px;
}
.future-flex .img img{
	width:100%;
}
.future-text{
max-width:980px;
margin:50px 10px;
margin-inline:auto;
font-size:clamp(1rem, 0.955rem + 0.23vw, 1.125rem);
line-height:200%;
}
.future-img{max-width:900px;margin-inline:auto;}
.future-img img{width:100%;height:auto;}

.model{padding:20px;max-width:1000px;margin-inline:auto;background-color:#F3EED5;margin-bottom:50px;}
.model img{width:100%;height:auto;}
.model-flex{display:flex;flex-wrap:wrap;gap:10px 2%;}
.model-flex li{width:31%;background-color:#fff;border-radius:10px;}
.model-flex li.box{width:23%;}
.model-flex h4{background-color:#333;font-size:20px;font-weight:700;color:#fff;padding:10px;text-align:center;border-radius:10px 10px 0 0;}
.model-flex p{padding:10px;}

.tsuyomi{max-width:1000px;margin: 50px auto;border:15px solid #f2f2f2;padding:50px;font-size:clamp(1rem, 0.955rem + 0.23vw, 1.125rem);}
.tsuyomi h3{color:var(--main-color);border-bottom:3px solid var(--main-color);margin-bottom:20px;text-align:center;font-size:22px;font-weight:700;padding-bottom:7px;}
.tsuyomi ul{max-width:800px;margin-inline:auto;line-height:220%;}
.tsuyomi li{position:relative;padding-left:50px;padding-bottom:20px;}
.tsuyomi li::before{position:absolute;content:'';width:30px;height:30px;background:url(image/future/check.png) no-repeat center / cover;top:5px;left:0;}


/**************************************************************
一日の仕事の流れ
**************************************************************/
.bg01{background-color: #f2f2f2;}
#flow h3 {
    font-size: clamp(1.25rem, 0.795rem + 2.27vw, 2.5rem);
    font-weight: 800;
    text-align: center;
    padding: 50px 0;
}

#flow h3 span {background: linear-gradient(transparent 70%, #faff6b 70%);}
.flow-flex{max-width:1100px;margin:0 auto 50px;background-color:#F3EED5;padding:20px;display:flex;flex-wrap:wrap;gap:10px 5%;}
.flow-flex .img{width:27%;}
.flow-flex .img img{width:100%;height:auto;}
.flow-flex .text{width:68%;align-self:center;}
.flow-flex .text h4{font-size:26px;font-weight:600;padding-bottom:20px;}
.flow-flex .text h4 span{font-size:16px;font-weight:500;}
.flow-flex .time{width:68%;padding-left:50px;}
.flow-flex .time h4{font-size:26px;font-weight:600;padding-bottom:10px;margin-bottom:10px;border-bottom:1px solid #333;}
.flow-flex .time h4 span{font-size:20px;font-weight:500;padding-right:20px;}
.w1100{max-width:1100px;margin:0 auto;}
.time-sen{position:relative;background-color:#F3EED5;}
.time-sen::before{content:' ';width:1px;top:0;left:-30px;background-color:#aaa;position:absolute;z-index:100;}


/**************************************************************
キャリア
**************************************************************/

#career h3 {
    font-size: clamp(1.25rem, 0.795rem + 2.27vw, 2.5rem);
    font-weight: 800;
    text-align: center;
    padding: 50px 0;
}
#career h3 span{font-size:clamp(1.125rem, 0.898rem + 1.14vw, 1.75rem);color:var(--main-color);}
#career h3.no1, #career h3.no2, #career h3.no3{position:relative;}
#career h3.no1::before{position:absolute;content:'1';font-size:clamp(1.5rem, 0.909rem + 2.95vw, 3.125rem);font-weight:800;background-color:var(--main-color);border-radius:50%;color:#fff;top:-20px;left:calc(50% - 35px);padding:0 20px;}
#career h3.no2::before{position:absolute;content:'2';font-size:clamp(1.5rem, 0.909rem + 2.95vw, 3.125rem);font-weight:800;background-color:var(--main-color);border-radius:50%;color:#fff;top:-20px;left:calc(50% - 35px);padding:0 20px;}
#career h3.no3::before{position:absolute;content:'3';font-size:clamp(1.5rem, 0.909rem + 2.95vw, 3.125rem);font-weight:800;background-color:var(--main-color);border-radius:50%;color:#fff;top:-20px;left:calc(50% - 35px);padding:0 20px;}

.career-waku{border:15px solid #f2f2f2;margin-bottom:80px;}
.career-flex{display:flex;flex-direction:column;text-align:center;}
.career-flex p img{width:80%;max-width:500px;height:auto;}
.career-flex h4{font-size:clamp(1.5rem, 1.136rem + 1.82vw, 2.5rem);font-weight:800;padding:10px;color:var(--main-color);}
ol.career-box{counter-reset: listnum;list-style: none;}
.career-box li{background-color:#f2f2f2;padding:30px 50px 30px 100px;margin:20px 10%;font-size:clamp(1rem, 0.818rem + 0.91vw, 1.5rem);text-align:center;position:relative;}
.career-box li span{font-weight:700;background: linear-gradient(transparent 70%, #faff6b 70%);}
.career-box li::before{content:'1';font-size:clamp(1.5rem, 0.909rem + 2.95vw, 3.125rem);font-weight:800;background-color:var(--main-color);border-radius:50%;color:#fff;position:absolute;left:20px;padding:0 20px;counter-increment: listnum;content: counter(listnum);}
.career-flex2{max-width:1100px;margin: 50px auto 80px;display:flex;flex-wrap:wrap;gap:10px 5%;}
.career-flex2 img{width:47%;height:auto;}
.career-flex2 p{width:47%;line-height:200%;font-size:18px;align-self:center;}
.bn{width:100%;height:auto;}
.step-flex{display:flex;flex-wrap:wrap;gap:10px 2%;margin-bottom:80px;}
.step-flex li{width:31%;background-color:#f2f2f2;border-radius:10px;}
.step-flex li.box{width:23%;}
.step-flex h4{background-color:#333;font-size:20px;font-weight:700;color:#fff;padding:10px;text-align:center;border-radius:10px 10px 0 0;}
.step-flex p{padding:15px;}
.step-flex p span{display:block;color:var(--main-color);text-align:center;font-size:20px;font-weight:700;padding-bottom:10px;}
.yakushoku{max-width:800px;padding:20px;margin:0 auto;margin-bottom:80px;}
.yakushoku li{font-size:22px;padding:20px;margin-bottom:30px;box-shadow: 5px 10px 20px rgba(0,0,0,0.25);font-weight:300;position:relative;}
.yakushoku li h4{display:inline-block;width:25%;font-weight:600;}
.yakushoku li:after{content: '';position: absolute;top: 100%;left: 50%;transform: translateX(-50%);border-top: 15px solid red;border-right: 15px solid transparent;border-left: 15px solid transparent;}

/**************************************************************
よくある質問
**************************************************************/


#qa .accordion-area{
    list-style: none;
    width: 96%;
    max-width: 900px;
    margin:0 auto;
	text-align:left;
	padding:50px 0;
}

#qaa .accordion-area li{
    margin: 20px 0;
}

#qa .accordion-area section {
	border: 2px solid #ccc;
	margin: 20px 0;
	padding:0;
}


#qa .title {
    position: relative;
    cursor: pointer;
    font-size:18px;
    font-weight: normal;
    padding: 3% 3% 3% 50px;
    transition: all .5s ease;
	color:#000;
	font-weight:700;
}
#qa .title span {
	background-color:var(--main-color);
	padding:10px 15px;
	margin-right:10px;
	border-radius: 50%;
	color:#fff;
}
#qa .title::before,
#qa .title::after{
    position: absolute;
    content:'';
    width: 15px;
    height: 2px;
    background-color: #333;
    
}
#qa .title::before{
    top:48%;
    left: 15px;
    transform: rotate(0deg);
    
}
#qa .title::after{    
    top:48%;
    left: 15px;
    transform: rotate(90deg);

}

#qa .title.close::before{
	transform: rotate(45deg);
}

#qa .title.close::after{
	transform: rotate(-45deg);
}

#qa .box {
    display: none;
    background: #f3f3f3;
	margin:0 3% 3% 3%;
    padding: 3%;
}

#qa .box .aa {
	display: inline-block;
	background-color: #2B2929;
	margin-bottom:10px;
	padding:10px 18px;
	border-radius: 50%;
	color:#fff;
}
/**************************************************************
研修教育制度
**************************************************************/
#environment{
	max-width:1200px;
	padding:0 10px;
	margin-inline:auto;
	margin-bottom:80px;
}
.en-flex{
	display:flex;
	flex-wrap:wrap;
	gap:20px 5%; 
	padding:50px;
	box-shadow: 5px 10px 20px rgba(0, 0, 0, 0.25);
	margin-bottom:50px;
}
.en-flex .img{
	width:40%;
}
.en-flex .img img{
	width:100%;
	height:auto;
}
.en-flex .text{
	width:55%;
	line-height:180%;
}
.en-flex .text h3{
	font-size:26px;
	color:var(--main-color);
	padding:50px 0;
	font-weight:600;
}
.en-flex .text span{
	font-weight:800;
}
/**************************************************************
座談会
**************************************************************/


.talk-flex{
	max-width:1100px;
	display:flex;
	flex-wrap:wrap;
	margin:50px auto;
	gap:30px 6%;
}
.talk-flex li{
	width:47%;
}
.talk-flex .talk-img {
	position:relative;
	border: solid 1px #8d8d8d;
    box-shadow: 10px 10px 0px 0px rgb(85 83 83 / 9%);
}
.talk-flex .talk-img img{
	width:100%;
	height:auto;
}
.talk-flex h3{
	font-size:clamp(1.125rem, 1.08rem + 0.23vw, 1.25rem);
	font-weight:600;
	padding:20px 0;
}
.talk-flex p{
	position:absolute;
	background-color:var(--main-color);
	padding:10px;
	min-width:200px;
	top:-10px;
	left:-5px;
	font-size:20px;
	color:#fff;
	font-weight:800;
	text-align:center;
	border-radius:10px 0 10px 0;
}

.talk-top{
	text-align:center;
	position:relative;
}
.talk-top::before{
	width:100%;
	content:'';
	background-color:#f2f2f2;
    border-bottom-left-radius: 1000px 200px;
    border-bottom-right-radius: 1000px 200px;
    height: 500px;
	display: block;
    z-index: -10;
    position: absolute;
}
.talk-top h3{
	font-size:clamp(1.25rem, 1.023rem + 1.14vw, 1.875rem);
	font-weight:800;
	padding:50px 5px;
}
.talk-top h3 span{
	background-color:var(--main-color);
	padding:10px 20px;
	min-width:250px;
	display:inline-block;
	margin:0 auto 20px;
	color:#fff;
	font-size:clamp(1.125rem, 0.989rem + 0.68vw, 1.5rem);
}

.talk-top .img{
	max-width:800px;
	margin-inline:auto;
}
.talk-top .img img{
	width:100%;
	height:auto;
}

.speech {
  position: relative;
  display: inline-block;
  margin: 20px 10px 0;
  padding: 15px;
  border: 2px solid #000000;
  border-radius: 9999px;
  background-color: #ffffff;
  text-align: left;
  font-size: 20px;
  font-weight: 400;
  line-height: 1.5;
  color: #000000;
	width:200px;
	text-align:center;
}

.speech::before {
  content: "";
  position: absolute;
  bottom: 0;
  left: 50%;
  border-style: solid;
  border-width: 20px 10px 0 10px;
  border-color: #000000 transparent transparent;
  translate: -50% 100%;
}

.speech::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 50%;
  border-style: solid;
  border-width: 15.5px 7.8px 0 7.8px;
  border-color: #ffffff transparent transparent;
  translate: -50% 100%;
}

.speech-flex{
	display:flex;
	flex-wrap:wrap;
	justify-content:center;
	max-width:800px;
	margin: 0 auto;
	gap:10px 2%;
	background-color: #f2f2f2;
    padding:20px;
    border-radius: 10px;
}
.speech-flex .speecker{
	width:19%;
}
.speech-flex .speecker img{
	width:100%;
	height:auto;
	border-radius:50%;
}
.speech-flex h4{
	width:25%;
	align-self:center;
	text-align:left;
	font-weight:500;
	font-size:clamp(0.875rem, 0.83rem + 0.23vw, 1rem);
}
.speech-flex h4 .hitori{
	color:#0066ff;
	font-size:clamp(1rem, 0.909rem + 0.45vw, 1.25rem);
}
.speech-flex h4 .futari{
	color:#DF334E;
	font-size:clamp(1rem, 0.909rem + 0.45vw, 1.25rem);
}
.speech-box{
	max-width:1000px;
	margin:50px auto;
	font-size:clamp(0.938rem, 0.869rem + 0.34vw, 1.125rem);
	  line-height: 180%;
}
.speech-box .qqq{
	font-size:clamp(1.125rem, 0.807rem + 1.59vw, 2rem);
	padding:50px 20px 50px 100px;
	position:relative;
	font-weight:800;
	line-height:130%;
}

.speech-box .qqq:before{
	content:'Q';
	background-color:var(--main-color);
	padding:20px;
	position:absolute;
	left:0;
	border-radius:20px;
	color:#fff;
	font-size:clamp(1.5rem, 0.909rem + 2.95vw, 3.125rem);
	font-weight:800;
}

.aaa-flex{
	display:flex;
	flex-wrap:wrap;
}
.aaa-flex img{
	width:100px;
	height:100px;
	margin-right:20px;
	border-radius:50%;
}
.speech-box .aaa01, .speech-box .aaa02{
	flex:1;
  position: relative;
  display: inline-block;
  margin:0 0 30px 0;
  padding: 50px;
  border-radius: 20px;
  font-weight: 400;
	background-color:#E0F2F9;
}

.speech-box .aaa01::after, .speech-box .aaa02::after  {
  content: "";
  position: absolute;
  top: 30%;
  left: 0;
  border-style: solid;
  border-width: 8px 16px 8px 0;
  border-color: transparent #E0F2F9 transparent transparent;
  translate: -100% -50%;
  transform: skew(0, 4deg);
  transform-origin: right;
}
.speech-box .aaa02{
  background-color: #fae4e7;
}
.speech-box .aaa02::after {
  border-color: transparent #fae4e7 transparent transparent;
}

.aaa-img{
	width:100%;
	height:auto;
}