@charset "UTF-8";

/*** CSS Document ********************************************

	custom.css

*************************************************************/
img{
	max-width: 100%;
}
#icatch{
}

/*/////▼ SNS ▼////*/
#sns{
	padding: 10px 10px 0 0;
	box-sizing: border-box;
}
#sns ul li{
	width: 30px;
	float: right;
	margin: 0 0 0 10px;
}
#read{
	width: 100%;
	padding: 10px 20px;
	font-size: 12px;
	box-sizing: border-box;
	text-align: justify;
	letter-spacing: 0.1em;
	line-height: 1.3;
	background: url(../img/bg.png);
	background-size: cover;
}
#read h2{
	font-size: 22px;
	font-weight: lighter;
	text-align: center;
	padding: 50px 0 0 0;
	background: url(../img/tpc_bg.png) no-repeat center top;
	background-size: auto 40px;
}
/*/////▼ LPバナー ▼////*/
.adbnr{
	width: 100%;
}
	.adbnr h3{
		width: 100%;
		margin: 0 auto 10px auto;
		background: #000;
		padding: 5px 0;
		color: #fff;
		font-size: 14px;
		font-weight: lighter;
		text-align: center;
	}
.adbnr ul{
	width: 100%;
	margin: 30px auto 0 auto;
	padding: 0 10px;
	box-sizing: border-box;
}
.adbnr ul li{
	margin: 0 0 10px 0;
}
.adbnr ul li:last-child{
	margin: 0;
}
.adbnr ul li a{
	display: block;
	padding: 5px;
	box-sizing: border-box;
	background: #f2f2f2;
	color: #000;
	text-align: center;
	border-bottom: 2px solid #e6e6e6;
	border-radius: 100px;
	font-size: 80%;
}

#area{
	width: 100%;
	box-sizing: border-box;
}

/* /////////////////////////////////
見出し指定
///////////////////////////////// */
#area h2{
	font-weight: lighter;
	color: #fff;
	font-size: 20px;
}
#area h2 span{
	display: block;
	font-size: 12px;
	padding: 0 0 0 0;
	font-family: 'Montserrat', sans-serif;
}

/* ////////////////////////////////// */


/* /////////////////////////////////
お仕事検索
///////////////////////////////// */
#area{
	padding: 20px 10px;
}
#area dl{
	width: 100%;
	padding: 20px 0;
	box-sizing: border-box;
	border-radius: 10px;
	margin: 0 0 2% 0;
}
#area dl dt{
	text-align: center;
	font-size: 14px;
	line-height: 1.2;
}
dl.areamenu dt{
    background:url(../img/open.png) 98% center no-repeat;
	background-size: auto 7px;
    }
dl.areamenu dd{
    display:none;
    }
dl.areamenu dt.active{
    background:url(../img/close.png) 98% center no-repeat;
	background-size: auto 7px;
    }
