@charset "utf-8";
/* CSS Document */

/*
float解除
---------------------------------------------------------------------------------*/
#step .clear:after{
    content: ".";
    display: block;
    visibility: hidden;
    /*height: 0.1px;*//*原稿の求人情報詳細等のタブの下に隙間ができるのでトル*/
    font-size: 0.1em;
    line-height: 0;
    clear: both;
}

#step .clear{ min-height: 1px;}

#step * html .clear{
	height: 1px;
	/*\*//*/
	height: auto;
	overflow: hidden;
	/**/
}

/* 2017/06/27追加 */
#step .up_day {
    margin: 5px;
    text-align: right;
}

@media screen and (min-width: 641px){

#step p {
	font-size: 16px;
	font-size: 1.6rem;
	line-height: 1.8;
}

#step img{
max-width: 100%;
height: auto;
width /***/:auto;　
}

#step body >#all_new{
        height: auto;
}

/*---------スマホインクルードをＰＣで表示させないためのクラス--------------------*/
#step .nonepc{
	display:none;
}
/*---------スマホインクルードをＰＣで表示させないためのクラス--------------------*/
/* ===================================================================

	この下に画面サイズ710px以上ののスタイルを記述

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

「wrapper」の高さ              1300px

「profile」の高さ 				276px（260px + 線6px + 余白10px）
「採用に至るまで」の高さ 		116px（100px + 線6px + 余白10px）
「お店を選んだポイント」の高さ 	120px（120px + 線6px + 余白10px）
「なぜ採用タイトル」の高さ	 	 36px（ 36px + 線6px）
「なぜ採用文章」の高さ 			266px（230px + 線6px + 余白(margin-bottom)10px + 余白(padding-top/bottom)20px）
「なぜ採用画像」の高さ 			470px


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


/* 全体 */
#step #left{
	margin-bottom:30px;
}

#step #wrapper{
	width:800px;
	height:auto;
	line-height: 140%;
}

/* タイトル */
#step .top{
    width: 100%;
    height: 185px;
    margin-bottom: 10px;
    text-align: center;
}

/* 中央写真 */
#step .Main_Photo{
	width:100%;
	height:555px;
	text-align:center;
	margin-bottom:5px;
}

/* 破線画像 */
#step .hasen{
	margin-bottom:5px;
}

/* 左側 */
#step .Main_left{
	width:256px;
	height:1300px;
	margin:0px 0px 0px 15px;
	float:left;
}

#step .Main_left2{
	width:256px;
	margin:0px 0px 5px 15px;
	clear:both;
}

#step .Main_left3{
	width:256px;
	height:auto;
	margin:0px 0px 0px 15px;
	float:left;
	font-size: 12px;
	font-size: 1.2rem;
}

#step .namesize{
	font-size:280%;
}

/* 右側 */
#step .Main_right{
	width:490px;
	/*height:1100px;20170627削除*/
	text-align:justify;
	text-justify:inter-ideograph;
	float:right;
	margin:0 15px 5px 0px;
	/*position:relative;20170627削除*/
}

#step .Main_right2{
	width:390px;
	height:1036px;
	text-align:justify;
	text-justify:inter-ideograph;
	float:right;
	margin:0 15px 5px 0px;
	position:relative;
}

#step .Main_right3{
	width:390px;
	text-align:justify;
	text-justify:inter-ideograph;
	float:right;
	margin:0 15px 5px 0px;
	position:relative;
}

/* プロフィール */
#step .article1{	
	width:250px;
	height:275px;
	border:3px solid #A1CBED;
	margin-bottom:10px;
	text-align:justify;
	text-justify:inter-ideograph;
}

/* 採用に至るまでの就職活動DATA */
#step .article2{	
	width:250px;
	height:100px;
	border:3px solid #A1CBED;
	margin-bottom:10px;
}

/* お店（会社）を選んだポイント */
#step .article3{	
	width:250px;
	height:120px;
	border:3px solid #A1CBED;
	margin-bottom:10px;
}

/* なぜ採用されたと思いますか？ */
/* タイトル */
#step .article4{
	width:250px;
	height:30px;
	border:3px solid #D010B1;	
	color:#D010B1;
	font-weight:bold;

}

