@charset "utf-8";


/* =================================================================
    
   TOPページ　.top

   ================================================================= */
   
.content-box{
	padding:0;
}
h1{
	margin:64px 0 32px;
}
.merit_01 h2,.merit_02 h2,.merit_03 h2{
	padding:0px 12px;
	width:auto;
	margin:auto;
	text-align:center;
}
.top h2 span{
	display:inline-block;
	margin-right:16px;
	padding:40px 12px;
	border-radius:56px;
	background:#003489;
	color:#fec200;
	font-size:24px;
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-weight:100;
	line-height:1em;
	letter-spacing:0.1em;
}
.top h2{
	/*font-size:32px;
	font-family :"Times New Roman", "游明朝", YuMincho,"ヒラギノ明朝 Pr6 W6","Hiragino Mincho Pro", "HGS明朝E","メイリオ", "ＭＳ Ｐ明朝","MS PMincho",Meiryo, serif;
	font-weight:300;*/
	margin-top:30px;
}

/* ----------  メインイメージ（.top-main）  ---------- */ 
  
.top-image .box{
	background:url(../img/top/main-chach-img.png) no-repeat right;
}
.top-image h3{
	margin-top:32px;
	color:#003489;
	font-size:21px;
	font-weight:700;
}
.top-image h3 img{
	float:left;
}
.top-image h3 p{
	margin-top:40px;
}
.top-image h3 storong{
	color:#fff;
	font-size:40px;
	font-family :"Times New Roman", "游明朝", YuMincho,"ヒラギノ明朝 Pr6 W6","Hiragino Mincho Pro", "HGS明朝E","メイリオ", "ＭＳ Ｐ明朝","MS PMincho",Meiryo, serif;
	font-weight:300;
 	text-shadow: 1px 4px 7px rgba(0,0,0,0.5);
	letter-spacing:0.1em;
	line-height:1.2em;
	display:inline-block;
}
.top-image .box p span a{
	background:#003489;
	padding:2px 8px;
	color:#fec200;
	border-radius:16px;
	font-size:14px;
	letter-spacing:0.2em;
}
.top-image .box p span a:hover{
	background:#fec200;
	color:#003489;
}

/* ----------  健康面（.merit_01）  ---------- */ 

.merit_01 .box, .merit_02 .box{
	padding:56px 0;
}
.merit_01{
	  background:#fff;
	  padding-bottom:80px;
}
.merit_01-bg{
	background:url(../img/top/merit_01-bg.png);
	height:450px;
}
.merit_01-detail li{
	float:left;
	text-align:left;
	font-size:14px;
	position:relative;
}
.merit_01-detail li:first-child{
	width:306px;
	padding:32px;
	background:#fff;
	border:#999 8px solid;
	border-radius:8px;
	z-index:9990;
}
.merit_01-detail li:nth-child(2){	
	width:105px;
	margin-top:100px;
	z-index:9989;
}
.merit_01-detail li:last-child{
	float:right;
	width:450px;
	margin-left:-45px;
	padding:32px;
	background:#fff;
	border:#999 8px solid;
	border-radius:8px;
	z-index:9988;	
}


/* ----------  労務面（.merit_02）  ---------- */ 

.merit_02-bg {
	height:100%;
	background:#eefaff;
	background-attachment: fixed;
	-webkit-background-size: cover;
	background-size: cover;
	background-position: center center;
	overflow: hidden;
	position: relative;
}
.merit_02-bg:before {
	  content: "";
	  position: absolute;
	  height: 100%;
	  width: 300%;
	  background:url(../img/top/merit_02-bg.png);
	  bottom: -450px;
	  left: -100%;
	  -webkit-transform: rotate(-30deg);
	  -ms-transform: rotate(-30deg);
	  -o-transform: rotate(-30deg);
	  transform: rotate(-30deg);
}
.merit_02-detail{
	width:900px;
	margin:30px auto 0;
	display:block;
}
.merit_02-detail li{
	text-align:left;
	font-size:14px;
	position:relative;
	float:left;
}
.merit_02-detail li:first-child{
	width:236px;
	height:236px;
	padding:62px;
	display:table-cell;
	background:#fff;
	border-radius:180px;
	z-index:9979;
}
.merit_02-detail li:nth-child(2){
	float:left;
	margin-left:-50px;
	z-index:9980;
}
.merit_02-detail li:last-child{
	width:236px;
	height:236px;
	padding:62px;
	background:#fff;
	border-radius:180px;
	margin-left:-50px;
	z-index:9979;
	
}


