@charset "utf-8";

/* トップページ：デザインスタイル
 * **************************************************
  * mainImg [ メイン画像 ]  
 * troubleshooting [ こんなとき ]  
 * recommend [ 健康おすすめ情報 ] 
 * **************************************************
 */
 
 /* ======================================
　mainImg [ メイン画像 ]
====================================== */
/* Media Queries 切替 */
@media all and (max-width: 480px) {
	section div.mainTitle {
		background:#ffffff;
		border: none;	
	}
	div.mainImg {
		display:block;
		text-align:center;
	}
	div.mainImg img {
		height:auto;
		width:200px;
	}
	 
}

/* Media Queries 切替 */
@media all and (min-width: 481px) {
	#index {
	background-repeat:	repeat;
	background-position: center top;
	}
	
	section div.mainTitle {
		margin:0 auto;
		width:800px;
	}
	div.mainImg {
		display:none;
	}
}


 /* ======================================
　Img [ その他の画像 ]
====================================== */
/* Media Queries 切替 */
@media all and (max-width: 480px) {
	section div.mainTitle h1 {
		text-align:center;
		padding:20px 0;
	}
	section div.mainTitle h1 img {
		height:auto;
		width: 90%;
		max-width: 90%; 
	}
	section.service div.btnDetail img {
		height: auto;
		/*width: 80%;*/
	}
	section p.ilC,
	section div.zuR,
	section p.il,
	section div.mainTitle div.headerImage {
		text-align:center;
	}
	section p.ilPdca img {
		height:auto;
		width: 50%;
		max-width: 50%; 
	}
	section p.imgSize img {
		width: 98%;
	}
	section div.zuR img,
	section div.mainTitle div.headerImage img,
	section p.imgSize2 img {
		width: 70%;
	}
	
}

/* Media Queries 切替 */
@media all and (min-width: 481px) {
	section p.ilC {
		text-align:center;
	}
	
	section div.mainTitle div.headerImage img {
		display: none;
	}
	section p.il {
		text-align:center;
	}
}



section p {
	text-align:left;
}


section p {
	margin: 5px 2%;
}

section div.columns {
	width: 98%;
	margin: 0 auto;
}

section div.dial {
	width: 98%;
	margin: 0 auto;
	padding:5px;
	background: #FFF;
	border:#F97493 1px solid;
}

section div.boxSp {
	margin-bottom:20px;
}



@media all and (max-width: 480px) {
	section div.dhTyui {
		background-color: #E9F5FF;
		font-size: 85%;
		line-height:1.5em;
		margin: 20px 2%;
		padding: 10px;
		-webkit-border-radius: 10px;
		-moz-border-radius: 10px;
		border-radius: 10px;
	}
	section div.dhNagare {
		background-color: #fff;
		font-size: 100%;
		line-height:1.5em;
		margin: 20px 4%;
		padding: 10px;
		-webkit-border-radius: 5px;
		-moz-border-radius: 5px;
		border-radius: 5px;
		box-shadow: 1px 1px 5px #aaa;
	}
	div.mainArticle{
		font-size: 100%;
		width:100%;
		margin:20px 0 20px 0;
	}
	
	section div.mainTitle div.nendo::after {
		width:92%;
		margin: 0 2%;
		display: inline-block;
		content: attr(data-label);
		background: #0FB3C5;
		padding:2%;
		color:#ffffff;
		clear: both;
	}
	section div.mainTitle div.nendo img {
		display: none;
	}
	section div.dhNagare div.noTriangle::after {
		width:98%;
		display: inline-block;
		content: attr(data-label);
		padding:2px 5px;
		color:#ffffff;
		clear: both;
		margin: 2% 0;
	}
	section div.dhNagare div.noTriangle img {
		display: none;
	}
	section div.dhNagare div.plan div.planT::after {
		background: #659F00;
	}
	section div.dhNagare div.do div.doT::after {
		background: #4785B8;
	}
	section div.dhNagare div.check div.checkT::after {
		background: #A070B8;
	}
	section div.dhNagare div.act div.actT::after {
		background: #FF762B;
	}
	section h2 img {
		width: 100%;
		max-width: 100%;
	}
	section p {
		margin:2%;
	}
	section p img {
		width: 100%;
		max-width: 100%;
	}
	section div.btnDetail {
		width:100%;
		text-align:center;
		float: left;
		margin: 0 0 0 0;
	}
	section div.btnDetail img {
		margin: 0 25px;
	}
	
	section div.dial {
		width: 100%;
		margin:0 0 0 0;
		padding:0;
		background: #FFF;
		border:#F97493 1px solid;
		float:left;
	}
	section dl.fukidashi {
		margin:10px;
	}
	
	section dl.fukidashi dt {
		width:130px;
		float:left;
	}
	section dl.fukidashi dd {
		font-size:15px;
		padding-top:5px;
	}
	section p.telNo {
		clear:left;
	}
	
	section span.flee {
	}
	section dl.telNo {
		margin:0;
		padding:5px 10px 0 10px;
		clear:both;
	}
	section dl.telNo dt {
		
	}
	section dl.telNo span.number {
		color:#E64876;
		font-family:"Arial Black", Gadget, sans-serif;
		font-size:30px;
		line-height:45px;
	}
	section dl.telNo dd {
		padding:0 0 0 0;
	}
	
	section p.explanation {
		margin:0;
		padding:5px 10px 5px 10px;
		border-top:#F97493 1px dotted;
		clear:both;
	}
	section div.dial2 {
		width: 98%;
		margin:20px 0 0 0;
		padding:0;
		background: #FFF;
		border: none;
		float:left;
		text-align:center;
	}
	section div.dial2 p {
		color:#FFF;
		text-align:center;
		font-size:12pt;
		padding:3px;
		margin: 6px auto;
		-webkit-border-radius: 5px;
		-moz-border-radius: 5px;
		border-radius: 5px;
	}
	section div.dial2 p.family {
		width: 225px;
		background:#FF874C;
	}
	section div.dial2 p.mental {
		width: 225px;
		background:#7CC32A;
	}
	section div.dial2 p.doctor {
		width: 225px;
		background:#4AB3C1;
	}
	
	section div.dhNagare h4 {
		font-size: 100%;
		font-weight: bold ;
	}
	
	section div.dhNagare div.plan div h4 {
		color: #659F00;
	}
	section div.dhNagare div.do div h4 {
		color: #4785B8;
	}
	section div.dhNagare div.check div h4 {
		color: #A070B8;
	}
	section div.dhNagare div.act div h4 {
		color: #FF762B;
	}
	
	section div.dhNagare div.plan span {
		color: #659F00;
	}
	section div.dhNagare div.do span {
		color: #4785B8;
	}
}

