@charset "UTF-8";

/*============================================================
style.css
============================================================*/
/* css outline
TOP

============================================================*/


/* TOP
--------------------------------------*/
#container{
}
#contents{
}
#gridContent {
	height: 0;
	padding: 0;
	overflow: visible !important;
}
#gridContent .gridBox {
	opacity: 0;
	-moz-opacity:0;
	-khtml-opacity: 0;
	width: 222px;
	height: 230px;
	background: #ffffff;
	color: #ffffff;
	margin: 0 15px 15px 0;
	padding: 0;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
}
#gridContent .gridBox a{
	display: block;
	color: #ffffff;
}
#gridContent .gridBox a:hover{
	text-decoration: none;
	opacity:0.7;
	-moz-opacity:0.7;
	-khtml-opacity: 0.7;
	transition: opacity .25s ease-in-out;
	-moz-transition: opacity .25s ease-in-out;
	-webkit-transition: opacity .25s ease-in-out;
}
	#gridContent .gridBox .pic{
		background: #ffffff;
		-webkit-border-radius: 3px 3px 0 0;
		-moz-border-radius: 3px 3px 0 0;
		border-radius: 3px 3px 0 0;
		overflow: hidden;
	}

	#gridContent .gridBox h2{
		padding: 0 0 8px 0;
		margin: 0;
		font-size: 120%;
		line-height: 1em;
		color: #ffffff;
	}
	#gridContent .gridBox p{
		overflow: hidden;
		padding: 0;
		margin: 0;
		font-size: 80%;
	}

	/* size */
	#gridContent .lerge {
		width: 696px;
		height: 475px;
	}
	#gridContent .medium {
		width: 459px;
		height: 230px;
	}
	#gridContent .small {
		width: 222px;
		height: 230px;
	}

	/* category */
	.gridText{
		-webkit-border-radius: 0 0 3px 3px;
		-moz-border-radius: 0 0 3px 3px;
		border-radius: 0 0 3px 3px;
		height: 56px;
		padding: 12px;
		overflow: hidden;
		background: #f553a9;
	}
	#gridContent .recruitBox .gridText{
		background: #3faeff;
	}
	#gridContent .brandBox .gridText{
		background: #b182c4;
	}
	#gridContent .newsBox .gridText{
		background: #33af98;
	}
	#gridContent .aboutBox .gridText{
		background: #f553a9;
	}
	#gridContent .entryBox .gridText{
		background: #ff6c26;
	}


	/* new icon */
	#gridContent .gridBox .newIcon {
		opacity: 0;
		-moz-opacity:0;
		-khtml-opacity: 0;
		position: absolute;
		z-index: 1000;
		top:-13px;
		right: -12px;
		width: 67px;
		height: 67px;
		background:url(../img/sprite.png) -100px 0 no-repeat;
		text-indent: 100%;
		white-space: nowrap;
		overflow: hidden;
	}
	/* category tag */
	#gridContent .gridBox .recruitTag {
		opacity:0;
		-moz-opacity:0;
		-khtml-opacity: 0;
		position: absolute;
		top:10px;
		left: -5px;
		width: 66px;
		height: 22px;
		background:url(../img/sprite.png) 0 0 no-repeat;
		text-indent: 100%;
		white-space: nowrap;
		overflow: hidden;
	}
	#gridContent .gridBox .brandTag {
		opacity:0;
		-moz-opacity:0;
		-khtml-opacity: 0;
		position: absolute;
		top:10px;
		left: -5px;
		width: 66px;
		height: 22px;
		background:url(../img/sprite.png) 0 -60px no-repeat;
		text-indent: 100%;
		white-space: nowrap;
		overflow: hidden;
	}
	#gridContent .gridBox .newsTag {
		opacity:0;
		-moz-opacity:0;
		-khtml-opacity: 0;
		position: absolute;
		top:10px;
		left: -5px;
		width: 66px;
		height: 22px;
		background:url(../img/sprite.png) 0 -30px no-repeat;
		text-indent: 100%;
		white-space: nowrap;
		overflow: hidden;
	}
	#gridContent .gridBox .aboutTag {
		opacity:0;
		-moz-opacity:0;
		-khtml-opacity: 0;
		position: absolute;
		top:10px;
		left: -5px;
		width: 66px;
		height: 22px;
		background:url(../img/sprite.png) 0 -90px no-repeat;
		text-indent: 100%;
		white-space: nowrap;
		overflow: hidden;
	}
	#gridContent .gridBox .entryTag {
		opacity:0;
		-moz-opacity:0;
		-khtml-opacity: 0;
		position: absolute;
		top:10px;
		left: -5px;
		width: 66px;
		height: 22px;
		background:url(../img/sprite.png) 0 -120px no-repeat;
		text-indent: 100%;
		white-space: nowrap;
		overflow: hidden;
	}




