/* CSS Document */

/********************************************************/
/*	共通設定											*/
/********************************************************/

/* 各ページの内容 */
#content{
	margin: 0px 0px 0px 0px;
	font-size:14px;
	font-weight: 500;
	font-family:"Roboto","游ゴシック体", "Yu Gothic", "Hiragino Kaku Gothic Pro", "Meiryo", sans-serif;
}

#main{
	margin: 5px;
}

/* 各コンテンツページの先頭の画像 */
.contents_head_pic 
{
	position: relative;	
	max-width: 1200px;
}

.contents_head_pic img {
	height: 80px;
	width: 100%;
	margin:0 auto;
}

.contents_head_pic p {
	position: absolute;
	color: white;
	font-size:36px;
	font-family:"Roboto","游ゴシック体", "Yu Gothic", "Hiragino Kaku Gothic Pro", "Meiryo", sans-serif;
	top: 50%;
	left: 50%;
	-ms-transform: translate(-50%,-50%);
	-webkit-transform: translate(-50%,-50%);
	transform: translate(-50%,-50%);
	margin:0;
	padding:0;
	text-shadow: 0px 2px 4px #222;
}

/* 文字列"NEW"の装飾 */
.new_icon{
	width:50px;
	text-align:center;
	font-size:14px;
	padding:3px;
	color:#ffffff;
	background-color:#cc3366;
}

/*表 表示形式*/
.table_config{
	list-style: none;
	font-family:"Roboto","游ゴシック体", "Yu Gothic", "Hiragino Kaku Gothic Pro", "Meiryo", sans-serif;
	font-size: 16px;
	line-height: 30px;
}

.table_first_row {
	margin: 0 auto;
	border: 2px solid #ccc;
	width: 80%;
	background-color: #D6ECF2;
}

.table_next_row {
	margin: 0 auto;
	width: 80%;
	border-left: 2px solid #ccc;
	border-right: 2px solid #ccc;
	border-bottom: 2px solid #ccc;
	background-color: #D6ECF2;
}

.table_item {
	display: block;
	float: left;
	padding: 10px;
	font-weight: bold;
}

.table_data {
	display: block;
	margin-left: 200px;
	padding: 10px;
	border-left: 2px solid #ccc;
	background-color: #fff;
}

/*太字解除*/
.weight_init{
	font-weight: normal;
}

/*印刷用頁移動ボタン設定*/
.printPageJumpButtonConfig{
	text-align: center;
	marigin: 0 auto;
	visibility: visible; /* スマホ版ではhidden設定とする */
}

.printPageJumpButtonConfig img{
	width: 300px;
	height: 40px;
}

/* 数値の位置調整用 */
.numberPosAdjust
{
	visibility:hidden;
}

/*電話番号リンク*/
/*スマホの場合は以下のCSSを無効化する*/
.telLink{
	pointer-events: none;
	cursor: default;
	text-decoration: none;
	color: #000000;
}

/********************************************************/
/*	別ウインドウ共通									*/
/********************************************************/
/* ヘッダー情報 */
#headerOther{
	height: 40px;
	width: 100%;
	max-width: 1200px;
}

/* フッター情報 */
.footer_Other{
	height:20px;
	text-align:right;
	font-family:"Roboto","游ゴシック体", "Yu Gothic", "Hiragino Kaku Gothic Pro", "Meiryo", sans-serif;
	font-size:12px;
	padding-right: 0px;
	list-style-type: none;
	background:#F1F8FC;
	width: 100%;
	max-width: 1200px;
}

/********************************************************/
/*	indexページ											*/
/********************************************************/

.body {  
	/*text-align: center;*/
	margin: 5px 0px 0px 0px;
	width:100%;
	height:100%;
	max-width: 1200px;
	/*height:540px;*/
}

/* 表示が切り替わるところ*/
iframe#main{
	margin-top: 0px;
	width: 1200px;
	height: 800px;
	float: left;
	border-style: hidden;
	margin-left: 0px;	
	frameborder="0";
}
 
/* ヘッダー */
div#header{
	background:#b0c4de;
	text-align:right;
	height:40px;
	width: 100%;
}

/* ヘッダー画像 */
.headerImage{
	width:200px;
	height:40px;
	padding-left:10px;
}

/* フッター情報 */
footer{
	top:900px;
	width:1200px;
	height:20px;
	text-align:right;
	font-family:"Roboto","游ゴシック体", "Yu Gothic", "Hiragino Kaku Gothic Pro", "Meiryo", sans-serif;
	font-size:12px;
	padding-right: 0px;
	list-style-type: none;
	background:#F1F8FC;
}