#step .article5{
	width:250px;
	height:30px;
	border:3px solid #cc3300;	
	color:#cc3300;
	font-weight:bold;

}

/* なぜ採用されたと思いますか？ */
/* 文章 */
#step .saiyo_A{
	width:230px;
	height:110px;
	border:3px solid #D010B1;
	background-color:#D010B1;
	color:#FFFFFF;
	line-height:17px;
	text-align:justify;
	text-justify:inter-ideograph;
	margin-bottom:10px;
	padding:10px 10px 10px 10px;
}

#step .saiyo_B{
	width:230px;
	height:230px;
	border:3px solid #cc3300;
	background-color:#cc3300;
	color:#FFFFFF;
	line-height:17px;
	text-align:justify;
	text-justify:inter-ideograph;
	margin-bottom:10px;
	padding:10px 10px 10px 10px;
}

/* プロフィール 文章 */
#step .nameA{
	padding:20px 10px 10px 10px;
}

/* 採用に至るまで・お店（会社）を選んだ 文章 */
#step .nameB{
	padding:10px 10px 10px 10px;
}

/* なぜ採用されたと思いますか？ 文章 */
#step .nameC{
	padding:5px;
}

/* なぜ採用されたと思いますか？ 画像 */
#step .photo2{
	width:256px;
	/*height:470px;*/
/*	position:absolute;
	bottom:0;
*/}

/* 質問 */
#step .blue_A{
	font-size:130%;
	/*font-size:2.0rem;*/
	line-height: 1.8;
	font-weight:bold;
	color:#00AAE7;
}

#step .blue_B{
	font-size:20px;
	font-size:2.0rem;
	line-height: 1.4;
	font-weight:bold;
	color:#005B9F;
}
/* 20150915追加 */
#step .Main_right dd{
	font-size:16px;
	font-size:1.6rem;
	line-height: 1.8;
	margin-bottom:10px;
	margin-top:-18px;	
}
#step .Main_right .textA{
	margin-top:0px;
	
}
/* 今後に期待すること */
#step .kimete{
	width:390px;
	/*height:265px;20170627削除*/
	/*position:absolute;20170627削除*/
	bottom:0;
}

/* ショップボックス */
#step .shopbox{
	width:758px;
	height:auto;
	border:6px solid #A1CBED;
	margin-left:15px;
	margin-bottom:20px;
	padding:10px 10px 10px 10px;
}

#step .shopbpx_left{
	width:auto;
	height:auto;
	float:left;
	margin-right:15px;
}

#step .shopbpx_right dt{
	font-size:146.5%;
	font-weight:bold;
	margin-bottom:10px;
}

#step .shopbpx_right dd {
	font-size: 12px;
	font-size: 1.2rem;
}

/* バックナンバー */
#step #kyujin{
	clear:both;
	font-size: 16px;
	font-size: 1.6rem;
	font-weight:bold;
	margin-top:20px;
	/*padding-left:220px;*/
	text-align:center;
}

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

高木正人、ボクダ茂など名前の文字数が変わるときは、sectionのpadding
とwidthの値を変更して調整してください。合計が680pxにならないとダメです。

======================================================================*/
#step .section_step {
	width:120px;
	padding-left: 580px;
	margin-top: 10px;
	/*background-color:#FF0000;*/
	overflow:hidden;
}

#step .seisaku {
	float: left;
	text-align: right;
	margin-right: 10px;
}

#step .sstaff {
	float: left;
	text-align: left;
}

/* 237号以降はこちらを使用 */

#step .section_step2 {
	width:100px;
	margin-left: 610px;
	margin-top: 10px;
	/*background-color:#FF0000;
	overflow:hidden;*/
}

#step .seisaku2 {
	float: left;
	text-align: right;
	margin-right:10px;
}

#step .sstaff2 {
	float: left;
	text-align: left;
}

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

	この上に画面サイズ710px以上ののスタイルを記述

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

}

@media screen and (max-width: 640px){
#step img{
max-width: 100%;
height: auto;
width /***/:auto;　
}

#step #wrapper {
	width: auto;
	text-align: left;
	padding: 10px 5% 0 5%;
}