#area dl dt span{
	display: block;
	font-size: 10px;
	font-family: 'Montserrat', sans-serif;
}
.kanto{
	background: url(../img/ribon.png) no-repeat left top,
		url(../img/area_img01.png) repeat left top;
	background-size: auto 40px, 100% auto;
	background-color:#000;
}
.kansai{
	background: url(../img/ribon.png) no-repeat left top,
		url(../img/area_img02.png) repeat left top;
	background-size: auto 40px, 100% auto;
	background-color:#000;
}
.tokai{
	background: url(../img/ribon.png) no-repeat left top,
		url(../img/area_img03.png) repeat left top;
	background-size: auto 40px, 100% auto;
	background-color:#000;
}
.hokkaido{
	background: url(../img/ribon.png) no-repeat left top,
		url(../img/area_img04.png) repeat left top;
	background-size: auto 40px, 100% auto;
	background-color:#000;
}
.hokuriku{
	background: url(../img/ribon.png) no-repeat left top,
		url(../img/area_img05.png) repeat left top;
	background-size: auto 40px, 100% auto;
	background-color:#000;
}
.shikoku{
	background: url(../img/ribon.png) no-repeat left top,
		url(../img/area_img06.png) repeat left top;
	background-size: auto 40px, 100% auto;
	background-color:#000;
}
.kyusyu{
	background: url(../img/ribon.png) no-repeat left top,
		url(../img/area_img07.png) repeat left top;
	background-size: auto 40px, 100% auto;
	background-color:#000;
}
#area dl dd{
	padding: 10px 0 0 0;
}
#area dl dd ul li{
	width: 100%;
	padding: 0 0 2% 0;
}
#area dl dd ul li a{
	display: block;
	border-radius:5px;
	text-align: center;
	padding: 8px 0;
	background: url(../img/hash.png) no-repeat 5px center #fff;
	background-size: auto 10px;
	border-bottom:2px solid #ccc;
	box-sizing: border-box;
	font-size: 12px;
}
#area dl dd ul li a:hover{
	background: url(../img/hash_w.png) no-repeat 5px center #E74C3C;
	background-size: auto 10px;
	color: #fff;
	border-bottom:2px solid #B52D26;
}
#area dl.popular dd ul li{
	width: 48%;
	padding: 0 1% 2% 1%;
	float: left;
}
#area dl.popular dd ul li a{
	background: url(../img/hash.png) no-repeat 5px center #f2f2f2;
	background-size: auto 10px;
	border-bottom:none;
}
#area dl.popular dd ul li a:hover{
	background: url(../img/hash_w.png) no-repeat 5px center #E74C3C;
	background-size: auto 10px;
}
/* ////////////////////////////////// */


/* /////////////////////////////////
短期バイトとは
///////////////////////////////// */
#about{
	padding: 40px 20px 40px 20px;
	margin: -20px 0 0 0;
	background: url(../img/about_bg.png) no-repeat center center;
	background-size: cover;
	color: #fff;
}
#about section{
	width: 100%;
	padding: 10px;
	box-sizing: border-box;
	border:3px solid #fff;
	border-radius: 10px;
	font-size: 12px;
	letter-spacing: 0.1em;
	line-height: 1.3;
	margin: 0 0 10px 0;
}
#about section:last-child{
	margin: 0;
}
#about section h3{
	font-size: 14px;
	text-align: center;
	margin: 0 0 10px 0;
}
/* ////////////////////////////////// */