/* ホームページ全体 */
div#container{
	width:1200px;
	height: 100%;
	margin: 0;
	overflow:hidden;
	/*text-align:center;*/
}

/* ヘッダーメニュー全体 */
#headermenu {
	margin: auto;
	height:40px; 
	display: flex;
	padding-left: 0px;
	list-style-type: none;
	background:#F1F8FC;
}

/* ヘッダーメニューリスト */
#headermenu li {
	display: inline-block;
	list-style-type: none;
	height: 40px;
	font-size:18px;
}

#headermenu li a {
	display: block;
	text-align: center;
	text-decoration: none;
	margin: 0px;
	padding: 0px;
}

li.headerSoubuName {
	text-align: center;
	margin: 0px;
	padding: 0px;
	height: 40px;
	font-weight: normal;
	font-family:"Roboto","游ゴシック体", "Yu Gothic", "Hiragino Kaku Gothic Pro", "Meiryo", sans-serif;
	font-size:12px;
}

/* 間の領域*/
.header_image_list_distance{
	width:100px;
}

/* 画面遷移メニューリスト */
#menu {
	padding: 0px;
	list-style-type: none;
	margin: 0px,0px,0px,0px;
	height: 40px;
	font-size: normal;
	font-weight: normal;
	font-family:"Roboto","游ゴシック体", "Yu Gothic", "Hiragino Kaku Gothic Pro", "Meiryo", sans-serif;
	font-size: 16px;
}

/* ドロップダウンメニュー通常時 */
#menu li a{
	display: block;
	margin: 0px;
	margin-top: 0px;
	padding-left: 20px;
	padding-right: 20px;
	line-height: 40px;
	text-decoration: none;
	border-top:none;
	color: black;
	text-align: center;
	position: relative;
	
	/* グラデーション */
	/* Firefox */
	/*background: -moz-linear-gradient(left, #0066FF, #00BBFF);*/
	/* Chrome */
	/*background: -webkit-gradient(linear, left center, right center, from(#0066FF), to(#00BBFF));*/
	/*IE6 IE7 */
	/*filter: progid:DXImageTransform.Microsoft.gradient(GradientType=1,startcolorstr=#0066FF, endcolorstr=#00BBFF));*/
	/* IE8 IE9 */
	/*-ms-filter:"progid:DXImageTransform.Microsoft.gradient(GradientType=1,startcolorstr=#0066FF, endcolorstr=#00BBFF))";*/
	/* IE10 IE11 */
	/*background: -ms-linear-gradient(left,  #0066FF,  #00BBFF);*/
	/*border-color:#FFF;*/
	/* 残　メニュー通常時文字色*/
	/*color:#FFFFFF;*/
	/* */
	font-family:"Roboto","游ゴシック体", "Yu Gothic", "Hiragino Kaku Gothic Pro", "Meiryo", sans-serif;
}

/* ドロップダウンメニュー選択中 */
#menu li a:hover {
	display: inline-block;
	text-decoration: none;
	border-top:none;
	/* グラデーション */
	/* Firefox */
	/*background: -moz-linear-gradient(left, #66FF66, #ffffff);*/
	/* Chrome */
	/*background: -webkit-gradient(linear, left center, right center, from(#66FF66), to(#ffffff));*/
	/* IE6 IE7 */
	/*filter: progid:DXImageTransform.Microsoft.gradient(GradientType=1,startcolorstr=#66FF66, endcolorstr=#ffffff));*/
	/* IE8 IE9 */
	/*-ms-filter: "progid:DXImageTransform.Microsoft.gradient(GradientType=1,startcolorstr=#66FF66, endcolorstr=#ffffff))";*/
	/* IE10 IE11 */
	/*background: -ms-linear-gradient(left,  #66FF66,  #ffffff);*/
	/*zoom: 1;*/
	/* 残　メニュー選択時文字色
	color:#66FF33;
	 */
	color:#66FF33;
	font-family:"Roboto","游ゴシック体", "Yu Gothic", "Hiragino Kaku Gothic Pro", "Meiryo", sans-serif;
}

/* サブメニュー */
#menu ul {
   display: none; /*非表示*/
   margin: 0px,0px,0px,0px;
   padding: 0px;
   position: absolute;
   list-style: none;
   
	/*list-style-type: none;*/
	/*padding: 20px;*/
	/*margin-top:7px;*/
	/*filter:alpha(opacity=80);*/	/*透過度（IE用）*/
	/*-moz-opacity:.80;*/			/*透過度（FireFox用）*/
   	/*opacity:.80;*/				/*透過度（Chrome用）*/
	background-color: #F1F8FC;
}

