@charset "UTF-8";

/*　スマートフォン用
-------------------------------------------------------*/
@media screen and (max-width:640px){
body {
	line-height: 1.8;
	-webkit-text-size-adjust: 100%;
}
.spHide{
	display: none !important;
}

/*▼ヘッダー▼*/
header{
	overflow: hidden;
}
header .header_in{
	display: none;
}
#menu{
	display:none;
}
.slicknav_menu {
	display:block;
	position:fixed;
	width:100%;
	z-index:1;
}
header .header_in_sp h1{
	font-weight: bold;
	max-width: 70%;
	position: fixed;
	z-index: 1;
	padding-top: 0.8em;
	margin-left: 5%;
	text-shadow: 2px 2px #2263c0;
}
	header .header_in_sp h1 a{
		color: #fff;
		text-decoration: none;
	}
	header .header_in_sp h1 a img{
		display: inline-block;
		width: 10%;
		margin-right: 0.3em;
		position: relative;
		top: -0.5em;
	}
/*追随バナー*/
#bnrChase01{
	display: none !important;
}
/*▲ヘッダー▲*/

/*▼フッター▼*/
footer{
	border-top: #367fd9 1px solid;
	margin-top: 5em;
}
footer .footerBnr01{
    padding: 1em 5%;
}
footer .footerBnr01 h2{
    letter-spacing: 1px;
    font-size: 1.250em;
    color: #367fd9;
    text-align:center;
    font-weight: bold;
    margin-bottom: 1em;
}
footer .footerBnr01 ul{
    text-align:center;
}
footer .footerBnr01 li{
	margin-bottom: 1em;
}
footer .footerBnr01 li a:hover img{
    opacity: 0.5;
    filter: alpha(opacity=50);
    -ms-filter: "alpha( opacity=80 )";
}
footer small{
	display:block;
	color:#666;
	font-size:0.938em;
	text-align:center;
	letter-spacing:2px;
	background-color: #ddd;
	padding:1% 0;
}
footer small span{
	margin:0 8px;
	vertical-align:middle;
}
/*▲フッター▲*/

/*コンテンツ▼*/
.profile,
#gaiyo,
#intern,
#greetings,
#company,
#treatment,
#history,
#access,
#top_contact{
	padding-left: 5%;
	padding-right: 5%;
	margin-top: -2em;
	padding-top: 2em;
}
#top_contents section h2{
	display: block;
	font-weight: bold;
	font-size: 1.250em;
	color: #fff;
	background-color: #367fd9;
	text-indent: 0.5em;
	text-shadow: 2px 2px #367fd9;
	border-right: #2263c0 2px solid;
	border-bottom: #2263c0 2px solid;
	padding-top: 5px;
	padding-bottom: 2px;
	margin-top: 2em;
	margin-bottom: 0.5em;
}

/*メインビジュアル*/
.art_business{
	text-align: center;
	/* 画像ファイルの指定 */
	background-image: url(../img/bg1.png); 
	/* 画像を常に天地左右の中央に配置 */
	background-position: center center;
	/* 画像をタイル状に繰り返し表示しない */
	background-repeat: no-repeat;
	/* コンテンツの高さが画像の高さより大きい時、動かないように固定 
	background-attachment: fixed;*/
	/* 表示するコンテナの大きさに基づいて、背景画像を調整 */
	background-size: cover;
	/* 背景画像が読み込まれる前に表示される背景のカラー */
	background-color: #999;
	overflow: hidden;
	padding-top: 5em;
}
.art_business p{
	line-height: 1.5;
	text-shadow: 2px 2px #fff;
}
.art_business .bns3{
	margin-bottom: 0.5em;
}
.art_business .bns3 span{
	display: block;
}
.art_business .bns_top{
	font-weight: bold;
	font-size: 1.250em;
}
.art_business h2{
	font-weight: bold;
	font-size: 1.625em;
	color: #367fd9;
	text-shadow:2px 2px #fff;
	margin-top: 0.2em;
	margin-bottom: 1em;
}

/*What's Art-Technical？*/
.profile p{
	font-size:1em !important;
}
.profile span{
	font-weight: bold;
}

/*事業概要*/
#gaiyo h3{
	font-weight: bold;
	font-size: 1.250em;
	color: #367fd9;
	padding-top: 0.5em;
	padding-bottom: 0.5em;
}
	#gaiyo .art_mechanical h3{
		background:url(../img/mc_icon.png) 0% 50% no-repeat;
		text-indent: 1.8em;
	}
	#gaiyo .art_soft h3{
		background:url(../img/soft_icon.png) 0% 50% no-repeat;
		text-indent: 2.3em;
	}
	#gaiyo .art_app h3{
		background:url(../img/phone_icon.png) 0% 50% no-repeat;
		text-indent: 1.2em;
	}