#step #all_new{
	width:auto;
	margin: 0px auto;
	padding: 0px;
	text-align: center;
	position: relative;
	background:none;
	min-height: 100%;
    _height: 100%; /* for IE6 */
	font-family: 'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'ＭＳ Ｐゴシック','MS PGothic',sans-serif;
}

#step body >#all_new{
        height: auto;
}
/*20160830追記*/
#step #left{
       padding:6% 8% 4% 8%!important;
}

/*---------ＰＣインクルードを表示させないためのクラス--------------------*/
#step .none{
	display:none;
}
/*---------ＰＣインクルードを表示させないためのクラス--------------------*/
/* ===================================================================

	この下に画面サイズ709px以上のスタイルを記述

=================================================================== *
/* 中央写真 */
#step .Main_Photo{
	width:100%;
	height:auto;
	text-align:center;
	margin-bottom:5px;
	margin-top:7px;
}

#step .namesize{
	font-size:150%;
	font-weight:bolder;
}

#step .article1{
	border:3px solid #A1CBED;
	margin-bottom:10px;
}
#step .article2{
	border:3px solid #A1CBED;
	margin-bottom:10px;
}
#step .article3{
	border:3px solid #A1CBED;
	margin-bottom:10px;
}
#step .article4{
	border:3px solid #D010B1;	
	color:#D010B1;
	font-weight:bold;
	padding-top: 5px;
	padding-left: 5px;
	padding-bottom: 2px;
}

#step .article5{
	border:3px solid #cc3300;	
	color:#cc3300;
	font-weight:bold;
	padding-top: 5px;
	padding-left: 5px;
	padding-bottom: 2px;
}

#step .nameA,#step .nameB{
	padding:10px 10px 10px 10px;
}

#step .saiyo_A{
	width:auto;
	border:3px solid #D010B1;
	background-color:#D010B1;
	color:#FFFFFF;
	line-height:17px;
	text-align:justify;
	text-justify:inter-ideograph;
	margin-bottom:10px;
	padding:10px 10px 10px 10px;
}

#step .saiyo_B{
	width:auto;
	border:3px solid #cc3300;
	background-color:#cc3300;
	color:#FFFFFF;
	line-height:17px;
	text-align:justify;
	text-justify:inter-ideograph;
	margin-bottom:10px;
	padding:10px 10px 10px 10px;
}

#step .photo2{
	width: 70%;
	margin: 0 auto;
}

#step .Main_left{
	margin-top:10px;
}
/* 20160830追加 */
#step .Main_left2 p,#step .Main_left3 p {
	margin: 4% 0;
	}
#step .photo2 img{
	width:100%;
	}
/* 質問 */
#step .blue_A{
	font-size:120% !important;
	font-weight:bold;
	color:#00AAE7;
	line-height:1.8 !important;
}

#step .blue_B{
	font-size:116%;
	font-weight:bold;
	color:#005B9F;
}

#step .seisaku2 {
	float: right;
	text-align: right;
	margin:10px 10px 10px 0;
}
/* 20150915追加 */
#step .Main_right dd{
	margin-bottom:4%;
	margin-top:-18px;
	font-size: 15px;
	font-size: 1.5rem;
	line-height:1.8;
}
#step .Main_right .textA{
	margin-top:0px;
	
}
/* 20160830追加 */
#step .Main_right .textA{
	font-size:15px;
	font-size:1.5rem;
	line-height:1.8;
	}
/* ショップボックス */
#step .shopbox{
	width:70%;
	height:auto;
	border:6px solid #A1CBED;
	padding:25px;
	clear:both;
	margin:0 auto;
	margin-bottom:20px;
}

#step .shopbpx_left img{
	margin-bottom:10px;
}

#step .shopbpx_right dt{
	padding-bottom:5px;
}
/* 20160830追加 */
#step .shopbpx_right dd {
	word-wrap: break-word;
	}
#step .shopbpx_left img{
	width: 100%;
	}
/* 20160901追加 */
#step .kimete {
 text-align: center;
	width: 100%;
	margin: 8% 0 4%;
	}
/* バックナンバー */
#step #kyujin{
	clear:both;
	font-size:15px;
	font-weight:bold;
	/*padding-left:220px;*/
	text-align:center;
	margin:30px 0;
}

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

	この上に画面サイズ709px以上ののスタイルを記述