/* under main column
--------------------------------------*/
#leftColumn{
}
	#leftColumn h1{
		margin: 0;
	}
	#leftColumn a{
		text-decoration: underline;
	}
	#leftColumn a:hover{
		text-decoration: none;
	}

	#leftColumn #contentBlock{
		width: 600px;
		background: #ffffff;
		padding: 30px 40px 0 40px;
		border-radius: 0 0 4px 4px;
	}
	#leftColumn #contentBlock tbody th,
	#leftColumn #contentBlock thead th{
		background: url(../img/bg_gray.png) 0 0 repeat;
	}


	.form th{
		padding: 20px;
		font-size: 0.9em;
		width: 25%;
	}
	.form td{
		padding: 10px;
		font-size: 0.9em;
	}
	.required{
		color: #f357a8;
	}
	.notice{
		color: #999999;
	}
	.error{
		color: red;
	}

	.form .name{
		width: 120px;
		margin: 0 0 0 5px;
	}
	.form label{
		display: inline-block;
		width: 32%;
	}
	.form label input{
		margin: 0 5px 0 0;
	}
	.form .inputS{
		width: 150px;
	}
	.form .inputM{
		width: 250px;
	}
	.form .inputL{
		width: 100%;
	}


	#btnArea{
		text-align: center;
		padding: 0 0 10px 0;
	}
	#btnArea input{
		display: inline-block;
		text-align: center;
		border: none;
		background: none;
		text-indent: -99999px;
		white-space: nowrap;
		overflow: hidden;
	}
	#btnArea input#submit{
		width: 193px;
		height: 43px;
		background: url(../img/sprite.png) 0 -150px no-repeat;
	}
	#btnArea input#submit:hover{
		background: url(../img/sprite.png) 0 -200px no-repeat;
	}

	#btnArea input#confirm{
		width: 193px;
		height: 43px;
		background: url(../img/sprite.png) 0 -250px no-repeat;
	}
	#btnArea input#confirm:hover{
		background: url(../img/sprite.png) 0 -300px no-repeat;
	}

	#btnArea input#outgoing{
		width: 193px;
		height: 43px;
		background: url(../img/sprite.png) 0 -450px no-repeat;
	}
	#btnArea input#outgoing:hover{
		background: url(../img/sprite.png) 0 -500px no-repeat;
	}

em{
	color: #f357a8;
	font-style:normal;
}

a.hover{
	display: block;
	color: #ffffff;
}
a.hover:hover{
	text-decoration: none;
	opacity:0.7;
	-moz-opacity:0.7;
	-khtml-opacity: 0.7;
	transition: opacity .25s ease-in-out;
	-moz-transition: opacity .25s ease-in-out;
	-webkit-transition: opacity .25s ease-in-out;
}




/* under side column
--------------------------------------*/
#rightColumn{
}
	#recruitList{
		padding: 8px 0;
		margin: 0 0 15px 0;
		background: #ffffff;
		border: #b7e0ff 4px solid;
		border-radius: 4px;
	}
	#newsList{
		padding: 8px 0;
		background: #ffffff;
		border: #acdfd6 4px solid;
		border-radius: 4px;
	}
	#recruitList h2,
	#newsList h2{
		position: relative;
		left: -10px;
	}
	#recruitList ul,
	#newsList ul{
		padding: 0 10px 0 15px;
		margin: 0 0 10px 0;
	}
	#recruitList li,
	#newsList li{
		padding: 0;
		margin: 0 0 10px 0;
		list-style: none;
		border-bottom: #cccccc 1px dotted;
		font-size: 0.9em;
	}
	#recruitList li a,
	#newsList li a{
		text-decoration: underline;
	}
	#recruitList li a:hover,
	#newsList li a:hover{
		text-decoration: none;
	}

	#recruitList li h3{
		font-size: 1em;
		margin: 0;
		padding: 0;
		color: #46afff;
	}
	#recruitList li a h3{
		color: #46afff;
		text-decoration: underline;
	}
	#recruitList li a:hover h3{
		color: #46afff;
		text-decoration: none;
	}
	#newsList li h3{
		font-size: 1em;
		margin: 0;
		padding: 0;
		color: #33af98;
	}
	#newsList li a h3{
		color: #33af98;
		text-decoration: underline;
	}
	#newsList li a:hover h3{
		color: #33af98;
		text-decoration: none;
	}
	#newsList li .date{
		padding: 0;
		color: #33af98;
	}
	#recruitList li p,
	#newsList li p{
		font-size: 0.9em;
	}


	#recruitList .moreRead,
	#newsList .moreRead{
		text-align: right;
		padding: 0 10px 0 15px;
	}
	#recruitList .moreRead a{
		display: inline-block;
		width: 81px;
		height: 19px;
		background:url(../img/btn_side_recruit.png) 0 0 no-repeat;
		text-indent: 100%;
		white-space: nowrap;
		overflow: hidden;
	}
	#newsList .moreRead a{
		display: inline-block;
		width: 81px;
		height: 19px;
		background:url(../img/btn_side_news.png) 0 0 no-repeat;
		text-indent: 100%;
		white-space: nowrap;
		overflow: hidden;
	}
	#recruitList .moreRead a:hover{
		background:url(../img/btn_side_recruit.png) 0 -19px no-repeat;
	}
	#newsList .moreRead a:hover{
		background:url(../img/btn_side_news.png) 0 -19px no-repeat;
	}