.art_mechanical,
.art_soft{
	margin-bottom: 2em;
}
.art_mechanical .work_eng,
.art_soft .work_eng{
	font-weight:bold;
	margin-bottom:2%;
}
.art_mechanical p span,
.art_soft p span{
	font-weight:bold;
}
.art_mechanical ul,
.art_soft ul{
	margin-bottom:0.5em;
}
.art_mechanical li,
.art_soft li{
	margin-bottom:1%;
	padding-left:1em;
}
.art_mechanical li,
.art_soft li{
background:url(../../img/porint_b.png) left 0.7em no-repeat;
}
.art_mechanical li span{
color:#367fd9;
font-weight:bold;
}
.art_mechanical img{
	width: 60%;
	margin: 0 auto;
}
.art_soft img{
	width: 36%;
	margin: 0 auto;
}
.art_mechanical a,
.art_soft a{
	display:inline-block;
	width: 100%;
	text-align: center;
	font-weight: bold;
	color:#367fd9;
	text-decoration:none;
	border:solid 1px #367fd9;
	border-radius:3px;
	padding-top:2%;
	padding-bottom:2%;
	margin-top: 1em;
	margin-bottom: 2em;
}
.art_mechanical a:hover,
.art_soft a:hover{
	color:#fff;
	background:#367fd9;
}
.art_app div p{
	font-size:1em !important;
}
.art_app div .app_tearm{
	display:block;
	font-weight:bold;
	margin-top: 1em !important;
	padding-left:1em;
	background:url(../../img/kome.png) left 0.5em no-repeat;
}
.art_app a{
	display:inline-block;
	width: 100%;
	text-align: center;
	font-weight: bold;
	color:#7ab328;
	text-decoration:none;
	border:solid 1px #7ab328;
	border-radius:3px;
	padding-top:2%;
	padding-bottom:2%;
	margin-top: 1em;
	margin-bottom: 2em;
}
.art_app a:hover{
	color:#fff;
	background:#7ab328;
}

/*インターン制度*/
#intern dt{
	font-weight: bold;
	font-size: 1.250em;
	color: #367fd9;
	margin-top: 2em;
}
#intern p{
	margin-top: 2em;
	padding-left: 1em;
	text-indent: -1em;
}

/*ごあいさつ*/
#greetings .onko,
#greetings .syaka{
	padding-bottom: 1em;
}
#greetings .onko img.imgOnko{
	width: 80%;
	margin: 2em auto;
}
#greetings .onko img.imgBoss,
#greetings .syaka img{
	width: 50%;
	margin: 2em auto;
}
#greetings dl{
	overflow:hidden;
	margin:1em 0 0.5em 0;
}
#greetings dt{
	float:left;
	clear:both;
	width:10em;
	font-weight:bold;
}
#greetings dd{
	float:left;
}
.syaka a{
	clear: both;
	display:inline-block;
	color:#fff;
	text-shadow:none;
	text-decoration:none;
	background:#737373;
	padding:8px 22px;
	border-radius:5px;
}
.syaka a:hover{
	background:#aaa;
}

/*会社概要*/
#company img.art_gaikan_sp{
	width: 50%;
	margin: 0 auto 2em auto;
}
.art_company dt{
	font-weight:bold;
}
.art_company dd{
	margin-bottom: 1.5em;
}
#company img.art_graph_sp{
	width: 100%;
	margin: 0 auto;
}

/*福利厚生・待遇・休日*/
.li_treatment02{
	margin-top: 2em;
	margin-bottom: 3em;
}
.treatment_img li{
	text-align: center;
	width: 80%;
	margin-left: auto;
	margin-right: auto;
	padding-bottom: 2em;
}
.treatment_img li img{
	margin-bottom: 0.5em;
}

/*沿革*/
#history table{
	margin:0 auto;
	border-collapse:separate;
	border-spacing:0;
}
#history th{
	width:5em;
	font-weight:normal;
	text-align:left;
	background-color: #eee;
	padding:10px 15px;
	border-right: #fff 5px solid;
	border-bottom: #fff 5px solid;
}
#history td{
	text-align:left;
	line-height:1.6;
	background-color: #eee;
	padding:10px 15px;
	border-bottom: #fff 5px solid;
}

/*アクセス*/
#access .pImg01{
	text-align: center;
	margin-bottom: 2em;
}
#access img{
	width: 50%;
	margin-left: auto;
	margin-right: auto;
}
#access dl{
	margin-bottom: 2em;
}
#access dt{
	font-weight:bold;
	margin-bottom:3%;
}
#access dd p{
	text-align:left;
	margin:3% 0 0 0;
}
#access iframe{
	width: 100%;
	height: 20em;
	margin-bottom: 2em;
}