/* メニュー選択中のサブメニュー */
#menu li:hover ul {
	display: block;   /*縦に表示*/
	position: absolute;
	text-align: center;
	width: 180px;
	top: 40px;
	border: 1px solid black;
}

#sub{
	padding: 0px;
	
}

#menu li:hover ul li {
	width: 180px;
	border: 1px dashed black;
}

/*訪問後のリンク*/
.anchor:visited {
    color:#934C7B;
    text-decoration:underline;
}

/*リンクにマウスをのせたとき*/
.anchor:hover {
    color:#ff0000;
    font-style:normal;
    text-decoration:underline;
}

/********************************************************/
/*	TOPページ											*/
/********************************************************/

/* TOP画像 */
.top_pic{
	width:1190px;
	height:600px;
	display: block;
 	margin-left: 0;
 	margin-right: 0;
}

/* TOPコメント */
.top_comment{
	text-align:center;
	height:10px;
	font-family: Verdana,"メイリオ",Meiryo,"ＭＳ Ｐゴシック","MS PGothic",sans-serif;
}

/*会社名*/
.top_company{
	text-align:center;
	font-family: Verdana,"メイリオ",Meiryo,"ＭＳ Ｐゴシック","MS PGothic",sans-serif;
}

/*会社名のフェードイン */
.top_company_fade{
    /* (1) アニメーション名
       (2) 1回のアニメーションにかかる時間
       (3) アニメーションの変化率（ ease、linear、ease-out、ease-in-outなど)
       (4) アニメーションの開始を遅らせる時間(1s＝1秒)
       (5) アニメーションを何回繰り返すか
       (6) 繰り返し時、往復処理をするか(normal, reverse, alternate, alternate-reverseなど)
   	*/
	animation: fade-in2 5.0s ease 0s 1 normal;
}

/*上から下へのフェードイン */
 @keyframes fade-in2 {
    0% {
      opacity: 0;
      transform: translate3d(0, -20px, 0);
    }
    100% {
      opacity: 1;
      transform: translate3d(0, 0, 0);
    }
  }


/********************************************************/
/*	会社・基本情報ページ								*/
/********************************************************/

/*社員構成表 表示形式*/
.syainkousei_table{
	text-align: center;
	border: 3px outset #000000;
}

.syainkousei_table th {
	padding-right: 20px;
	padding-left: 20px;
	border: 1px solid #000000;
	background-color: #ccc;
}

.syainkousei_table td {
	padding-right: 20px;
	padding-left: 20px;
	border: 1px solid #000000;
}

/********************************************************/
/*	会社概要印刷用ページ								*/
/********************************************************/
/*ページ内容設定*/
.p_company_text{
	width:450px;
	font-size:14px;
	font-weight: 500;
}

#p_syainkousei_table{
	width:300px;
	font-size:14px;
	font-weight: 500;
}

/*印刷用ページの見出し*/
.p_title{
	border-bottom : 2px solid #0FF ;
	border-left : 10px ridge #0CC;
	width:580px;
	height : 25px;
	padding:5px 0px 0px 9px;
	font-family:"Roboto","游ゴシック体", "Yu Gothic", "Hiragino Kaku Gothic Pro", "Meiryo", sans-serif;
}

/*改ページ挿入*/
.page_break{
	break-after: page;
}

/********************************************************/
/*	開発環境ページ								*/
/********************************************************/
.develop_use_db_Title{
 font-size: 18px;
}

/********************************************************/
/*	アクセスページ										*/
/********************************************************/

/*アクセスページフォント設定*/
.access_font{
	font-family:"Roboto","游ゴシック体", "Yu Gothic", "Hiragino Kaku Gothic Pro", "Meiryo", sans-serif;
	font-weight: 500;
}

/*地図とテキストの表示範囲設定*/
.access_range{
	margin: auto;
	width: 100%;
	max-width: 1200px;
	padding-bottom: 50px;
}

/*テキスト部分の設定*/
.access_text{
	display: inline-block;
	width: 100%;
	max-width: 500px;
	float: left;
	margin-left: 50px;
}

.access_text p{
	display: block;
	width: 400px;
	font-size: 26px;
	border-bottom: 2px solid #000;
}

/*説明テキスト設定*/
.access_description{
	margin-left: 30px;
	font-size: 18px;
}

/*交通手段リストのスタイル*/
.transportation_list{
	list-style: none;
}

/*ボタンの設定*/
/*マップが表示されないときの地図表示*/
.access_button_config{
	margin-left: 30px;
	margin-top: 20px;
}