/* news detail
--------------------------------------*/
.news #contentBlock{
	background: #ffffff;
	padding: 30px 40px 0 40px;
	border-radius: 0 0 4px 4px;
}
	.news #contentBlock .date{
		display: inline-block;
		padding: 1px 10px;
		margin:0 0 10px 0;
		background: #33af98;
		color: #ffffff;
		border-radius: 4px;
		font-size:90%;
	}
	.news #contentBlock h2{
		color: #33af98;
		font-size: 1.4em;
	}
	.news #photo{
		margin:0 0 30px 0;
		text-align: center;
	}
	.news #postBody{
		margin:0 0 30px 0;
	}
	.news #postBody h3{
		padding: 10px 0 5px 0;
		border-bottom: #33af98 1px dotted;
		color: #33af98;
		font-size: 1.2em;
	}
	.news #postBody h4{
		padding: 0 0 0 10px;
		margin:0 0 10px 0;
		border-left: #33af98 5px solid;
		font-size: 1em;
	}
	.news #postBody p{
		padding: 0;
		margin:0 0 10px 0;
	}
	.news #postBody table,
	.news #postBody ul,
	.news #postBody ol{
		margin:0 0 20px 0;
	}
	.news #postBody li{
		padding:5px;
	}

	#socialArea{
		background: url(../img/bg_gray.png) 0 0 repeat;
		padding: 15px 15px 10px 15px;
		margin:0 0 30px 0;
	}
	#socialArea .sns{
		display: inline-block;
		padding: 0 5px 0 0;
		vertical-align: top;
	}
	#socialArea .sns #line{
		height: 20px;
	}



/* brand detail
--------------------------------------*/
.brand #brandData{
	border-bottom: #ebebeb 1px solid;
	padding: 0 0 30px 0;
	margin: 0 0 30px 0;
}
.brand #photo{
	float: right;
	width: 285px;
}
	.brand #photo #mainPhoto{
		margin: 0 0 10px 0;
		border: #ccc 1px solid;
		background: url(../img/loader.gif) 50% 50% no-repeat;
	}
	.brand #photo ul{
		padding: 0;
		margin: 0;
		text-align: right;
		letter-spacing:-0.37em;
	}
	.brand #photo ul li{
		letter-spacing: normal;
		display: inline-block;
		width: 50px;
		height: 50px;
		overflow: hidden;
		margin: 0 0 0 10px;
		border: #ccc 1px solid;
	}
	.brand #photo ul li a{
		cursor: pointer;
	}
	.brand #photo ul li img{
		height: 50px;
	}

.brand #brandText{
	float: left;
	width: 290px;
}
	.brand #brandText p{
		padding: 0 0 10px 0;
		font-size: 0.9em;
	}

.brand .linkBtn{
	text-align: center;
	color: #999999;
}
	.brand .linkBtn a{
		display: inline-block;
		width: 81px;
		height: 21px;
		background:url(../img/btn_brand_recruit.png) 0 0 no-repeat;
		text-indent: 100%;
		white-space: nowrap;
		overflow: hidden;
	}
	.brand .linkBtn a:hover{
		background:url(../img/btn_brand_recruit.png) 0 -21px no-repeat;
	}


