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



/* ---------------------------------------------------------------- *
	デザインタイプBの設定です
 * ---------------------------------------------------------------- */


#contents-title {
	font-family: 'Noto Sans Japanese', sans-serif;
  font-weight: 700;
	padding: 10px;
	line-height: 140%;
	color: #000;
	-webkit-text-shadow: 0px 1px 0px #fff;
	text-shadow: 0px 1px 0px #fff;
	border-top: none;
	margin-bottom: 10px;
	background-image: url(../recruit/img/c_title.gif);
	background-repeat: repeat-x;
	background-position: bottom;
}



section {
	margin-top:1em;
	margin-bottom:2em;
	}
	
/* ~~ テーブルのキャプションの設定 ~~ */
/* ~~ キャプションは<table> <caption>×××</caption>と入れます 　~~ */
caption {
	font-size: x-small;
	text-align: right;}


@media screen and (max-width:768px){
 
caption {
    display:block;
  }
}


/* ~~ テーブルの基本設定 ~~ */
table {
  width:100%;
  table-layout:fixed;
  -webkit-box-sizing:border-box;
  box-sizing:border-box;
  border:1px solid #cfcfcf;
}
table caption {
  padding:1em;
  line-height: 1.5;
  text-align: left;
  background:#E6F0F0;
}

table tr th {
  background:#E3F2E6;
	font-weight: bold;
	width:25%;
}

table tr th,
table tr td {
  padding:1em;
  line-height: 1.5;
  text-align:left;
  border:1px solid #cfcfcf;
}



 /* パターン1： レスポンシブテーブルの設定 ~~ */
@media screen and (max-width:768px){
 
.pattern01 table,
.pattern01 table caption,
.pattern01 table thead,
.pattern01 table tbody,
.pattern01 table tr,
.pattern01 table tr th,
.pattern01 table tr td {
    display:block;
  }
.pattern01 table tr th,
.pattern01 table tr td {
    margin:-1px; /* borderが二重になるのを防ぐ */
  }
 
/* ENDパターン1： レスポンシブテーブルの設定 */ }



/* パターン2： レスポンシブテーブルの設定 ~~ */

.pattern02 table thead th{
	background:#e6e6e6;
	font-weight: bold;
}

@media only screen and (max-width:768px){
.pattern02 table{
		display: block;
	}
.pattern02 table thead{
			display: none;
		}
.pattern02 table tbody tr th {
  padding:1em;
  line-height: 1.5;
  text-align:left;
  border:1px solid #cfcfcf;
}

.pattern02 table tbody tr td {
  padding:1em;
  line-height: 1.5;
  text-align:left;
  border: none;
}

		
.pattern02 table tbody{
			display: block;
		}
		
.pattern02 table tbody tr{
				display: block;
				margin-bottom: 1.5em;
			}
.pattern02 table tbody th,
.pattern02 table tbody td{
				display: list-item;
				list-style:none;
			}
.pattern02 table tbody th{
				margin-bottom: 5px;
				list-style-type: none;
  background:#E3F2E6;
			}
.pattern02 table tbody td{
				margin-left: 20px;
				padding: 0;
			}
			
.pattern02 table tbody td:nth-of-type(1):before { content: "[ヘッダー1]　"; font-weight:bold; }
.pattern02 table tbody td:nth-of-type(2):before { content: "[ヘッダー2]　"; font-weight:bold; }
.pattern02 table tbody td:nth-of-type(3):before { content: "[ヘッダー3]　"; font-weight:bold; }
}
 
/* ENDパターン2： レスポンシブテーブルの設定 */ }