.access_button_config img{
	width: 300px;
	height: 30px;
}

/*印刷用ページ遷移ボタン*/
.access_p_button_config{
	margin-left: 30px;
	margin-top: 20px;
}

.access_p_button_config img{
	width: 300px;
	height: 30px;
}

/*印刷用ページのテキスト設定*/
.p_access_title{
	display: block;
	width: 650px;
	margin-bottom: 5px;
	font-family:"Roboto","游ゴシック体", "Yu Gothic", "Hiragino Kaku Gothic Pro", "Meiryo", sans-serif;
	font-size: 26px;
}

/* MAP（アクセス用）の設定 */
div.gmap{
	display: inline-block;
	width:550px; 
	height:500px;
	margin-left: 0px;
	margin-right: auto;
	margin-top: 50px;
	border:1px solid #000000;
}

/********************************************************/
/*	アクセス印刷用ページ								*/
/********************************************************/
/* MAP（印刷用）の設定 */
div.gmap_p{
	width:650px; 
	height:900px;
	border:1px solid #000000;
}

/* MAP（印刷用）の吹き出しの設定 */
div#info_window{
	width:260px;
	height:125px;	
}

/*chromeで印刷時に地図に白い帯が入るバグの対策*/
.gm-style div > img {
	position: absolute;
}

/*ie用の注意書き*/
/*一旦表示しないようにする*/
.ie_notice{
	display: none;
}

/*ieのみ表示*/
@media all and (-ms-high-contrast: none) {
	.ie_notice{
		display: inline;
		font-family:"Roboto","游ゴシック体", "Yu Gothic", "Hiragino Kaku Gothic Pro", "Meiryo", sans-serif;
	}
}
/********************************************************/
/*	採用案内ページ										*/
/********************************************************/
/*見出し*/
.recruit_title{
	display: block;
	font-family:"Roboto","游ゴシック体", "Yu Gothic", "Hiragino Kaku Gothic Pro", "Meiryo", sans-serif;
	font-size: 24px;
	font-weight: 500;
	margin-top: 50px;
	margin-left: 60px;
	margin-right: 500px;
	border-bottom: 1px solid #000000;
}

/********************************************************/
/*	風景ページ											*/
/********************************************************/

/* 風景ページ */
#scene{
	font-family:"Roboto","游ゴシック体", "Yu Gothic", "Hiragino Kaku Gothic Pro", "Meiryo", sans-serif;
 	width: 100%;
 	height: auto;
}

/*写真リスト*/
.scene_table{
	list-style: none;
	padding: 0;
}

.scene_table li{
	float: left;
	text-align: center;
	margin-bottom: 16px;
	margin-left: 8px;
	margin-right: 8px;
	
  	-webkit-box-shadow: 0 0 50px #add8e6 inset, 5px 5px 0 #cecece; 
	-moz-box-shadow: 0 0 50px #add8e6 inset, 5px 5px 0 #cecece;
	box-shadow: 0 0 50px #add8e6 inset, 5px 5px 0 #cecece;;
}

/*写真タイトル*/
.scene_title{
	display: table;
	height: 120px;
	width: 270px;
	margin: auto;
	background: #fff;
	-webkit-box-shadow: 0 0 50px #add8e6 inset, 5px 5px 0 #cecece; 
	-moz-box-shadow: 0 0 50px #add8e6 inset, 5px 5px 0 #cecece;
	box-shadow: 0 0 50px #add8e6 inset, 5px 5px 0 #cecece;
}

.scene_title p{
	display: table-cell;
	vertical-align: middle;
}

/*写真サイズ*/
.scene_img{
	width: 270px;
	height: 270px;
}

/********************************************************/
/*	お問い合わせページ									*/
/********************************************************/
#inquiry{
	font-size: 16px;
	font-family:"Roboto","游ゴシック体", "Yu Gothic", "Hiragino Kaku Gothic Pro", "Meiryo", sans-serif;
}

#inquiry input{
	font-size: 16px;
	font-family:"Roboto","游ゴシック体", "Yu Gothic", "Hiragino Kaku Gothic Pro", "Meiryo", sans-serif;
}

#inquiry textarea{
	font-size: 16px;
	font-family:"Roboto","游ゴシック体", "Yu Gothic", "Hiragino Kaku Gothic Pro", "Meiryo", sans-serif;
}


/* 氏名テキスト */
.inquiry_user_name{
	width:300px;
}

/* 氏名ひらがなテキスト */
.inquiry_user_name_hira{
	width:550px;
}