/* recruit detail
--------------------------------------*/
.recruit #contentBlock h2{
	margin: 0;
	color: #399fed;
	font-size: 1.4em;
}
.recruit #recruitNum{
	padding: 0;
	margin: 0 0 10px 0;
	text-align: right;
}
.recruit #recruitMain{
	border-bottom: #ebebeb 1px solid;
	padding: 0 0 30px 0;
	margin: 0 0 30px 0;
}
.recruit #photo{
	float: right;
	width: 285px;
}
	.recruit #photo #mainPhoto{
		margin: 0 0 10px 0;
		border: #ccc 1px solid;
		background: url(../img/loader.gif) 50% 50% no-repeat;
		min-height: 70px;
	}
	.recruit #photo ul{
		padding: 0;
		margin: 0;
		text-align: right;
		letter-spacing:-0.37em;
	}
	.recruit #photo ul li{
		letter-spacing: normal;
		display: inline-block;
		width: 50px;
		height: 50px;
		overflow: hidden;
		margin: 0 0 0 10px;
		border: #ccc 1px solid;
	}
	.recruit #photo ul li a{
		cursor: pointer;
	}
	.recruit #photo ul li img{
		height: 50px;
	}

.recruit #recruitData{
	float: left;
	width: 290px;
}
	.recruit #recruitData th{
		padding: 15px;
		text-align: center;
		font-size:0.9em;
		width: 40%;
	}
	.recruit #recruitData td{
		padding: 15px 5px 15px 15px;
		font-size:0.9em;
	}
	.recruit #recruitData td span{
		display: inline-block;
		background: #f453a9;
		width: 16px;
		height: 16px;
		color: #fff;
		text-align: center;
		margin: 0 5px 0 0;
	}
	.recruit p#recruitText{
		margin: 20px 0 40px 0;
		padding: 0;
	}

	.recruit #recruitPickup{
		position: relative;
		padding: 30px;
		background:url(../img/bg_pink.png) 0 0 repeat;
		-webkit-border-radius: 8px;
		-moz-border-radius: 8px;
		border-radius: 8px;
	}
	.recruit #recruitPickup h3{
		position: absolute;
		top: -15px;
		left: 20px;
	}
	.recruit #recruitPickup h4{
		color: #f357a8;
	}
	.recruit #recruitPickup #pickupPhoto{
		float: left;
		margin: 0 20px 0 0;
	}
	.recruit #recruitPickup p{
		padding: 0;
	}

	.recruit #leftColumn #contentBlock .lineTable th{
		background:url(../img/bg_blue.png) 0 0 repeat;
		width: 140px;
		border-right:none;
		text-align: center;
	}
	.recruit #leftColumn #contentBlock .lineTable td{
		border-left:none;
	}
	.recruit #entryBtn{
		padding: 0 0 40px 0;
	}
	.recruit #entryBtn a{
		display: block;
		width: 233px;
		height: 48px;
		margin: 0 auto;
		background:url(../img/btn_entry.png) 0 0 no-repeat;
		text-indent: 100%;
		white-space: nowrap;
		overflow: hidden;
	}
	.recruit #entryBtn a:hover{
		background:url(../img/btn_entry.png) 0 -48px no-repeat;
	}



/* entry
--------------------------------------*/
.entry #leftColumn #contentBlock{
	padding: 10px 40px 0 40px;
}
#entryForm{
	padding: 20px;
	margin: 10px 0 30px 0;
	border: #ebebeb 5px solid;
}
	#entryForm h2{
		color: #ff6e29;
		font-size: 1.3em;
		margin: 0 0 5px 0;
	}
	#entryForm #recruitNum{
		text-align: right;
		padding: 0 0 10px 0;
	}


/*モーダル用*/

#fancybox-content #header,
#fancybox-content #footer,
#fancybox-content #breadCrumbs,
#fancybox-content #rightColumn,
#fancybox-content #leftColumn header,
#fancybox-content #leftColumn #contentBlock h2,
#fancybox-content #leftColumn #contentBlock .jobBox,
#fancybox-content #leftColumn #contentBlock #backTop{
	display: none;
}
#fancybox-content #container,
#fancybox-content #underContents{
	width: 680px;
	height: 430px;
	overflow: hidden;
}
#fancybox-content #leftColumn #contentBlock h2#flow,
#fancybox-content #leftColumn #contentBlock h2#flow+.jobBox{
	display: block;
}