/* /////////////////////////////////
タイプ別短期バイト
///////////////////////////////// */
#type{
	padding: 40px 20px 40px 20px;
	margin: -20px 0 0 0;
}
#type section{
	width: 100%;
	margin: 0 0 20px 0;
	text-align: center;
}
#type section:last-child{
	margin: 0;
}
#type section h3{
	text-align: center;
	font-size: 16px;
	font-weight: lighter;
	color: #fff;
	padding: 10px 0 5px 0;
	border-radius: 10px;
	margin: 0 0 15px 0;
}
#type section article{
	width: 1000px;
	height: 15em;
	display: table-cell;
	vertical-align: middle;
	color: #fff;
}
#type section article span{
	width: 80%;
	display: block;
	text-align: right;
	font-size: 14px;
}
#type section dl dt{
	padding: 10px 0;
	text-align: center;
	font-size: 21px;
	font-weight: lighter;
	color: #000;
}
#type section dl dd{
	text-align: left;
	font-weight: lighter;
	color: #000;
	margin: 0 0 15px 0;
	font-size: 18px;
}
#type section dl dd h4{
	border: 1px solid #000;
	padding: 3px 3px 3px 5px;
	box-sizing: border-box;
	font-size: 14px;
	border-radius: 50px;
	font-weight: normal;
	margin: 10px 0 5px 0;
}
#type section dl dd em{
	font-style: normal;
	font-weight: bold;
}
#type section dl dd h4.monthly{
	border: none;
	color: #fff;
	background: #000;
	padding: 3px 0;
	box-sizing: border-box;
	font-size: 14px;
	border-radius: 50px;
	font-weight: normal;
	margin: 10px 0 5px 0;
	text-align: center;
}
#type section dl dd em.pay{
	font-style: normal;
	font-weight: bold;
	font-size: 40px;
	font-family: 'Montserrat', sans-serif;
}
#type section dl dd p{
	text-align: center;
}
.type01{
	color: #FF5E62;
}
.type01 h3{
	background: #ff9966;  /* fallback for old browsers */
	background: -webkit-linear-gradient(to right, #ff5e62, #ff9966);  /* Chrome 10-25, Safari 5.1-6 */
	background: linear-gradient(to right, #ff5e62, #ff9966); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
}
.type01 article{
	background: url(../img/type_bg01.png) no-repeat center center;
	background-size: contain;
}
.type02{
	color: #7F94D6;
}
.type02 h3{
	background: #74ebd5;  /* fallback for old browsers */
	background: -webkit-linear-gradient(to right, #ACB6E5, #74ebd5);  /* Chrome 10-25, Safari 5.1-6 */
	background: linear-gradient(to right, #ACB6E5, #74ebd5); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
}
.type02 article{
	background: url(../img/type_bg02.png) no-repeat center center;
	background-size: contain;
}
.type03{
	color: #45B649;
}
.type03 h3{
	background: #DCE35B;  /* fallback for old browsers */
	background: -webkit-linear-gradient(to right, #45B649, #DCE35B);  /* Chrome 10-25, Safari 5.1-6 */
	background: linear-gradient(to right, #45B649, #DCE35B); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
}
.type03 article{
	background: url(../img/type_bg03.png) no-repeat center center;
	background-size: contain;
}
/* ////////////////////////////////// */


/* /////////////////////////////////
体験談
///////////////////////////////// */
#interview{
	padding: 80px 20px 40px 20px;
	margin: -20px 0 0 0;
	background: #f2f2f2;
}
#interview section{
	margin: 0 0 20px 0;
}
#interview section article{
	width: 100%;
	letter-spacing: 0.1em;
	line-height: 1.3;
	text-align: justify;
}
#interview section article h3{
	font-weight: normal;
	font-size: 14px;
	margin: 0 0 10px 0;
	text-align: center;
}
#interview section article h3 em{
	font-style: normal;
	font-size: 18px;
	font-weight: bold;
	color: #3BCD7C;
}
#interview section figure{
	width: 100%;
	text-align: center;
	padding: 0 0 10px 0;
}
#interview section figure img{
	width: 50%;
}

/* /////////////////////////////////
せ全体リンク
///////////////////////////////// */
.tanki_all{
	width: 100%;
	padding: 20px;
	box-sizing: border-box;
	font-weight: lighter;
	background: #000;
	position: relative;
	z-index: 100;
}
.tanki_all h2{
	text-align: center;
	color: #fff;
	font-size: 20px;
	font-weight: lighter;
}
.tanki_all dl dd{
	padding: 10px 0 0 0;
}
.tanki_all ul li{
	width: 100%;
	margin: 0 0 10px 0;
}
.tanki_all ul li:last-child{
	margin: 0;
}
.tanki_all ul li a{
	display: block;
	padding: 15px 0;
	text-align: center;
	color: #000;
	background: #fff;
	border-radius: 5px;
}
.tanki_all ul li a:hover{
	color: #fff;
	background: #E74C3C;
}

/*        APP       */
#app_recommend, #app_recommend h2{
	margin:0 0 20px 0;
}
#app_recommend ul{
	padding:0 10px;
	box-sizing:border-box;
}
#app_recommend ul li{
	width:48%;
	float:left;
}
#app_recommend ul li:last-child{
	float:right;
}


