@charset "utf-8";

/* /_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_
全デバイス共通のスタイルとスマートフォンおよび小型タブレット向けレイアウトの指定
/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_*/

/*==================================================
stage
====================================================*/

#stage{
	margin-top: 100px;
	border-top: solid 3px #2b319b;
}

#stage section #stagein{
	margin: 15px;
}

#stage section h1{
	border-bottom: solid 1px #2b319b;
}

#stage section h1 img{
	width: 100%;
	max-width: 770px;
}

#stage section#company h1{
	background: url("../img/h2_bg_company_3.png") right top no-repeat;
	background-size: cover;
}

#stage section#recruit h1{
	background: url(../img/h2_bg_recruit.png) right top no-repeat;
	background-size: cover;
}

#stage section#contact h1{
	background: url(../img/h2_bg_contact.png) right top no-repeat;
	background-size: cover;
}

#stage section#policy h1{
	background: url(../img/h2_bg_policy.png) right top no-repeat;
	background-size: cover;
}

#stage section#news h1{
	background: url(../img/h2_bg_news.png) right top no-repeat;
	background-size: cover;
}

#stage section#service h1{
	background: url(../img/h2_bg_service.png) right top no-repeat;
	background-size: cover;
}

#stage section #subcont{
	display: none;
}

#stage section #contents h2{
	background-color: #efefef;
	border-bottom: solid 2px #2b319b;
	padding: 10px;
}

#stage section article{
	margin-bottom: 60px;
	line-height: 1.5;
}

#stage section article .contin{
	margin: 15px;
}

/*==================================================
company
====================================================*/

#company article#greeting p.pho img{
	width: 100%;
	max-width: 770px;
}

#company article#greeting #greetingin p{
	margin-top: 15px;
}

#company article#greeting #greetingin p.name{
	text-align: right;
}

#company article#rinen dl{
	margin: 15px 15px 0 15px;
}

#company article#rinen dl dt{
	font-size: 26px;
	font-weight: bold;
}

#company article#rinen dl dt.green{
	color: #17bf47;
	border-bottom: solid 2px #17bf47;
}

#company article#rinen dl dt.orange{
	color: #ff7e00;
	border-bottom: solid 2px #ff7e00;
}

#company article#rinen dl dt.blue{
	color: #3466d7;
	border-bottom: solid 2px #3466d7;
}

#company article#outline dl{
	border: solid 1px #2b319b;
	margin-bottom: 15px;
}

#company article#outline dl dt{
	border-bottom: dotted 1px #cccccc;
	padding: 5px;
}

#company article#outline dl dd{
	padding: 5px;
}

#company article#outline dl dd ul li{
	margin-left: 25px;
}

#company article#outline ul#sitenimg{
	margin: 15px;
}

#company article#outline ul#sitenimg li{
	list-style-type: none;
	text-align: center;
}

#company article#outline ul#sitenimg li img{
	width: 100%;
	max-width: 512px;
}

#company article#outline dl dd table th{
	background-color: #efefef;
	padding: 5px;
	border-bottom: solid 2px #ffffff;
}

#company article#outline dl dd table td{
	padding: 5px;
}

#company article#history dl{
	border: solid 1px #2b319b;
	margin-bottom: 15px;
}

#company article#history dl dt{
	border-bottom: dotted 1px #cccccc;
	padding: 5px;
}

#company article#history dl dd{
	padding: 5px;
}

#company article#access #map{
	margin-top: 15px;
	margin-bottom: 45px;
}

#company article#access #map iframe{
	width: 100%;
}


/*==================================================
recruit
====================================================*/

#recruit article#staff dl{
	border: solid 1px #2b319b;
	margin-bottom: 15px;
}

#recruit article#staff dl dt{
	border-bottom: dotted 1px #cccccc;
	padding: 5px;
}

#recruit article#staff dl dd{
	padding: 5px;
}

#recruit article#voice .voicelist{
	margin: 15px 0 45px 0;
	border: dotted 1px #cccccc;
	padding: 15px;
}

#recruit article#voice .voicelist h3{
	color: #2b319b;
	margin-bottom: 15px;
}

#recruit article#voice .voicelist p.pho{
	text-align: center;
}

#recruit article#voice .voicelist p.pho img{
	width: 100%;
	max-width: 140px;
}

#recruit article#voice .voicelist .txt p{
	margin-top: 15px;
}

/*==================================================
contact
====================================================*/

#contact .contactinfo{
	line-height: 1.5;
	margin-bottom: 15px;
}

#contact article.telfax p{
	margin-bottom: 15px;
}

#contact article.telfax p .telnum{
	font-weight: bold;
	color: #2b319b;
	font-size: 22px;
}

#contact article.formbx form{
	margin-top: 15px;
}

#contact article.formbx dl{
	border: solid 1px #2b319b;
	margin-bottom: 15px;
}

#contact article.formbx dl dt{
	border-bottom: dotted 1px #cccccc;
	padding: 5px;
}

#contact article.formbx dl dd{
	padding: 5px;
}

#contact article.formbx dl dd input.txbx{
	width: 96%;
}

#contact article.formbx dl dd textarea{
	width: 96%;
}

#contact article.formbx .sumtbut{
	text-align: center;
}

/*==================================================
policy
====================================================*/

#policy article p{
	margin-bottom: 15px;
}

#policy article ol li{
	margin-left: 25px;
	margin-bottom: 15px;
}

#policy article h3{
	margin-bottom: 15px;
}

#policy article ul li{
	margin-left: 25px;
	margin-bottom: 15px;
}

#policy article p.name{
	text-align: right;
}