#entryComp{
	padding: 40px;
	margin: 0 0 30px 0;
	border: #ebebeb 5px solid;
}
	#entryComp h2{
		padding: 0 0 20px 0;
		margin: 0 0 20px 0;
		border-bottom: #ccc 1px dotted;
		text-align: center;
	}
	#entryComp p{
		margin: 0 0 20px 0;
		text-align: center;
	}
	#entryComp a{
		display: block;
		width: 190px;
		height: 40px;
		margin: 0 auto;
		background:url(../img/btn_toppage.png) 0 0 no-repeat;
		text-indent: 100%;
		white-space: nowrap;
		overflow: hidden;
	}
	#entryComp a:hover{
		background:url(../img/btn_toppage.png) 0 -40px no-repeat;
	}


/* contact
--------------------------------------*/
.contact #leftColumn #contentBlock{
	padding: 10px 40px 0 40px;
}

#contactForm{
	padding: 20px;
	margin: 10px 0 30px 0;
	border: #ebebeb 5px solid;
}
	#contactForm label{
		width: auto;
		padding: 0 20px 0 0;
	}


#contactComp{
	padding: 40px;
	margin: 20px 0 30px 0;
	border: #ebebeb 5px solid;
}
	#contactComp h2{
		padding: 0 0 20px 0;
		margin: 0 0 20px 0;
		border-bottom: #ccc 1px dotted;
		text-align: center;
	}
	#contactComp p{
		margin: 0 0 20px 0;
		text-align: center;
	}
	#contactComp a{
		display: block;
		width: 190px;
		height: 40px;
		margin: 0 auto;
		background:url(../img/btn_toppage.png) 0 0 no-repeat;
		text-indent: 100%;
		white-space: nowrap;
		overflow: hidden;
	}
	#contactComp a:hover{
		background:url(../img/btn_toppage.png) 0 -40px no-repeat;
	}



/* strength
--------------------------------------*/
.strength h3{
	margin: 0 0 20px 0;
}
.strength .strengthBox{
	margin: 0 0 30px 0;
}

/* job
--------------------------------------*/
.job h3{
	margin: 0 0 20px 0;
}
.job .jobBox{
	margin: 0 0 30px 0;
}
	.job .jobBox p.right{
		width: 290px;
	}
	.job .jobBox .btnArea{
		padding: 20px 0;
	}
	.job .jobBox .btnArea a{
		display: block;
		width: 190px;
		height: 40px;
		margin: 0 auto;
		background:url(../img/btn_brand.png) 0 0 no-repeat;
		text-indent: 100%;
		white-space: nowrap;
		overflow: hidden;
	}
	.job .jobBox .btnArea a:hover{
		background:url(../img/btn_brand.png) 0 -40px no-repeat;
	}


/* outline
--------------------------------------*/
.outline #leftColumn #contentBlock{
	padding: 30px 40px 0 40px;
}
	.outline #leftColumn #contentBlock table{
	    border:none;
	}
		.outline #leftColumn #contentBlock th{
			vertical-align: top;
		}
		.outline #leftColumn #contentBlock th,
		.outline #leftColumn #contentBlock td{
			padding: 15px;
		    border:none;
		    background:#ffffff;
		}
		.outline #leftColumn #contentBlock tr.odd td,
		.outline #leftColumn #contentBlock tr.odd th{
		    border:none;
		    background:#f3f3f3;
		}
		.outline #leftColumn #contentBlock td p{
			padding: 0;
			margin: 0 0 10px 0;
		}


/* privacy
--------------------------------------*/
.privacy h2{
	padding: 10px 0;
	margin:0 0 10px 0;
	border-bottom: #cccccc 1px dotted;
}
.privacyBox{
	padding: 0 0 30px 0;
}
	.privacy ul{
		padding: 0 0 0 25px;
	}
	.privacy li{
		margin:0 0 10px 0;
		line-height: 1.4em;
	}
	.privacy dl{
		margin: 0 0 20px 0;
	}
		.privacy dt{
			margin:0 0 10px 0;
			font-weight: bold;
		}
		.privacy dd{
			display: list-item;
			padding: 0;
			margin: 0 0 5px 25px;
			list-style: disc;
		}

	.privacy p.prefix{
		padding-left:1em;
		text-indent: -1em;
	}

	.privacyBox address{
		font-style: normal;
	}
	.privacyBox address p{
		padding: 0;
		margin: 0;
	}
	.privacyBox address p.copName{
		font-weight: bold;
		color: #f553a8;
	}