/* Media Queries 切替 */
@media all and (min-width: 481px) {
	section div.mainTitle {
		position: relative;
	}
	section div.mainTitle div.nendo {
	z-index: 1;
	position: absolute;
	width: 100;
	height: 50;
	left: -55px;
	top: -55px;
	width: 292px;
	height: 186px;
	}
	div.mainArticle{
		font-size: 18px;
		width:100%;
		margin:20px 0 20px 0;
	}
	section {
		zoom: 1;
		margin: 0;
		padding: 0;
		overflow: hidden;
	}
	
	section h2 {
		display: inline;
		background:;
		padding:0;
		margin-bottom:1em;
		clear:none;
	}
	section h2 img {
		display: inline;
	}
	section div.btnDetail {
		width:735px;
		text-align: center;
		float: left;
		margin: 0 0 0 10px;
	}
	section div.btnDetail img {
		margin: 0 5px 0 5px;
	}
	
	section p {
		margin: 5px 0 10px 0;
		text-align:left;
	}
	section p.btn {
		text-align:center;
		padding:1em 0 3em 0;
	}

	section div.consultation {
		width: 420px;
	}
	
	section p.dataHealth {
		width:100%;
	}
	section div.zuR {
		width: 360px ;
		float: right ;
		text-align: right ;
	}

	section div.dhTyui {
		background-color: #E9F5FF;
		font-size: 85%;
		line-height:1.5em;
		margin: 20px 60px;
		padding: 10px 20px;
		-webkit-border-radius: 10px;
		-moz-border-radius: 10px;
		border-radius: 10px;
	}
	section div.detailBox {
		width:716px;
		border: 2px solid #EE6677;
		padding:30px 80px;
		margin: 0;
	}
	section div.columns {
		width: 735px;
		margin:0 0 0 10px;
		padding:0;
		float:left;
	}
	
	section div.dial {
		width: 713px;
		margin:0 0 0 0;
		padding:0;
		background: #FFF;
		border:#F97493 1px solid;
		float:left;
	}
	section div.dial2 {
		width: 713px;
		margin:20px 0 0 0;
		padding:0;
		background: #FFF;
		border:#F97493 1px solid;
		float:left;
		text-align:center;
	}
	section div.dial2 div.push {
		float:left;
		width:260px;
		text-align:center;
		padding:30px 0;
	}
	section div.dial2 div.soudanLeft {
		margin-left:90px;
	}
	
	section div.dial2 p {
		color:#FFF;
		text-align:center;
		font-size:12pt;
		padding:3px;
		margin: 6px auto;
		-webkit-border-radius: 5px;
		-moz-border-radius: 5px;
		border-radius: 5px;
	}
	section div.dial2 p.family {
		width: 225px;
		background:#FF874C;
	}
	section div.dial2 p.mental {
		width: 696px;
		background:#7CC32A;
	}
	section div.dial2 p.doctor {
		width: 225px;
		background:#4AB3C1;
	}
	section dl.fukidashi {
		margin:10px;
	}
	
	section dl.fukidashi dt {
		width:130px;
		float:left;
	}
	section dl.fukidashi dd {
		float:left;
		font-size:15px;
		padding-top:5px;
	}
	section p.telNo {
		clear:left;
	}
	section div.il01 {
		position: relative;
	}
	section span.flee {
	}
	section dl.telNo {
		margin:0;
		padding:5px 10px 0 10px;
		clear:both;
	}
	section dl.telNo dt {
		float:left;
	}
	section dl.telNo span.number {
		color:#E64876;
		font-family:"Arial Black", Gadget, sans-serif;
		font-size:45px;
		line-height:45px;
	}
	section dl.telNo dd {
		padding:20px 0 0 0;
	}
	
	section p.explanation {
		margin:0;
		padding:5px 10px 5px 10px;
		border-top:#F97493 1px dotted;
		clear:both;
	}

	
}