#area{
	padding: 20px;
	background: #fff;
}
#area dl{
	width: 48%;
	border-radius: 5px;
	float: left;
	padding: 5px;
	box-sizing: border-box;
	margin: 0 1% 2% 1%;
}
#area dl:nth-child(2n+1){
	clear:both;
}
#area dl dt{
	font-size: 18px;
	padding: 10px 0;
	text-align: center;
	color: #42210B;
}
#area dl dd{
	display: none;
}
#area dl dd ul li{
	width: 100%;
	margin: 0 0 2% 0;
}
#area dl dd ul li a{
	display: block;
	color: #42210B;
	border-radius: 5px;
	background: url(../img/arrow.png) no-repeat 98% center #fff;
	font-size: 14px;
	text-align: center;
	padding: 10px 0;
}

.whitedayAreattl .title{
	text-align: center;
	font-size: 16px;
	padding:15px 0;
	font-weight: lighter;
}

#area dl:last-child{
	display: none;
}


/* /////////////////////////////////
お仕事情報
///////////////////////////////// */

#JobInfo:before {
    background: url(../img/area_bg.png) no-repeat;
    background-size: contain;
    content: "";
    display: block;
    position: relative;
    z-index: 1;
    margin-left: -1%;
    width: 100%;
    height: 70px;
    margin-bottom: -13%;
}


#JobInfo {
	padding: 40px 20px 20px;
    margin: 0 auto;
    width: 100%;
}

#JobInfo h2{
    width: 100%;
	font-size: 22px;
	font-weight: lighter;
	padding: 80px 0 50px 0;
	background: url(../img/JobInfo.png) no-repeat center top;
	background-size: auto 60px;
    text-align: center;
}

.JobInfoBlock1 {
    text-align: center;
    width: 100%;
    background-position: left bottom;
    padding-bottom: 15px;
}

.JobInfoBlock2 {
    text-align: center;
    width: 100%;
    background-position: left bottom;
    padding-bottom: 15px;
}

.JobInfoBlockTitle span {
    position: relative;
    width: 100%;
}


.JobInfoBlockTxt {
    display: block;
    width: 100%;
    padding: 25px 0px;
    text-align: left;
    font-size: 14px;
    letter-spacing: 0.2em;
	line-height: 1.3;
}

.JobInfoBlockInner h3 {
    width: 100%;
    background: url(../img/line.png) no-repeat center top;
	background-position: 30% 95%;
    padding-bottom: 20px;
    font-size: 18px;
    font-weight: 400;
    text-align: center;
}

#JobInfo:after {
    background: url(../img/JobInfo_bg.png);
	background-size: cover;
}

#JobInfo:after {
    content: "";
    display: block;
    position: relative;
    z-index: 1;
    margin-left: -5%;
    width: 100%;
    height: 68px;
    margin-bottom: -42%;
}



/* /////////////////////////////////
Q＆A
///////////////////////////////// */


#qa {
	background-color: #fff;
	padding: 80px 0 200px;
    margin: 0 auto;
}

#qa h2{
	font-size: 22px;
	font-weight: lighter;
	padding: 80px 0 50px 0;
	background: url(../img/qa.png) no-repeat center top;
	background-size: auto 60px;
	margin: 0 0 5px 0;
    text-align: center;
}

#qa dl{
	margin: 0 0 20px 0;
	height: 290px;
}
#qa dl:last-child{
	margin: 0;
}

#qa dl dt{
	background:url(../img/q.png) no-repeat;
    background-position: 5% 50%;
	background-color: #98D2D6;
	padding: 15px 15px 15px 70px;
	font-size: 18px;
	font-weight: bold;
    color: #fff;
}

#qa dl dd{
	color: #000;
	padding: 15px 10px 15px 70px;
	background:url(../img/a.png) no-repeat;
    background-position: 5% 20px;
    font-size: 14px;
    letter-spacing: 0.2em;
	line-height: 1.3;
}

.QaNewline {
    margin-bottom: 2em;
}

#whiteday:after {
    background: url(../img/bg.png);
	background-size: cover;
}

#whiteday:after {
    content: "";
    display: block;
    position: relative;
    z-index: 1;
    left: 45%;
    margin-left: -45%;
    width: 100%;
    height: 150px;
}