/*お問い合わせ*/
.form{
	display:inline-block;
	width: 100%;
	text-align: center;
	font-weight: bold;
	color:#666;
	text-decoration:none;
	background:url(../../img/form_bg.png) left top repeat;
	border:solid 1px #d3cfca;
	border-radius:3px;
	padding-top:2%;
	padding-bottom:2%;
	margin-top: 1em;
	margin-bottom: 2em;
}
.form:hover{
	color:#999;
	background:url(../../img/form_bg.png) left -119px repeat;
}
.art_recruit h3{
	font-weight: bold;
	font-size: 1.250em;
	text-align: center;
}
.art_recruit .ulRecruit01{
	text-align:center;
    letter-spacing:-.40em;
    margin:0 auto;
    overflow:hidden;
}
.art_recruit .ulRecruit01 li{
    display:inline-block;
    *display:inline;
    *zoom:1;
    width:47%;
}
.art_recruit .ulRecruit01 li:nth-child(even){
	margin-left: 6%;
}
.art_recruit .ulRecruit01 li a:hover img{
    opacity: 0.5;
    filter: alpha(opacity=50);
    -ms-filter: "alpha( opacity=80 )";
}
/*▲コンテンツ▲*/

/*▼お問い合わせ▼*/
#contact{
	padding-left: 5%;
	padding-right: 5%;
	padding-top: 5em;
}
#contact h1{
	display: block;
	font-weight: bold;
	font-size: 1.250em;
	color: #fff;
	background-color: #367fd9;
	text-indent: 0.5em;
	text-shadow: 2px 2px #2263c0;
	border-right: #2263c0 2px solid;
	border-bottom: #2263c0 2px solid;
	padding-top: 8px;
	padding-bottom: 2px;
	margin-bottom: 1em;
}
#contact table {
	width:100%;
	border-collapse:separate;
	border-spacing:0;
	margin-bottom: 3em;
}
#contact th{
	display: block;
	color:#333;
	font-weight:bold;
	text-align:left;
	vertical-align:top;
	overflow:hidden;
	margin-top: 1.5em;
}
#contact th span{
float:right;
color:#f90;
line-height:1.8;
margin-right: 1em;
}
#contact td {
display: block;
text-align:left;
overflow:hidden;
position:relative;
border-bottom: dashed 2px #e2e2e2;
padding-bottom: 1.5em;
}
.select label{
margin:0 20px 0 5px;
}
#contact td input[type="text"],
#contact td input[type="password"],
#contact td textarea,
#contact td select{
width:92%;
background:#fff;
border:solid 2px #e2e2e2;
padding:10px;
margin-top: 0.2em;
}
#contact td select{
padding:8px 10px;
background:#fff url(../../img/select_bg.png) 95% 50% no-repeat;
}
.updnWatermark {
color:#ddd;
top:10px;
left:10px;
}
.input p{
margin:10px 5px;
float:left;
}
#contact td input[type="text"]#year,
#contact td input[type="text"]#age{
width:3em;
padding:8px 10px;
margin-right: 5px;
}
#contact .input #zip1{
float:left;
width:3em;
text-align:center;
padding:8px 10px;
}
.input label[for=zip1]{
left:38px;
}
.center_line{
float:left;
margin:9px 7px;
font-size:20px;
}
#contact .input #zip2{
float:left;
width:4em;
text-align:center;
padding:8px 10px;
}
.input label[for=zip2]{
left:130px;
}
#contact .input #education_year{
float:left;
width:5em;
text-align:center;
padding:8px 10px;
}
.input label[for=education_year]{
left:30px;
}
.spanEducation{
float:left;
margin:9px 10px;
}
#contact .input #education_month{
float:left;
width:3em;
text-align:center;
padding:8px 10px;
}
.input label[for=education_month]{
left:170px;
}
.divGraduate{
clear:both;
padding-top:1em;
}
.tr{
color:#f00;
}
.btn{
display:block;
width:80%;
color:#fff;
background:#367fd9;
padding:18px 0;
margin:0 auto;
font-family:'gotham rounded', arial, "ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro",Osaka,"メイリオ",Meiryo,"ＭＳ Ｐゴシック","MS PGothic",sans-serif !important;
font-size: 1em !important;
}
.btn:hover,
.subm:hover{
cursor:pointer;
background:#5edaff;
}
.check{
text-align:center;
}
.check button{
display:inline-block;
color:#fff;
font-size: 1em !important;
width:38%;
padding:18px 0;
margin:0 1%;
}
.ret{
background:#ccc;
}
.ret:hover{
background:#dcdcdc;
cursor:pointer;
}
.subm{
background:#8dcf3f;
}
label.error{
float:right;
color:#f00;
margin-top:0.2em;
margin-right:1em;
padding-left:1em;
background:url(../../img/kome_r.png) left 0.35em no-repeat;
}
.wrap{
font-size:113%;
text-align:center;
}
.thanks_text{
font-size:113%;
margin:0 3%;
line-height:1.8;
}
.required_error{
display:block;
text-align:center;
margin:10px 0;
}
/*▲お問い合わせ▲*/

}