/*==================================================
news
====================================================*/
#news article.newslist{
	border: dotted 1px #cccccc;
	padding: 15px;
	margin-bottom: 15px;
}

#news article.newslist h3{
	border-bottom: solid 1px #2b319b;
	margin-bottom: 15px;
}

#news article.newslist div p{
	margin-bottom: 15px;
}

#news article.newslist div p:last-child{
	margin-bottom: 0;
}

#news article.newslist div p img{
	max-width: 100%;
}

/*more*/
.url {
  word-break: break-all;
}


/*==================================================
service
====================================================*/

#service article .serbx{
	margin-bottom: 60px;
}

#service article .serbx h3{
	margin-bottom: 15px;
}

#service article .serbx p.pho img{
	width: 100%;
	max-width: 770px;
}

#service article .serbx ul li{
	margin-left: 25px;
}


/* /_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_
メディアクエリによる切り替え
/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_*/

/* PC向けおよび大型タブレット向けのレイアウトの指定：769px～960px */
@media only screen and (min-width: 769px){
	
	/* stage */
	
	#stage section #subcont{
		display: block;
		width: 20%;
		float: left;
	}
	
	#stage section #contents{
		width: 78.5%;
		float: right;
	}
	
	#stage section #subcont nav ul li{
		list-style-type: none;
		border-top: solid 1px #2b319b;
		border-left: solid 1px #2b319b;
		border-right: solid 1px #2b319b;
		text-align: center;
		background: #ffffff; /* Old browsers */
		background: -moz-linear-gradient(top, #cccccc 0%, #ffffff 5%, #ffffff 95%, #cccccc 100%); /* FF3.6-15 */
		background: -webkit-linear-gradient(top, #cccccc 0%,#ffffff 5%,#ffffff 95%,#cccccc 100%); /* Chrome10-25,Safari5.1-6 */
		background: linear-gradient(to bottom, #cccccc 0%,#ffffff 5%,#ffffff 95%,#cccccc 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cccccc', endColorstr='#cccccc',GradientType=0 ); /* IE6-9 */
	}
	
	#stage section #subcont nav ul li:last-child{
		border-bottom: solid 1px #2b319b;
	}
	
	#stage section #subcont nav ul li a{
		display: block;
		width: 100%;
		text-decoration: none;
		background: url(../img/marker01.png) 6px 6px no-repeat;
	}
	
	#stage section #subcont nav ul li a span{
		display: block;
		padding: 15px;
	}
	
	/* company */
	#company article#greeting p.pho{
		width: 30%;
		float: left;
	}
	
	#company article#greeting #greetingin{
		width: 67%;
		float: right;
	}
	
	#company article#rinen dl dd{
		margin-left: 30px;
	}
	
	#company article#outline dl{
		margin-bottom: 0;
		border-bottom: none;
	}
	
	#company article#outline dl:last-child{
		border-bottom: solid 1px #2b319b;
	}
	
	#company article#outline dl dt{
		width: 30%;
		float: left;
		border-bottom: none;
		text-align: center;
	}
	
	#company article#outline dl dd{
		width: 65%;
		float: right;
		border-left: dotted 1px #cccccc;
	}
	
	#company article#outline ul#sitenimg li{
		width: 32%;
		float: left;
		margin-right: 1.5%;
	}
	
	#company article#outline ul#sitenimg li:last-child{
		margin-right: 0;
	}
	
	#company article#history dl{
		margin-bottom: 0;
		border-bottom: none;
	}
	
	#company article#history dl:last-child{
		border-bottom: solid 1px #2b319b;
	}
	
	#company article#history dl dt{
		width: 30%;
		float: left;
		border-bottom: none;
		text-align: center;
	}
	
	#company article#history dl dd{
		width: 65%;
		float: right;
		border-left: dotted 1px #cccccc;
	}
	
	/* recruit */
	
	#recruit article#staff dl{
		margin-bottom: 0;
		border-bottom: none;
	}
	
	#recruit article#staff dl:last-child{
		border-bottom: solid 1px #2b319b;
	}
	
	#recruit article#staff dl dt{
		width: 30%;
		float: left;
		border-bottom: none;
		text-align: center;
	}
	
	#recruit article#staff dl dd{
		width: 65%;
		float: right;
		border-left: dotted 1px #cccccc;
	}
	
	#recruit article#voice .voicelist p.pho{
		width: 30%;
		float: left;
	}
	
	#recruit article#voice .voicelist .txt{
		width: 67%;
		float: right;
	}
	
	#recruit article#voice .voicelist .txt p{
		margin-top: 0;
		margin-bottom: 15px;
	}
	
	/* contact */
	#contact article.telfax p{
		text-align: center;
	}
	
	#contact article.formbx dl{
		margin-bottom: 0;
		border-bottom: none;
	}
	
	#contact article.formbx dl.last{
		border-bottom: solid 1px #2b319b;
		margin-bottom: 15px;
	}
	
	#contact article.formbx dl dt{
		width: 40%;
		float: left;
		border-bottom: none;
		text-align: center;
	}
	
	#contact article.formbx dl dd{
		width: 55%;
		float: right;
		border-left: dotted 1px #cccccc;
	}
	
	/* service */
	
	#service article #service1 .serbx p.pho{
		width: 50%;
		float: left;
	}
	
	
	
}

/* PC向けレイアウトの指定：1321px以上では固定レイアウト */
@media only screen and (min-width: 1321px){
	
	/* stage */
	#stage section #stagein{
		width: 1280px;
		margin: 15px auto 0 auto;
	}
	
	/* service */
	#service article #service1 .serbx{
		width: 47%;
		float: left;
		margin-right: 2%;
	}
	
	
}