/* ----------  経営面（.merit_03）  ---------- */ 

.merit_03 .box{
	padding-top:80px;
}
.top .merit_03{
	height:800px;
}
.merit_03-bg {
	  height:100%;
	  background:#ccf1ff;
	  background-attachment: fixed;
	  -webkit-background-size: cover;
	  background-size: cover;
	  background-position: center center;
	  overflow: hidden;
	  position: relative;
	  z-index:9960;
}
.merit_03-bg:before {
	  content: "";
	  position: absolute;
	  height: 50%;
	  width: 100%;
	  background:url(../img/top/merit_03-bg.png);
	  bottom: 0;
	  left:0;
}
.merit_03 h5{
	font-size:21px;
	padding-top:24px;
}
.merit_03-detail{
	background:#fff;
	z-index:9961;
	position: relative;
	margin-top:40px;
	padding:40px 40px 24px;
}
.merit_03-detail ul.inline li{
	margin-top:16px;
	vertical-align:text-top;
	text-align:center;
}
.merit_03-detail li{
	margin-bottom:8px;
	text-align:left;
	font-size:12px;
	position:relative;
	display:inline-block;
}

.merit_03-detail>li:first-child{
	margin-top:24px;
	width:207px;
	float:left;
}
.merit_03-detail>li:nth-child(2){
	text-align:center;
	margin-left:53px;
}
.merit_03-detail>li:nth-child(3){
	width:207px;
	float:right;
	margin-right:53px;
}
.merit_03-detail>li:nth-child(4){
	display:none;
}
.merit_03-detail li:first-child li:first-child{
	width:207px;
	background:url(../img/top/merit_03-detail-bg01.png) no-repeat;
	height:48px;
	padding:8px 41px 16px 12px;
}
.merit_03-detail li:first-child li:nth-child(2){
	width:207px;
	background:url(../img/top/merit_03-detail-bg02.png) no-repeat;
	height:29px;
	padding:8px 41px 16px 12px;
}
.merit_03-detail li:first-child li:nth-child(3){
	width:207px;
	background:url(../img/top/merit_03-detail-bg03.png) no-repeat;
	height:29px;
	padding:8px 41px 16px 12px;
}
.merit_03-detail li:first-child li:nth-child(4){
	width:207px;
	background:url(../img/top/merit_03-detail-bg04.png) no-repeat;
	height:29px;
	padding:8px 41px 16px 12px;
}
.merit_03-detail>li:nth-child(3) li:first-child{
	width:207px;
	background:url(../img/top/merit_03-detail-bg05.png) no-repeat;
	height:29px;
	margin-top:56px;
	padding:8px 12px 16px 41px;
}
.merit_03-detail>li:nth-child(3) li:nth-child(2){
	width:207px;
	background:url(../img/top/merit_03-detail-bg06.png) no-repeat;
	height:48px;
	padding:8px 12px 16px 41px;
}
.merit_03-detail>li:nth-child(3) li:nth-child(3){
	width:207px;
	background:url(../img/top/merit_03-detail-bg07.png) no-repeat;
	height:29px;
	padding:8px 12px 16px 41px;
}




/* ----------  Dr.Thomas　８つのプログラム（.merit_04）  ---------- */