/* 電話番号テキスト */
.inquiry_user_call{
	ime-mode: disabled;
	width:50px;
}

/* メールアドレステキスト */
.inquiry_user_mail1{
	width:300px;
}

.inquiry_user_mail2{
	width:200px;
}

/* メール種別ラジオボタン */
.inquiry_radiobutton{
}

/* 件名 */
.inquiry_subject{
	width:500px;
}

/* 本文 */
.inquiry_main_text{
	width:700px;
	height:100px;
}

/* 内容確認ボタン */
.inquiry_button{
	width:100px;
	height:40px;
}

/* 閉じるボタン */
.inquiry_close_button{
	width:100px;
	height:40px;
	margin-left: 20px;
	visibility: hidden; /* hidden設定とする */
}

/********************************************************/
/*	お問い合わせ 確認ページ									*/
/********************************************************/
/* 確認ページ　レイアウト */
.confirmation_table{
	width:100%;
}

.confirmation_table th{
	background:#DDDDDD;
	border:solid 1px;
	width:115px;
	font-size: 16px;
	font-family:"Roboto","游ゴシック体", "Yu Gothic", "Hiragino Kaku Gothic Pro", "Meiryo", sans-serif;
}
.confirmation_table td{
	font-size: 16px;
	font-family:"Roboto","游ゴシック体", "Yu Gothic", "Hiragino Kaku Gothic Pro", "Meiryo", sans-serif;
}

/* 氏名ラベル */
.confirmation_user_name{
	width:710px;
	border: 1px solid gray;
}

/* 氏名ひらがなラベル */
.confirmation_user_name_hira{
	border: 1px solid gray;
}

/* 電話番号ラベル */
.confirmation_user_call{
	border: 1px solid gray;
}

/* メールアドレスラベル */
.confirmation_user_mail{
	border: 1px solid gray;
}

/* 件名ラベル */
.confirmation_subject{
	border: 1px solid gray;
}

/* 本文ラベル */
.confirmation_main_text{
	border: 1px solid gray;
}

/* 送信ボタン */
.confirmation_submit{
	font-size: 16px;
	font-family:"Roboto","游ゴシック体", "Yu Gothic", "Hiragino Kaku Gothic Pro", "Meiryo", sans-serif;
	width:130px;
	height:40px;
}

/* 戻るボタン */
.confirmation_back{
	margin-left: 40px;
	font-size: 16px;
	font-family:"Roboto","游ゴシック体", "Yu Gothic", "Hiragino Kaku Gothic Pro", "Meiryo", sans-serif;
	width:130px;
	height:40px;
}

/********************************************************/
/*	社員からの一言ページ								*/
/********************************************************/
/*コメントリスト*/
.comment_list{
	list-style: none;
	display: block;
	font-family:"Roboto","游ゴシック体", "Yu Gothic", "Hiragino Kaku Gothic Pro", "Meiryo", sans-serif;
	font-weight: 500;
}

.comment_list li{
	width: 100%;
	max-width: 950px;
	margin-top: 30px;
	margin-left: auto;
	margin-right: auto;
}

/*イニシャル*/
.comment_initial{
	display: inline-block;
	position: relative;
	float: left;
	width: 60px;
	height: 60px;
	line-height: 60px;
	text-align: center;
	padding: 0 5;
	color: #fff;
	border: 2px solid #66ffcc;
	background: #0099cc;
	border-radius: 50%;
	margin-top: 40px;
	font-size: 22px;
	font-weight: bold;
}

/*社員からの一言の各コメント*/
.comment_comment {
	font-size: 16px;
	width: 100%;
	max-width: 800px;
	position: relative;
	margin-left: 100px;
	background: #dff;
	margin-top: 20px;
	padding: 5px 10px;
	border-radius: 15px;
}
.comment_comment:after{
	right: 100%;
	top: 50px;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
	border-right-color: #dff;
	border-width: 20px;
	margin-left: -20px;
}

/********************************************************/
/*	社長挨拶ページ										*/
/********************************************************/
/*基本レイアウト*/
.greeting_text{
	margin-top: 40px;
	font-family:"Roboto","游ゴシック体", "Yu Gothic", "Hiragino Kaku Gothic Pro", "Meiryo", sans-serif;
	display: block;
	float: left;
	width: 600px;
	margin-left: 130px;
}

/*署名*/
.president_name{
	float: right;
	font-size: 22px;
	font-family: "ＭＳ Ｐ明朝",細明朝体,serif;
}

/*社長画像*/
.president_img{
	margin-top: 50px;
	margin-left: 70px;
	width: 225px;
	height: 287px
}

