@charset "utf-8";
/*
Theme Name: KYOTEC
Theme URI:
Description:
Author:有限会社京テク
Author URI: https://rkyotec.com/
Version:1.0.0
*/

/* ------------------------

	BASIC

------------------------ */
body,html{
	font-size:18px; line-height:1.8em;
	font-family: "メイリオ", sans-serif;
}
b{ font-size: 1.11rem;}
picture{
	display: block;
	line-height: 0 !important;
}
@media only screen and ( max-width : 959px ) {
	body,html{font-size:4vw;}
}
p+p{ margin-top:1.5rem;}

.e-mds{
	color: #1d2083;
	font-weight: 700;
  letter-spacing: .05em;
	position: relative;
	padding-left: 1.3em;
}
.e-mds::before{
	content: "";
	display: block;
	width: 1em;
	height: 1em;
	background: url(assets/images/icon-ttlmark.png) center center / contain no-repeat;
	position: absolute;
	left: 0;
	top: 0;
}
.e-mds.m-noMark{
	padding-left: 0;
	line-height: 1.5;
}
.e-mds.m-noMark::before{
	display: none;
}
.txtCenter{ text-align: center;}
.th2{ line-height: 2.5rem}
.pc{ display:block;}
.sp{ display:none;}

@media only screen and ( max-width : 959px ) {
	.e-mds{
		font-size: 5.5vw;
	}
}
@media only screen and ( min-width : 960px ) {
	.e-mds.m-noMark{
		font-size: 1.6em;
	}
}
/* width -------------*/
#wrap{width: 100%;}
header{ position: relative; z-index: 5;}
header div,section,.infomation div{ width:1100px; margin:auto;}

@media only screen and ( min-width : 960px ) and ( max-width : 1160px) {
	header div,section{ padding:0 30px;}
}
@media only screen and ( max-width : 959px ) {
	.pc{ display: none;}
	.sp{ display: block}
	
	header div{ width: 95vw; margin:auto;}
	section,.infomation div{ width:90vw; margin:auto;}
}

/* ------------------------

	CUSTOME

  keycolor
　#c33-red / #1d2083-basicblue / #000354-titleblue / #0066cc-skyblue

  box #f3f3f3 border #cacaca
  background #ececec

------------------------ */

/* header */
header div.hdBox{
	display: flex; align-items: center; justify-content: flex-start;
	position:relative;
}
header div.hdBox img.logo{ width:178px; margin-top:8px;}
header div h1{ 
	width: 235px; height: 46px; margin:0 60px 0 20px;
	background:url(assets/images/hd-read.png);
}
header div h1 div{ display: none;}
header div img.hdEntry{ position: absolute;right:0; top:0;}

header .hdLinks{ width: 0;}