.merit_04 .box{
	padding:80px 0;
}
.merit_04-bg {
	  background:#ccc;
}
.merit_04 ul.program li{
	float:left;
	display:table;
	margin:8px 8px 0 0;
	background:#fff;
	border:#ccc 1px solid;
}
.merit_04 ul.program li:nth-child(4),.merit_04 ul.program li:nth-child(8){
	margin:8px 0 0 0;
}
.merit_04 ul.program li .list04-box{
	display:table-cell;
	width:204px;
	height:134px;
	padding:16px;
	color:#003489;
	text-align:center;
	vertical-align:middle;
}
/*.merit_04 ul.program li a:hover{
	color:#fec200;
}*/
.merit_04 ul.program li:nth-child(1) .list04-box{
	background:url(../img/top/program01.png) no-repeat center;
	background-size:auto;
}
.merit_04 ul.program li:nth-child(2) .list04-box{
	background:url(../img/top/program02.png) no-repeat center;
	background-size:auto;
}
.merit_04 ul.program li:nth-child(3) .list04-box{
	background:url(../img/top/program03.png) no-repeat center;
	background-size:auto;
}
.merit_04 ul.program li:nth-child(4) .list04-box{
	background:url(../img/top/program04.png) no-repeat center;
	background-size:auto;
}
.merit_04 ul.program li:nth-child(5) .list04-box{
	background:url(../img/top/program06.png) no-repeat center;
	background-size:auto;
}
.merit_04 ul.program li:nth-child(6) .list04-box{
	background:url(../img/top/program07.png) no-repeat center;
	background-size:auto;
}
.merit_04 ul.program li:nth-child(7) .list04-box{
	background:url(../img/top/program08.png) no-repeat center;
	background-size:auto;
}
.merit_04 ul.program li:nth-child(8) .list04-box{
	background:url(../img/top/program05.png) no-repeat center;
	background-size:auto;
}


/* ----------  安心の実績  ---------- */

.merit_05 .box{
	padding:56px 0 0 0;
}
.merit_05{
	padding-bottom:56px;
	background:#fff;
}


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

   メディアクエリー

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