/* 先頭の画像の上に表示する文字が見づらい場合に少し背景色に灰色をつける */
.president_head_title_ajs{
	color: white;
	background-color: rgba(150,150,150,0.4);
}

/********************************************************/
/*	社員の一日									*/
/********************************************************/
.oneday{
	text-align: center;
}

.oneday_toaru{
	font-family:"Roboto","游ゴシック体", "Yu Gothic", "Hiragino Kaku Gothic Pro", "Meiryo", sans-serif;
	font-size: 20px;
}


.oneday_Table{
	font-family:"Roboto","游ゴシック体", "Yu Gothic", "Hiragino Kaku Gothic Pro", "Meiryo", sans-serif;
	font-size: 20px;
	width:1160px;
	border: 1px solid black;
}

.oneday_Table td{
	border: 1px solid black;
}

.oneday_Table tr{
	border: 1px solid black;
}

/* テーブル列 タイトル */
/* 時刻 */
.oneday_Table_Col_head_Time{
	width: 10%;
	height: 34px;
	background-color: #FFFF66;
	text-align: center;
}

/* 本社　Aさん */
.oneday_Table_Col_head_A{
	width: 30%;
	background-color: #FFFF66;
	text-align: center;
}

/* 本社　Bさん */
.oneday_Table_Col_head_B{
	width: 30%;
	background-color: #FFFF66;
	text-align: center;
}

/* 本社　Cさん */
.oneday_Table_Col_head_C{
	width: 30%;
	background-color: #FFFF66;
	text-align: center;
}

/* 画像 */

/* 顧客打ち合せ */
.oneday_Table_Pic_tel
{
	width:300px;
	height:200px;
}

/* 設計レビュー */
.oneday_Table_Pic_review2
{
	width:300px;
	height:150px;
}

/* コードレビュー */
.oneday_Table_Pic_review
{
	width:300px;
	height:150px;
}

/* ランチ */
.oneday_Table_Pic_lunch
{
	width:300px;
	height:150px;
}

/* プログラミング */
.oneday_Table_Pic_system
{
	width:300px;
	height:200px;
}

/* プログラミング修正 */
.oneday_Table_Pic_program
{
	width:300px;
	height:200px;
}

/* 設計レビュー */
.oneday_Table_Pic_review1
{
	width:300px;
	height:200px;
}

/* 行ヘッダ */
.oneday_row_Head{
	background-color: #FFCC33;
	text-align:center;
}

/* 行ヘッダ(午前/午後) */
.oneday_row_AMPM{
	background-color: #FFFF99;
	text-align:center;
}

/* 先頭の画像の上に表示する文字が見づらい場合に少し背景色に灰色をつける */
.oneday_head_title_ajs{
	color: white;
	background-color: rgba(180,180,180,0.1);
}

/********************************************************/
/*	労働者派遣事業ページ								*/
/********************************************************/
/*テキストの設定*/
.dispatch_text{
	font-family:"Roboto","游ゴシック体", "Yu Gothic", "Hiragino Kaku Gothic Pro", "Meiryo", sans-serif;
	display: block;
	margin-left: 100px; 
	margin-top: 40px;
	margin-right: 60px;
	margin-bottom: 50px;
	font-weight: 500;
}

.dispatch_list_Title{
 font-size: 18px;
}

/********************************************************/
/*	適正診断ページ										*/
/********************************************************/

/* レイアウト */
.diagnostic_layout_tbl td
{
	height:50%;
	text-align: center;
}

/* 画像 */
.diagnostic_pic{
	width:300px;
	height:500px;
 	margin-left: 0;
 	margin-right: 0;
 	/* border: 1px black dashed;*/
}

/*メインテキスト */
.diagnostic_main_text
{
    margin: 0; 
    padding: 0;
	font-size:20px;
	font-family:"Roboto","游ゴシック体", "Yu Gothic", "Hiragino Kaku Gothic Pro", "Meiryo", sans-serif;
	text-align: left;
}

/* 説明文の枠線 */
.diagnostic_box {
    position: relative;
    margin: 2em 0 2em 40px;
    padding: 8px 15px;
    background: #fff0c6;
    border-radius: 30px;
}
.diagnostic_box:before{
	font-family: "Roboto","游ゴシック体", "Yu Gothic", "Hiragino Kaku Gothic Pro", "Meiryo", sans-serif;
    content: "\f111";
    position: absolute;
    font-size: 15px;
    left: -40px;
    bottom: 0;
    color: #fff0c6;
}
.diagnostic_box:after{
    font-family: "Roboto","游ゴシック体", "Yu Gothic", "Hiragino Kaku Gothic Pro", "Meiryo", sans-serif;
    content: "\f111";
    position: absolute;
    font-size: 23px;
    left: -23px;
    bottom: 0;
    color: #fff0c6;
}
.diagnostic_box p {
    margin: 0; 
    padding: 0;
}