=================================================================== */
/*----------------widthをautoにする設定--------------------------------ここから---------------------*/

#step #header{
	width:auto;
	height:auto;
	margin: 0px auto;
}

#step #navigation{
	width:auto;
	height: 40px;
	margin: 5px auto 5px;
	padding: 0px;
	background: url(../images/cmn/bg_menu.gif) repeat-x;
}

#step #main{
	width:auto;
	background-color:#fff;
	margin-top: 0px;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;

}

#step #left{
	float: none;
	width:auto;
	list-style: none;
	position: static;
	background-color:#FFFFFF;
	text-align:left;
	padding-right:5px;
	padding-left:5px;
}
#step adress{
	width:auto;
}

#step dt{
	font-weight:bold;
}
/*----------------widthをautoにする設定-----------------------------ここまで------------------------*/

/*---------ココから下はIPXのCSSからもってきたヘッダーとフッターのスタイルシート--------------------*/

/* ------import------ */
@import "reset.css";

/* ------全体------ */
#step body {
	font: 14px/1.231 "ヒラギノ角ゴ Pro W3";
	-webkit-text-size-adjust: none;
}

#step a {
	color: #000000;
}

#step #wrap {
	padding: 0 10px;
}


#step aside {
	padding: 10px;
}

#step aside p:last-child {
	margin-bottom: 0;
}

/* ------clearfix------ */
#step .clearfix:after {
	clear: both;
	height: 0;
	display: block; /* ブロックレベル要素に */
	visibility: hidden;
	content: "."; /* 新しい要素を作る */
}

/* ------ヘッダー------ */
#step header {
	height: auto;
	margin-bottom:2px;
	padding: 5px 10px;
	font-weight: bold;
	background: -webkit-gradient(linear, left top, left bottom, color-stop(1.00, #F2F5F6), color-stop(0.00, #FAFAFA));
	background: -webkit-linear-gradient(top, #FAFAFA 0%, #F2F5F6 100%);
	-webkit-box-shadow: 0px 1px 0px #777777;
	text-align:left;
}

/* ------飲食求人・飲食店転職グルメキャリー関西------ */
#step h1 {
	margin-bottom: 5px;
	font-size: 60%;
	color: #666666;
}

#step header h1 a{
	text-decoration:none;
}

#step header h1 a{
	text-decoration:none;
}

/* ------ロゴ------ */
#step #logo {
	float: left;
	width: 150px;
	height: auto;
}


/* ------エリア表記------  */
#step h2 {
	float: right;
	margin-top: 5px;
	padding: 5px 10px;
	font-size: 70%;
	font-weight: bold;
	text-align: center;
	color: #FFFFFF;
	border-radius: 2px;
	background-color: #FF9933;
}


/* ------フッター------ */
#step footer {
	height: auto;
	padding: 5px 10px 5px 10px;
	font-size: 13px;
	line-height: 1.7em;
	text-align: center;
	color: #FFFFFF;
	background: -webkit-gradient(linear, left top, left bottom, color-stop(1.00, #FF7400), color-stop(0.00, #FFA443));
	background: -webkit-linear-gradient(top, #FFA443 0%, #FF7400 100%);
	background: -moz-linear-gradient(top, #FFA443 0%, #FF7400 100%);
	background: -o-linear-gradient(top, #FFA443 0%, #FF7400 100%);
	background: -ms-linear-gradient(top, #FFA443 0%, #FF7400 100%);
	background: linear-gradient(top, #FFA443 0%, #FF7400 100%);
}

#step footer a {
	text-decoration: none;
	color: #FFFFFF;
}

#step footer p {
	color: #000000;
}

#step address {
	color: #CCCCCC;
    font-style: normal;
    height: 30px;
    margin-bottom: 0;
    margin-left: auto;
    margin-right: auto;
    margin-top: 0;
    padding-bottom: 3px;
    padding-left: 3px;
    padding-right: 3px;
    padding-top: 3px;
    width: auto;
	background-color:transparent;
}

#step footer p a {
	text-decoration: underline;
	color: #000000;
}

#step footer p:last-child {
	margin: 0;
}


}