nav{ width: 100%;background:#1d2083;}
nav ul{width:1100px; height: 75px; margin:0 auto;
display: flex; align-items: center; justify-content: flex-start; }
nav ul li{ height: 30px; margin-left:60px;}
nav ul img{ height: 30px;}

@media only screen and ( max-width : 959px ) {
	header div.hdBox{display: flex; align-items: flex-end ; justify-content: space-between;}
	header div.hdBox img.logo{ width:35vw; margin-top:6.3vw;}
	header div.hdBox .hd-bt{ width:30vw;margin-bottom:1vw;}
	header div.hdBox .hd-bt img{ width:100%;}
	
	header div h1{
		position:absolute;top:0;
		width:100vw;height:unset;margin:0 !important;;
		background-image:none;text-align: center; }
	header div h1 div{ display: block; font-size:2.5vw; line-height: 1.0em; padding-top:1.2vw;}
	header div h1 div span{ font-size:3vw;}
	
	header .hdLinks{ 
		width: 55%; margin:6vw 0 auto auto;
		display: flex; align-items: center; justify-content: space-between;
	}
	header .hdLinks a{ height:10vw; }
	header .hdLinks a+a{ margin-left:1.5vw;}
	
	nav{ width: 100vw;}
	nav ul{ width: 95vw;height: 10vw}
	nav ul li{height:10vw; margin-left:auto;}
	nav ul li+li{margin-left:3vw}
	nav ul img{ height: unset; width:auto;margin-top:2.5vw}
}

/* main */
main{ margin-top:60px;}
main h2{ margin-bottom:20px;}
main h2:not(.e-mds){ height:45px;}
main h2 img{ height: 45px}
main .btn{ height:90px; margin-top:20px;}

@media only screen and ( min-width : 960px ) {
	main{
		min-height: 1200px;
	}
}
@media only screen and ( max-width : 959px ) {
	main{ margin-top:8vw;}
  main h2{ margin-bottom:3vw;}
  main h2:not(.e-mds){ height:8.5vw;}
  main h2 img{ height: 8.5vw}
  main .btn{ height:17.5vw; margin-top:3vw;}
}

/* links */
.links div{
text-align: center; margin:35px 0;
display: flex; align-items: center; justify-content: center; }
}
.links div a{ display: block;}
.links div a:nth-child(1){ margin-right:120px; padding-right:120px; border-right:3px solid #eee;}
.links div a img{ height:70px; margin-top:15px;}

.ftEntry{
	display:block;width: 1100px;height:170px; margin-bottom:30px;
	background-image:url(assets/images/ft-entry.png);
	background-repeat: no-repeat;
	background-size:contain;
}
.ftEntry span{ display: none}


@media only screen and ( max-width : 959px ) {
	.links div{ margin:3vw 0;}
	.links div a:nth-child(1){ margin-right:5vw; padding-right:5vw;  }
	.links div a img{ height:unset;}
	
	.ftEntry{ width:100%;height:19vw; margin-bottom:3vw;
		background-image:url(assets/images/ft-entry-sp.png); }
}

/* footer */
footer img{ display:block; width: 1000px; margin:auto;}
footer small{ 
	display: block; width: 100%;margin-top:30px; padding:12px 0 8px;
	text-align: center; font-size:0.83rem;
	background:#ebebeb;
}
@media only screen and ( max-width : 959px ) {
	footer a img{ width: 90vw; margin-left:5vw;margin-top:3vw;;}
	footer small{ width: 100vw; margin-top:5vw; font-size:4vw; padding:3vw 0 2vw; }
}

/* ------------------------

 index

------------------------ */


/* mainImg */
.bxslider img{ width: 100%;}
.bx-wrapper{margin-bottom:0;}
.bx-controls{ display: none;}

/* banner */
.b-banner{
	background: #eee;
	position: relative;
	z-index: 1;
}
.b-banner a{
	display: block;
	margin: auto;
}
.b-banner a img{
	width: 100%;
}
@media only screen and ( min-width : 960px ) {
	.b-banner{
		margin-bottom: -25px;
	}
	.b-banner a{
		width: 780px;
		transform: translateY(-25px);
	}
	.b-banner img{
		filter: drop-shadow(3px 3px 3px rgba(0,0,0,.3));
	}
}

/* information */
.infomation{ width: 100%;background:#eee;
	display: flex; align-items: center; justify-content: flex-start;
	position: relative;
}
.infomation .b-flex{
	display: flex;
	align-items: flex-start;
	z-index: 2;
}
.infomation div p{ 
	display: inline-block;
	margin-right:25px !important;
	font-weight:bold ; color:#fff;
	background-color:#b1b1b1;
	position:relative;
	padding:5px 7px 5px 13px;
	margin:8px 0;
	white-space: nowrap;
}
.infomation div p::after{
	content:"";
	display:block;
	position:absolute; top:0;right:-10px;
	width:10px; height:100%;
	background-image:url(assets/images/info-bg.png);
	background-position:right;
	background-size: cover;
}

.infomation a{
	display: block;
	position: relative;
  padding-left: .8em;
	color:#000;
	padding-right: .5em;
}
.infomation a::before{
	content: "";
    position: absolute;
    top: .5em;
    left: 0;
    width: 0;
    height: 0;
    border-width: .4em;
    border-style: solid;
    border-color: transparent transparent transparent #8b6b4e;
}

@media only screen and ( max-width : 959px ) {
	.infomation .b-flex{
		width:100vw;
	}
	.infomation .b-flex p{
		display: flex;
		align-items: center;
		justify-content: center;
		align-self: stretch;
		line-height: 1;
		padding:0.3em 0.8em;
		margin:0 1.0em 0 0 !important;
		min-width: 6em;
	}
	.infomation .b-flex p::after{ display: none}
	.infomation .b-flex a{
		padding-top: .3em;
		padding-bottom: .15em;
		align-self: center;
		line-height: 1.5;
	}
	.infomation a::before{
		top: .7em;
	}
	.infomation .b-flex div{
		padding: .5em 0;
	}
}
@media only screen and ( min-width : 960px ) {
	.infomation{
		padding: 15px 0;
	}
}

/* TopWorks */
.TopWorks div:nth-child(1){ width:555px; float: left;}
.TopWorks img.fltR{ float:right; width:520px;}
.TopWorks div:nth-child(3){ clear:both;}
.TopWorks div:nth-child(3) a{
	display:block;width:100%; height:315px;
	background-size: contain;
	background-repeat:no-repeat;
	background-image:url(assets/images/202012/top-voice2.png);
}
.TopWorks div:nth-child(3) a span{ display:none}

@media only screen and ( max-width : 959px ) {
	.TopWorks div:nth-child(1){ width:100%;}
	.TopWorks img.fltR{ float: none; width:100%;}
	.TopWorks div:nth-child(3){padding-top:3vw !important;}
	.TopWorks div:nth-child(3) a{
		height: 38vw;
		background-image:url(assets/images/202012/top-voice2-sp.png);
	}
}

/* TopMessage */
.TopMessage{ width: 100%; background:#eee; margin-top:50px;}
.TopMessage div.TopMessageBox{ width: 1100px; margin:0 auto;
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
	background-image:url(assets/images/top-messege.png);
}
.TopMessage div div{ width: 530px; text-align:center; margin:0 80px 0 auto; padding:40px 0 20px;}
@media only screen and ( max-width : 959px ) {
	.TopMessage{ width: 100vw; margin-top:8vw;}
	.TopMessage div.TopMessageBox{ width: 100vw;
		background-image:url(assets/images/top-messege-sp.png);
		background-size:130%;
		background-position:left bottom;
	}
	.TopMessage div div{ width: 100%; margin:0; padding:8vw 0 3vw;}
	.TopMessage div div p{ width:45%; text-align:left; margin:5vw 5vw 6vw auto;}
}

/* ------------------------

 Under

------------------------ */

/* title */
.mainImgTtl{
	display: flex; justify-content: center; align-items: center;
	height: 200px; background:#000354;
}
.mainImgTtl img{ width:575px;}
@media only screen and ( max-width : 959px ) {
	.mainImgTtl{ width:100vw; height:30vw }
	.mainImgTtl img{ width:80%; margin-left:5%;}
}

/* pageNav */
.pageNav{ display: flex; justify-content: center; align-items: center;
	background:url(assets/images/line-dash.png) repeat-x bottom;
	padding:40px 0 40px; margin-bottom:60px;
}
.pageNav:nth-child(1){ margin-top:-60px;}
.pageNav li+li{ margin-left:60px;}
.pageNav li a{ line-height: 1.0em; color:#06c; position:relative; text-decoration:none;}
.pageNav li a:hover{ text-decoration: underline}
.pageNav li a::before{
	content:"";
	display: inline-block;
	position: absolute; left:-1.3em; top:4px;
	width: 18px;height: 18px;
	background-size:contain;
	background-repeat:no-repeat;
	background-image:url(assets/images/arrow.png);
}
@media only screen and ( min-width : 960px ) {
	.pageNav.recNav li+li{ margin-left:35px;}
}
@media only screen and ( max-width : 959px ) {
	.pageNav{ display: block; padding:6vw 0 7vw; margin-bottom:8vw;}
	.pageNav:nth-child(1){ margin-top:-8vw;}
	.pageNav li,.pageNav li+li{ display: block; margin-left:10vw;}
	.pageNav li a::before{ width:4vw; height:4vw;}
}

/* work ---------------------------------*/
.WorksBox,.WorksSupport{
	background:url(assets/images/line-dash.png) repeat-x bottom;
	padding-bottom:60px;
}
@media only screen and ( max-width : 959px ) {
	.WorksBox,.WorksSupport{padding-bottom:10vw;}
}

/**/
.WorksSupport{ padding-top:60px;}
.WorksSupport+.pageNav{ background: none;}
@media only screen and ( max-width : 959px ) {
	.WorksSupport{ padding-top:10vw;}
}

/**/
.WorksVoice{ width: 100%; padding:70px 0; margin: auto 0; background:#ececec;}
.WorksVoice div{ 
	 margin: auto;
/*	background-image:url(assets/images/work-voice-bg.png);
	background-size:contain;
	background-repeat: no-repeat;
	background-position:right bottom;
	position:relative;*/
}
/*
.WorksVoice div h2{ position:absolute; top:-50px; }
.WorksVoice div h2 img{ width:435px; height: auto;}
*/
.WorksVoice h2,
.WorksVoice h2 img{
	width:400px; height:auto !important;
}
.WorksVoice h2{ margin-bottom:0;}

.WorksVoice div.txtBox{ margin:0; margin-bottom:5px; }
.WorksVoice div .sign{ margin-top:0.8em;}
.WorksVoice div .sign span{
	background:#d0d0d0;
	line-height:1.0;
	padding:.3em 1.0em .15em;
}
.WorksVoice div.imgBox img{
	vertical-align: bottom;
}

.WorksVoice-p .sign{ text-align: right;}

@media only screen and ( min-width : 960px ) {
	.WorksVoice-p{
		display: flex; align-items: flex-end;
		width: 1100px;
	}
	.WorksVoice .imgBox{
		width:430px;min-width:430px;
	}
	.WorksVoice-p02 .imgBox{ margin-right:20px;}
	.WorksVoice-p01{ flex-direction: row-reverse; margin-top:-60px !important;}
	.WorksVoice-p01 .sign{ padding-right: 10px}
	.WorksVoice-p02 .sign{ text-align: left; }
}
@media only screen and ( max-width : 959px ) {
	.WorksVoice{ width: 100vw;}
	.WorksVoice h2,
	.WorksVoice h2 img{
		width:75vw; height:auto;
	}
	.WorksVoice-p{ width:90vw; }
	.WorksVoice-p .imgBox{
		width:60vw; height:60vw;
		overflow-y:hidden;
	}
	.WorksVoice-p .txtBox{
		width:90vw; padding-top:1.0em;;
		background:#ececec ;
	}
}

/**/
.WorksFlow{
	text-align: center; padding:60px 0 0; margin:80px auto;
	border-top:8px solid #1d2080;border-bottom:8px solid #1d2080;}
.WorksFlow h2{ margin-bottom:60px;}
.WorksFlow div{ display: flex; justify-content: space-between; margin-bottom:40px;}
.WorksFlow div:nth-child(3){flex-direction:row-reverse;}
.WorksFlow div figure{
	display:block; width:340px; margin:0; font-size:0.88rem; line-height: 1.5em;
	position:relative;
}
.WorksFlow div figure img{ border-radius: 20px;}
.WorksFlow div figcaption{ margin-top:0.3em;}

.WorksFlow div figure::after{
	content:"";
	position: absolute;
	display: block;
	z-index: 1;
	background-image:url(assets/images/work-day-arrow.png);
	background-size: contain;
	background-repeat: no-repeat;
	width: 25px; height: 25px; top:35%;
}

.WorksFlow div:nth-child(2) figure::after{ right:-35px;}
.WorksFlow div:nth-child(2) figure:nth-child(3)::after{ right:50%; top:unset; bottom:-30px;transform: rotate( 90deg );}

.WorksFlow div:nth-child(3) figure::after{ left:-32px;transform: rotate( 180deg );}
.WorksFlow div:nth-child(3) figure:nth-last-child(1)::after{ display: none;}

@media only screen and ( max-width : 959px ) {
	.WorksFlow{padding:10vw 0 0; margin:15vw auto 10vw;border-top:4px solid #1d2080;border-bottom:4px solid #1d2080;}
	.WorksFlow h2{ margin-bottom:10vw;}
	.WorksFlow div{display:block;} 
	.WorksFlow div figure{width:100%;margin-bottom:13vw;} 
	.WorksFlow div figure::after{
		width:10vw;height:10vw;
		top: unset !important; bottom:-11vw !important;left:unset !important; right:45% !important;
		transform: rotate( 90deg ) !important;
	}
	.WorksFlow div:nth-child(3){ margin-bottom:5vw;}
	.WorksFlow div:nth-child(3) figure:nth-last-child(1){ margin-bottom:0 !important;}
}


/* Q&A ---------------------------------*/
.b-faq{
	margin-bottom: .8em;
}
.b-faq .e-faqQ{
	display: flex;
	align-items: center;
	background: #eee;
	border-radius: 5px;
	padding: 1em 1.4em .8em .8em;
	cursor: pointer;
	position: relative;
}
.b-faq .e-faqQ::after{
	content: "▼";
	font-size: 1.2em;
	transform-origin: center center;
	transform: translateY(-50%);
	position: absolute;
	right: .7em;
	top: 50%;
	transition: .3s all;
	color: #ccc;
}
.b-faq .e-faqQ:hover::after{
	color: #06c;
}
.b-faq .e-num{
	margin-right: .3em;
	font-size: 2.5em;
	position: relative;
	color: #fff;
}
.b-faq .e-faqA{
	display: none;
	padding-left: 4.9em;
	padding-right: 2em;
	position: relative;
	font-size: .9em;
	margin-top: 1.3em;
	margin-bottom: 3em;
}
.b-faq .e-faqA p+p{
	margin-top: .8em;
}
.b-faq .e-faqA::before{
	content: "A";
	color: #06c;
	position: absolute;
	left: .3em;
	top: .3em;
	font-size: 4em;
	opacity: .3;
}

@media only screen and ( max-width : 959px ) {
	.b-faq .e-faqQ{
		padding-right: 2em;
	}
	.b-faq .e-num{
		font-size: 2em;
	}
	.b-faq .e-faqQ::after{
		font-size: 1em;
	}
	.b-faq .e-faqA{
		padding-left: 4em;
		padding-right: 0;
		margin-bottom: 2em;
	}
	.b-faq .e-faqA::before{
		font-size: 3em;
	}
}



/* message ---------------------------------*/

.MessageBox::after{ content:""; display: block; clear: both;}
.MessageBox div{ width: 635px; float: left}
.MessageBox div h2 { height: unset;}
.MessageBox div h2 img{ float: unset; width:615px; height: unset; margin-bottom:20px;}
.MessageBox > img {float:right;}
@media only screen and ( max-width : 959px ) {
	.MessageBox{
		display: flex;
		flex-wrap: wrap;
	}
	.MessageBox h2 img{
		display: block;
		width :150vw;
		margin-bottom: 4vw;
	}
	.MessageBox > img {
		float:unset;
		margin-top:8vw;
		order: 5;
	}
}
@media only screen and ( min-width : 960px ) {
	.MessageBox > img {
		margin-left: 1.3em;
		margin-bottom: 1.5em;
	}
}

/**/
.MessageHito{ width: 100%; background:#ececec; padding:60px 0; margin:70px 0;}
.MessageHito h2{ text-align:center; margin-bottom:30px; }
.MessageHito p{ width:1100px; }
.MessageHito p span{ font-weight: bold; color:#1d3083; font-size:1.2rem;}
@media only screen and ( max-width : 959px ) {
	.MessageHito{ width: 100vw; padding:15vw 0; margin:15vw 0 10vw;}
	.MessageHito h2{ margin-bottom:5vw; }
	.MessageHito p{ width:90vw; }
}

/* company ---------------------------------*/

.CompanyIdea,.CompanyDetail dl{ width: 980px; }
@media only screen and ( max-width : 959px ) {
	.CompanyIdea,.CompanyDetail dl{ width:95vw}
}

/**/
.CompanyIdea{ text-align: center; background:#ececec; padding:50px 0; }
.CompanyIdea h2{ margin-bottom:40px; }
@media only screen and ( max-width : 959px ) {
	.CompanyIdea{ width: 95vw; margin-left:2.5vw; padding:8vw 0; }
	.CompanyIdea h2{ height: auto; margin-bottom:3vw;}
	.CompanyIdea h2 img{ width: 30%; height: auto; margin-bottom:0; }
	.CompanyIdea h2+img{ display: block; width: 90%; margin:auto;}
}

/**/
.CompanyDetail{
	margin:30px auto 70px;
	background:url(assets/images/line-dash.png) repeat-x bottom;
} 
.CompanyDetail dl{
	display: flex; flex-wrap: wrap;
	margin:auto; padding-bottom:30px;
}
.CompanyDetail dl dt,.CompanyDetail dl dd{ 
	box-sizing: border-box;
	border-bottom:1px solid #cacaca;
	padding-bottom:1.2em; margin-bottom:1.2em;
}
.CompanyDetail dl dt{ width: 250px; font-weight:bold; color:#1d3083;padding-left:1.5em;}
.CompanyDetail dl dd{ width: 730px }
.CompanyDetail dl dt:nth-last-child(2),.CompanyDetail dl dd:nth-last-child(1){ border-bottom:0 none; }

@media only screen and ( max-width : 959px ) {
	.CompanyDetail{ margin:5vw auto 10vw; }
	.CompanyDetail dl{ display: block; padding-bottom:1vw;}
	.CompanyDetail dl dt,.CompanyDetail dl dd{ width:100%;padding-left:0.5em; padding-right:0.5em;}
	.CompanyDetail dl dt{ border-bottom:0 none;padding-bottom:0; margin-bottom:0;}
	.CompanyDetail dl dd{}
}

/* recruit ---------------------------------*/

.RecList h2,.RecList ul,.RecList table,.RecList div.RecLinks{width: 980px; margin:auto;}

@media only screen and ( max-width : 959px ) {
	.RecList h2,.RecList ul,.RecList table,.RecList div.RecLinks{width: 100%; margin:auto;}
}
/**/
.RecList{
	margin:60px auto; padding-bottom:60px;
	background:url(assets/images/line-dash.png) repeat-x bottom;
}
.RecList h2{ 
	height: unset; 
	background:#06c; color:#fff;
	font-size:1.22rem;
	padding:0.5em;
}
@media only screen and ( max-width : 959px ) {
	.RecList{margin:10vw auto; padding-bottom:12vw;}
}
/**/
.RecList ul{ display: flex; flex-wrap: wrap; padding:20px 0 10px;}
.RecList ul li{
	border:1px solid #06c; color:#06c; font-size:0.83rem; line-height: 1.0em;
	padding:0.5em 0.8em; margin-right:8px;margin-bottom:8px;
}
@media only screen and ( max-width : 959px ) {
	.RecList ul{ display: flex; justify-content:center; flex-wrap: wrap; padding:3vw 0 1vw;}
	.RecList ul li{margin-right:1.5vw;margin-bottom:1.5vw;}
}
/**/
.RecList table{
	 border-top:1px solid #cacaca;
	 border-left:1px solid #cacaca;
	 border-right:1px solid #cacaca;
}
.RecList table th,.RecList table td{
	border-bottom:1px solid #cacaca;
	padding:20px 25px;
}
.RecList table th{
	width: 20%;
	background:#f3f3f3; font-weight: normal; text-align: left; vertical-align: top;
}
@media only screen and ( max-width : 959px ) {
	.RecList table th,.RecList table td{
		display:block; width:100%;
		padding:1.5vw 3vw;
	}
	.RecList table th{ border-bottom:0 none; }
}
/**/
.RecList div.RecLinks{
	display: flex; justify-content: center; align-items:center;
	padding-top:25px;
}
.RecList div.RecLinks a{
	display: flex; justify-content: center; align-items:center;
	box-sizing: border-box; width: 300px;
	font-size:1.22rem; font-weight: bold;
	line-height:1.0em; text-align: center;
	text-decoration: none;
	padding:15px 0 13px;
}
.RecList div.RecLinks a::before{
	content:"";
	display: inline-block;
	width: 35px; height: 35px; margin-right:0.5em;
	background-repeat: no-repeat;
	background-size: contain;
}
.RecList div.RecLinks a+a{ margin-left:20px;}

a.RecDetailLnk{ border:3px solid #06c; color:#06c;}
a.RecDetailLnk::before{
	background-image:url(assets/images/mk-recruit.png);
}
a.EntryLink{ border:3px solid #c33;background:#c33; color:#fff;}
a.EntryLink::before{
	background-image:url(assets/images/mk-entry.png);
}
@media only screen and ( max-width : 959px ) {
	.RecList div.RecLinks{ display:block; padding-top:5vw;}
	.RecList div.RecLinks a{ width: 90%; margin:auto;padding:2vw 0 2vw;}
	.RecList div.RecLinks a::before{width: 8vw; height: 8vw;}
	.RecList div.RecLinks a+a{ margin-left:auto; margin-top:2vw;}
}


/* recruit-detail ---------------------------------*/
.RecList div,.RecList p{width: 980px; margin:auto;}
.RecList .b-faq p{width: auto;}
.RecList div{ margin-top:30px;}
.RecList div h3{
	width: 100%; padding:0.8em 1.0rem; margin-bottom:0.5em;
	font-weight: normal; font-size: 1.0rem; line-height: 1.0em;
	background:#f3f3f3; border-left:7px solid #0066cc;
}
@media only screen and ( max-width : 959px ) {
	.RecList div,.RecList p{width: 100%; margin:auto;}
}
/**/
.RecList div.RecLinksD{
	display: flex; justify-content: center; align-items:center;
}
.RecList div.RecLinksD a{
	display: flex; justify-content: center; align-items:center;
	box-sizing: border-box; width: 300px;
	font-size:1.22rem; font-weight: bold;
	line-height:1.0em; text-align: center;
	text-decoration: none;
	padding:15px 0 13px;
}
.RecList div.RecLinksD a::before{
	content:"";
	display: inline-block;
	width: 35px; height: 35px; margin-right:0.5em;
	background-repeat: no-repeat;
	background-size: contain;
}
@media only screen and ( max-width : 959px ) {
	.RecList div.RecLinksD{ display:block; padding-top:5vw;}
	.RecList div.RecLinksD a{ width: 90%; margin:auto;padding:2vw 0 2vw;}
	.RecList div.RecLinksD a::before{width: 8vw; height: 8vw;}
}
/**/
#detalDetail h2,#detalFlow h2{ background:none; text-align:center;}
#detalFlow{ text-align: center; background: none;}
#detalFlow p+p{ margin-top:1.5em;}

#detalFlow iframe{ width: 100%; height: 280px; margin-top:1.5em; border:0;}
@media only screen and ( max-width : 959px ) {
	#detalFlow iframe{ width: 100%; height: 80vw;}
}

.detailMds{
	display: inline-flex;
	align-items: center;
	justify-content: center;
}
.detailMds::before,
.detailMds p{
	margin: 0;
}
.detailMds::before{
	content:"";
	display: block;
	background: url(assets/images/recruit-mds.png) center center / contain no-repeat;
	width: 55px;
	height: 55px;
	margin: 0;
	margin-right: 1em;
	
}
.detailMds p{
	width: auto;
	color: #000;
	font-size: 38px;
}
@media only screen and ( max-width : 959px ) {
	.detailMds::before{
		margin-left: calc( -45px);
	}
	.detailMds p{
		font-size: 7vw;
	}
}

/* entry --------------------*/
.EntryBox,p.form_lead{ width: 850px;background:#f3f3f3; margin: auto; margin-bottom:50px;}
.EntryBox{
	padding-top: 60px;
}
p.form_lead{
	text-align: center;
	background: #fff;
}
.EntryBox p{ text-align: center;padding:60px 0 30px;}
.EntryBox p.comment{ padding:30px 0 80px; font-size:0.83rem;}
.EntryBox dl{
	width:600px; margin:auto;
	display: flex; justify-content: space-between; align-items:center;
}
.EntryBox dl+dl{ margin-top:20px;}
.EntryBox dt{ width: 180px; text-align: right;}
.EntryBox dd{ width: 400px ; text-align: left;}
@media only screen and ( max-width : 959px ) {
	.EntryBox,p.form_lead{ width: 90vw; margin-bottom:5vw;}
	.EntryBox{ padding-top: 8vw;}
	.EntryBox p{ padding:8vw 0 5vw; font-size:0.9rem; line-height: 1.5em}
	.EntryBox p.comment{ padding:6vw 0 8vw; font-size:0.83rem;}
	.EntryBox dl{ width:90%;display: block}
	.EntryBox dt,.EntryBox dd{ width: 100%}
	.EntryBox dt{ text-align: left}
	form dl+dl{ margin-top:3vw;}
	.mwform-checkbox-field.horizontal-item{ width:50%;}
}


/* Required */
span.Required,span.noRequired{
  box-sizing: border-box;
	line-height: 1.0em;
  padding: 0.1em 0.5em;
  margin-left:0.5em;
  border: 0 none;
  color:#fff;
	font-size:0.83rem;
}
span.Required{background: #06c;}

.Form-footer{ display: flex; justify-content: center;
margin:50px 0 0;}

@media only screen and ( max-width : 959px ) {
.Form-footer{ display: flex; justify-content: center;
margin:5vw 0 0;}
}


/* form input --------------------*/

.mwform-checkbox-field{display: block; }
.Form-check .mwform-radio-field{ display: inline-block;}
.mw_wp_form .horizontal-item{
	margin-left: 0 !important;
}
.mwform-radio-field label{
  position: relative;
  padding-left:25px;
  margin-right:20px;
  cursor: pointer;
}
input[type="radio"]{ display: none; }
.mwform-radio-field label input[type="radio"]+span:before{
  display: inline-block;
  content: '';
  box-sizing: border-box;
  border-radius: 50%;
  position: absolute;
  top:2px;
  left:0;
  width: 20px;
  height: 20px;
  border: 1px #cecece solid;
}

@media only screen and ( max-width : 959px ) {
	.mwform-radio-field label{padding-left:5vw;}
	.mwform-radio-field label input[type="radio"]+span:before{
  top:0;left:0;
  width: 4vw;height: 4vw;
	}
}
.mwform-radio-field label input[type="radio"]:checked+span:before{
  border: 3px #0066cc solid;
}
input[type="text"],input[type="email"],textarea,select{
  box-sizing: border-box;
  width: 100%;
  padding:10px 15px 8px;
  background:#fff;
  border:1px solid #e2e2e2;
  border-radius: 8px;
  color:#444;
  font-size:15px;
}
dd.age input[type="text"]{ width:52px !important;;}
input[type="email"]{display:block;}
input[name="email_confirm"]{ margin-top:15px;}
input[type="text"]:focus,input[type="email"]:focus,textarea:focus{
  background:#faffd2 ;
  border:1px solid #f6f2dd; 
}
input[type="submit"],
input[type="button"]{
  box-sizing: border-box;
  width: 30%; border-radius: 5px;
  padding: 20px 0;
  background: #c33;
  border: 0 none;
  color:#fff; font-weight: bold;
  cursor: pointer;
}
input[name="submitBack"]{background: #999; margin-right:20px;}
textarea{ margin-top:0.5em;}
input::placeholder{ color:#cecece; }

@media only screen and ( max-width : 960px ) {
  .mwform-radio-field label{ display: block; margin-top:0px; margin-right:0; }
  input[name="submitBack"]{ margin-right:2vw;}
}


/* ------------------------

	INFORMATION

------------------------ */
.blogList{ width: 850px; margin-bottom:60px; }
.blogList a{ 
	display: block; padding:20px 10px;
	color:#000; text-decoration: none;}
.blogList a:hover{ text-decoration: underline;}
.blogList a+a{background:url(assets/images/line-dash.png) repeat-x top;}
@media only screen and ( max-width : 960px ) {
	.blogList{ width: 95vw; margin-bottom:5vw; }
	.blogList a{padding:3vw 1.0em; }
}

article section{width:850px;}
.artHead{ padding-bottom:20px; margin-bottom:30px; border-bottom:1px solid #cacaca; font-weight: bold; color:#1d2083;}
.blogTtl{ padding-top:5px; font-size:1.5rem;}
@media only screen and ( max-width : 960px ) {
	article section{ width: 95vw; margin-bottom:5vw; }
}

.pager{
	width: 850px;display: flex; justify-content:center;
	margin:60px auto;padding-top:30px;
	border-top:1px solid #cacaca;
}
.pager a{ 
	padding:0 13px;
	background:#06c; min-width: 30px; text-align: center; 
	color: #fff; text-decoration: none;
	border-radius: 5px;
}
.pager a+a{ margin-left:8px;}

@media only screen and ( max-width : 960px ) {
	.pager{ width: 95vw;margin:10vw auto;padding-top:10vw;}
}