/*診断開始ボタン */
.diagnostic_Start {
  padding: 0.75em 2em;
  text-align: center;
  text-decoration: none;
  color: blue;
  border: 2px solid blue;
  font-size: 24px;
  display: inline-block;
  border-radius: 0.3em;
  transition: all 0.2s ease-in-out;
  position: relative;
  overflow: hidden;
}

.diagnostic_Start:hover {
    background-color: blue;
    color: #fff;
    border-bottom: 4px solid darken(blue, 10%);
}


/********************************************************/
/*	適正診断中ページ									*/
/********************************************************/

/* 画像 */
.diagnostic_Now_pic{
	width:500px;
	height:500px;
 	margin-left: 0;
 	margin-right: 0;
 	margin-top: 10px;
 	/* border: 1px black dashed;*/
}


/*【質問】 */
.diagnostic_Now_Head
{
	font-size:20px;
	font-family:"Roboto","游ゴシック体", "Yu Gothic", "Hiragino Kaku Gothic Pro", "Meiryo", sans-serif;
	
	position: relative;/*相対位置*/
	padding: 0.5em 0.5em 0.5em 1.5em;/*アイコン分のスペース*/
	line-height: 1.4;/*行高*/
	color: black;/*文字色*/
	border-bottom: dotted 1px gray;
	background: #fffff4;	
}

.diagnostic_Now_Head:before {
  position: relative;/*相対位置*/
  padding: 0.5em 0.5em 0.5em 1.5em;/*アイコン分のスペース*/
  line-height: 1.4;/*行高*/
  color: #ff6a6a;/*文字色*/
  border-top: dotted 1px gray;
  border-bottom: dotted 1px gray;
  background: #fffff4;
}

.diagnostic_Now_layout_tbl
{
	border-collapse: separate;
	border-spacing: 10px 0px;
}

.diagnostic_Now_layout_tbl td
{
	height:80%;
}

/* 質問本文 */
#diagnostic_Now_Question
{
	font-size:20px;
	font-family:"Roboto","游ゴシック体", "Yu Gothic", "Hiragino Kaku Gothic Pro", "Meiryo", sans-serif;
}

.diagnostic_Now_box {
	width:500px;
	position: relative;
	margin: 0em 0 2em 40px;
	padding: 15px;
	background: #fff0c6;
	border-radius: 30px;
	
}

.diagnostic_Now_box:before {  
	content: "";
	position: absolute;
	left: -38px;
	width: 13px;
	height: 12px;
	bottom: 0;
	background: #fff0c6;
	border-radius: 50%;
}

.diagnostic_Now_box:after {
	content: "";
	position: absolute;
	left: -24px;
	width: 20px;
	height: 18px;
	bottom: 3px;
	background: #fff0c6;
	border-radius: 50%;
}
.diagnostic_Now_box p {
	margin: 0; 
	padding: 0;
}

/* [はい]、[いいえ]ボタングループ */
.diagnostic_Now_Button
{
	display:flex;
}

.diagnostic_Now_Button input
{
	font-family:"Roboto","游ゴシック体", "Yu Gothic", "Hiragino Kaku Gothic Pro", "Meiryo", sans-serif;
	width:250px;
	margin-left:40px;
}

/*[はい]ボタン */
.diagnostic_Now_YesButton {
  padding: 0.75em 2em;
  text-align: center;
  text-decoration: none;
  color: blue;
  border: 2px solid blue;
  font-size: 24px;
  display: inline-block;
  border-radius: 0.3em;
  transition: all 0.2s ease-in-out;
  position: relative;
  overflow: hidden;
}

.diagnostic_Now_YesButton:hover {
    background-color: blue;
    color: #fff;
    border-bottom: 4px solid darken(blue, 10%);
}

/*[いいえ]ボタン */
.diagnostic_Now_NoButton {
  padding: 0.75em 2em;
  text-align: center;
  text-decoration: none;
  color: blue;
  border: 2px solid blue;
  font-size: 24px;
  display: inline-block;
  border-radius: 0.3em;
  transition: all 0.2s ease-in-out;
  position: relative;
  overflow: hidden;
}

.diagnostic_Now_NoButton:hover {
    background-color: blue;
    color: #fff;
    border-bottom: 4px solid darken(blue, 10%);
}