@media only screen and (max-width: 960px) {
	.merit_01 h2,.merit_02 h2,.merit_03 h2{
	padding:0px;
	}
	.top h2 span{
		display:inline-block;
		margin-right:0;
	}
	.top h2{
		margin-top:0;
	}
	
	/* ----------  メインイメージ（.top-main）  ---------- */ 
	
	.top-image .box{
		background:none;
		text-align:left;
	}
	
	.top-image img{
		max-width:70%;
	}
	h1{
		width:100%;
		margin:32px 0;
		font-size:19px;
		text-align:center;
	}
	.top-image .box h1 img.pc-none{
		max-width:80%;
		margin:-10% auto -20%;
	}
	.top-image ul.inline{
		display:block;
		text-align:center;
	}
	.top-image ul.inline li{
		width:40%;
		margin:0 1%;
	}
	.top-image ul.inline li a{
		margin:0;
	}  
	.top-image h3{
		font-size:16px;
		text-align:center;
	}
	.top-image h3 img{
		float:none;
	}
	.top-image h3 p{
	margin-top:0px;
}
	.top-image h3 storong{
		font-size:32px;
		font-weight:700;
		letter-spacing:0;
}
	
	
	/* ----------  健康面（.merit_01）  ---------- */
	
	.merit_01{
		display:block;
		height:100%;
		padding-bottom:0;
	}
	.merit_01-bg{
		height:auto;
	}
	.merit_01 ul.inline{
		display:block;
		text-align:center;
	}
	.merit_01 ul.inline li{
		width:40%;
		margin:0 1%;
	}
	.merit_01 ul.inline li a{
		margin:0;
	}
	.merit_01-detail li{
		float:none;
		text-align:center;
	}
	.merit_01-detail li:first-child{
		width:100%;
		margin:auto;
		padding:16px;
		box-sizing:border-box;
	}
	.merit_01-detail li:nth-child(2){
		width:auto;
		display:inline-block;
		margin-top:0px;
		-webkit-transform: rotate(90deg);
		-ms-transform: rotate(90deg);
		-o-transform: rotate(90deg);
		transform: rotate(90deg);
	}
	.merit_01-detail li:last-child{
		width:100%;
		margin:-20px auto 0;
		padding:16px;
		box-sizing:border-box;
	} 
	
	
	/* ----------  労務面（.merit_02）  ---------- */
	
	.merit_02 ul.inline{
		display:block;
		text-align:center;
	}
	.merit_02 ul.inline li{
		width:40%;
		margin:0 1%;
	}
	.merit_02 ul.inline li a{
		margin:0;
	}
	.merit_02-detail{
		width:100%;
		margin:20px 0 0;
		text-align:center;
	}
	.merit_02-detail li{
		font-size:14px;
		float:none;
		text-align:center;
	}
	.merit_02-detail li:first-child,.merit_02-detail li:last-child{
		width:80%;
		height:auto;
		margin:10px auto;
		padding:32px;
		display:block;
		border-radius:180px;
	}
	.merit_02-detail li img{
		max-width:75%;
		margin:8px auto;
	}
	
	/* ----------  経営面（.merit_03）  ---------- */ 
	
	.top .merit_03{
		height:auto;
	}
	.merit_03 ul.inline{
		display:block;
		text-align:center;
	}
	.merit_03 ul.inline li{
		width:40%;
		margin:0 1%;
	}
	.merit_03 ul.inline li a{
		margin:0;
	}
	.merit_03-bg {
		padding-bottom:56px;
	}
	.merit_03 h5{
		font-size:19px;
	}
	.merit_03-detail li{
		margin-bottom:8px;
		text-align:left;
		font-size:12px;
		position:relative;
		display:inline-block;
	}
	.merit_03-detail>li:first-child li:before,.merit_03-detail>li:nth-child(3) li:before{
		width:20px;
		display:inline-block;
		content:"?";
		color:#fff;
		font-weight:700;
		background:#003489;
		text-align:center;
		margin-right:8px;
		border-radius:30px;
	}
	.merit_03-detail>li:first-child{
		margin-top:0;
		width:100%;
		float:left;
		margin-bottom:0;
	}
	.merit_03-detail>li:nth-child(2){
		display:none;
	}
	.merit_03-detail>li:nth-child(4){
		text-align:center;
		margin:20px 0;
		display:inline-block;
	}
	.merit_03-detail>li:nth-child(3){
		margin-top:0;
		width:100%;
		float:left;
	}
	.merit_03-detail>li:nth-child(2) li,.merit_03-detail>li:nth-child(4) li{
		max-width:21%;
	}
	.merit_03-detail ul.inline li{
		margin-top:16px;
		font-size:10px;
		vertical-align:text-top;
		text-align:center;
	}
	.merit_03-detail li li{
		border-radius:8px;
		box-sizing:border-box;
	}
	.merit_03-detail>li:last-child{
		width:100%;
		float:none;
		margin-right:0;
	}
	.merit_03-detail li:first-child li:first-child{
		width:100%;
		height:auto;
		padding:8px;
		background:#fff;
		border:#9c27b0 4px solid;
	}
	.merit_03-detail li:first-child li:nth-child(2){
		width:100%;
		height:auto;
		padding:8px;
		background:#fff;
		border:#009688 4px solid;
	}
	.merit_03-detail li:first-child li:nth-child(3){
		width:100%;
		height:auto;
		padding:8px;
		background:#fff;
		border:#f44336 4px solid;
	}
	.merit_03-detail li:first-child li:nth-child(4){
		width:100%;
		height:auto;
		padding:8px;
		background:#fff;
		border:#9e9e9e 4px solid;
	}
	.merit_03-detail>li:nth-child(3) li:first-child{
		width:100%;
		height:auto;
		margin-top:0;
		padding:8px;
		background:#fff;
		border:#4caf50 4px solid;
	}
	.merit_03-detail>li:nth-child(3) li:nth-child(2){
		width:100%;
		height:auto;
		padding:8px;
		background:#fff;
		border:#ff9800 4px solid;
	}
	.merit_03-detail>li:nth-child(3) li:nth-child(3){
		width:100%;
		height:auto;
		padding:8px;
		background:#fff;
		border:#00bcd4 4px solid;
	}
	
	
	/* ----------  Dr.Thomas　８つのプログラム（.merit_04）  ---------- */ 
	
	.merit_04 ul.inline{
		display:block;
		text-align:center;
	}
	.merit_04 ul.inline li{
		width:40%;
		margin:0 1%;
	}
	.merit_04 ul.inline li a{
		margin:0;
	}
	.merit_04 ul.program{
		width:100%;
	}
	.merit_04 ul.program li{
		width:50%;
		box-sizing:border-box;
		margin:0;
		border:#ccc 4px solid;
	}
	.merit_04 ul.program li:nth-child(4),.merit_04 ul.program li:nth-child(8){
		margin:0;
	}
	.merit_04 ul.program li .list04-box{
		width:90%;
	}
}