/********************************************************/
/*	適正診断結果ページ									*/
/********************************************************/

/*見出し */
.diagnostic_Result_title {
	position: relative;
	color: #158b2b;
	font-size: 30px;
	padding: 10px 0;
	text-align: center;
	margin:0;
	margin-top:10px;
	font-family:"Roboto","游ゴシック体", "Yu Gothic", "Hiragino Kaku Gothic Pro", "Meiryo", sans-serif;
}

.diagnostic_Result_title:before {
	content: "";
	position: absolute;
	top: 0px;
	left: 50%;
	width: 150px;
	height: 58px;
	border-radius: 50%;
	border: 5px solid #a6ddb0;
	border-left-color: transparent;
	border-right-color: transparent;
	-webkit-transform: translateX(-50%);
	transform: translateX(-50%);
}

/* 適正部分の枠線 */
#dit_Resutl_Aptitude{
	text-align: center;
	font-size:40px;
	font-family:"Roboto","游ゴシック体", "Yu Gothic", "Hiragino Kaku Gothic Pro", "Meiryo", sans-serif;
}

.diagnostic_Result_box_Aptitude {
    position: relative;
    padding:0.25em 1em;
}
.diagnostic_Result_box_Aptitude{
    margin:2em 0;
    position: relative;
    padding: 0.5em 1.5em;
    border-top: solid 2px black;
    border-bottom: solid 2px black;
}
.diagnostic_Result_box_Aptitude:before, .diagnostic_Result_box_Aptitude:after{
    content: '';
    position: absolute;
    top: -10px;
    width: 2px;
    height: -webkit-calc(100% + 20px);
    height: calc(100% + 20px);
    background-color: black;
}
.diagnostic_Result_box_Aptitude:before {left: 10px;}
.diagnostic_Result_box_Aptitude:after {right: 10px;}
.diagnostic_Result_box_Aptitude p {
    margin: 0; 
    padding: 0;
}

/* レイアウト */
.diagnostic_Result_layout_tbl
{
	border-collapse: separate;
	border-spacing: 10px 0px;
}

.diagnostic_Result_layout_tbl td
{
	height:80%;
}

/* 画像 */
#diagnostic_Result_pic{
	width:800px;
	height:450px;
 	margin-left: 0;
 	margin-right: 0;
 	/* border: 1px black dashed;*/
}

/* 説明部分の枠線 */
.diagnostic_Result_Explanation_cell{
	text-align: left;
	vertical-align: top;
}

.diagnostic_Result_box_Explanation {
	height:100%;
	min-height:100px;
	max-width:700px;
	min-width:100px;
    position: relative;
    margin-left:40px;
    padding: 0.5em 1em;
    border: solid 3px #62c1ce;
}
.diagnostic_Result_box_Explanation .diagnostic_Result_box_Explanation-title {
    position: absolute;
    display: inline-block;
    top: -27px;
    left: -3px;
    padding: 0 9px;
    height: 25px;
    line-height: 25px;
    font-size: 17px;
    background: #62c1ce;
    color: #ffffff;
    font-weight: bold;
    border-radius: 5px 5px 0 0;
}
.diagnostic_Result_box_Explanation p {
    margin: 0; 
    padding: 0;
}

/*[閉じる]ボタン */
.diagnostic_Result_CloseButton_cell{
	text-align: center;
	vertical-align: middle;
}

.diagnostic_Result_CloseButton {
  padding: 0.75em 2em;
  text-align: center;
  text-decoration: none;
  color: blue;
  border: 2px solid blue;
  font-size: 24px;
  display: inline-block;
  border-radius: 0.3em;
  transition: all 0.2s ease-in-out;
  position: relative;
  overflow: hidden;
}

.diagnostic_Result_CloseButton:hover {
    background-color: blue;
    color: #fff;
    border-bottom: 4px solid darken(blue, 10%);
}

/*全体のフェードイン */
.diagnostic_Result_fade{
    /* (1) アニメーション名
       (2) 1回のアニメーションにかかる時間
       (3) アニメーションの変化率（ ease、linear、ease-out、ease-in-outなど)
       (4) アニメーションの開始を遅らせる時間(1s＝1秒)
       (5) アニメーションを何回繰り返すか
       (6) 繰り返し時、往復処理をするか(normal, reverse, alternate, alternate-reverseなど)
   	*/
	animation: fadein 5.0s ease 0s 1 normal;
}

@keyframes fadein {

  0% {opacity: 0} /*アニメーション開始時は不透明度0%*/
  100% {opacity: 1} /*アニメーション終了時は不透明度100%*/

}