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

/* 共通 */
/* --------------------------------------------------- */
* {box-sizing: border-box;}
body {
	width: 100%;
	min-height: 900px;
	font-family: "メイリオ", Meiryo, Osaka, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-weight: normal;
	background-image: url(../img/top_header_back.png);
	background-repeat: repeat-x;
	background-position: left top;
}
/* --------------------------------------------------- */


/* header */
/* --------------------------------------------------- */
#header {
	position: fixed;
	width: 100%;
	height: 146px;
	padding-left:146px;
	background-image: url(../img/top_header_logo.png);
	background-repeat: no-repeat;
	background-position: left top;
}
#header h1 {
	font-size: 38px;
	font-weight: normal;
	color: #2da775;
	padding-top: 22px;
}
#header p {
	font-size: 20px;
	font-weight: normal;
	color: #221814;
	line-height: 150%;
}
#header h2 {
	font-size: 38px;
	font-weight: normal;
	color: #2da775;
}
#slid {
	position: fixed;
	left: 0px;
	top: 146px;
	width: 100%;
	min-width: 1900px;
	height: 550px;
}
#slid img {
	position: fixed;
	left: 47px;
	top: 15%;
}
/* --------------------------------------------------- */


/* article */
/* --------------------------------------------------- */
#contents {
	float: left;
	position: absolute;
	top: 28%;
	z-index: 99;
}
#contents section {
	float: left;
	margin-right: 10px;
}
#menu {
	width: 700px;
	height: 226px;
	margin-bottom: 10px;
}
#menu #name {
	float: left;
	width: 219px;
	height: 227px;
	text-align: center;
	background: #ffffff;
	background: -moz-linear-gradient(top,  #ffffff 0%, #20a677 40%, #20a677 100%);
	background: -webkit-linear-gradient(top,  #ffffff 0%,#20a677 40%,#20a677 100%);
	background: linear-gradient(to bottom,  #ffffff 0%,#20a677 40%,#20a677 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#20a677',GradientType=0 );
}
#menu #name img {
	width: 50%;
}
#menu #name h1 {
	font-size: 30px;
	font-weight: normal;
	color: white;
	line-height: 100%;
	margin-top: -10px;
}
#menu #name p {
	font-size: 13px;
	color: white;
	line-height: 130%;
}
#menu #name .tel2 {font-size: 21px;}
#menu ul {
	float: left;
	width: 481px;
	height: 226px;
	border-top: solid 1px #b4b5b5;
	border-left: solid 1px #b4b5b5;
	background-color: white;
}
#menu ul li {
	float: left;
	width: 120px;
	height: 113px;
	border-right: solid 1px #b4b5b5;
	border-bottom: solid 1px #b4b5b5;
}
#menu ul li a {
	display: table-cell;
	vertical-align: bottom;
	width: 120px;
	height: 108px;
	font-size: 15px;
	color: #2da775;
	text-align: center;
	text-decoration: none;
	line-height: 100%;
}
#menu ul li a span {font-size: 7.5px;}

#menu ul li a.btn1,
#menu ul li a.btn2,
#menu ul li a.btn3,
#menu ul li a.btn4,
#menu ul li a.btn5,
#menu ul li a.btn6,
#menu ul li a.btn7,
#menu ul li a.btn8 {
	background-size: 80%;
	background-repeat: no-repeat;
	background-position: center -5px;
}
#menu ul li a.btn1 {background-image: url(../img/header-nav_btn1.png);}
#menu ul li a.btn2 {background-image: url(../img/header-nav_btn2.png);}
#menu ul li a.btn3 {background-image: url(../img/header-nav_btn3.png);}
#menu ul li a.btn4 {background-image: url(../img/header-nav_btn4.png);}
#menu ul li a.btn5 {background-image: url(../img/header-nav_btn5.png);}
#menu ul li a.btn6 {background-image: url(../img/header-nav_btn6.png);}
#menu ul li a.btn7 {background-image: url(../img/header-nav_btn7.png);}
#menu ul li a.btn8 {background-image: url(../img/header-nav_btn8.png);}
#menu ul li a:hover {
	filter: alpha(opacity=50);
	-moz-opacity:0.5;
	opacity:0.5;
}
#news {
	float: left;
	width: 700px;
	padding: 10px 10px 0;
	margin-bottom: 10px;
	background-color: white;
}
#news h2 {
	width: 680px;
	font-family: "メイリオ", Meiryo, Osaka, sans-serif;
	font-size: 20px;
	font-weight: 100;
	color: #2da775;
	padding-bottom: 2px;
	margin-bottom: 10px;
	border-bottom: solid 1px #2da775;
}
#news ul {
	width: 100%;
	height: 100px;
	font-size: 13px;
	font-weight: 100;
	color: #888889;
	overflow: auto;
	padding: 10px;
	border: solid 1px #b4b5b5;
}
#news ul li span {
	display: inline-block;
	float: left;
	width: 9em;
	margin-bottom: 10px;
}
#news ul li a {
	display: inline-block;
	float: left;
	width: 40em;
	color: #888889;
	text-decoration: none;
	margin-bottom: 10px;
}
#news ul li a:hover {
	color: #00f;
	text-decoration: underline;
}
#kyuujitsu {
	width: 335px;
	padding: 15px;
	margin-bottom: 10px;
	background-color: white;
}
#kyuujitsu table {
	width: 100%;
	margin-bottom: 6px;
}
#kyuujitsu table caption {
	font-size: 17px;
	color: #2da775;
	margin-bottom: 4px;
}
#kyuujitsu table th {
	font-size: 13px;
	color: #595757;
	text-align: center;
	padding: 5px;
	border: solid 1px #888889;
	background-color: #acd3b8;
}
#kyuujitsu table td {
	font-size: 18px;
	color: #595757;
	text-align: center;
	vertical-align: middle;
	padding: 2px;
	border: solid 1px #888889;
}
#kyuujitsu table td p {font-size: 13px;}
#kyuujitsu > p {
	font-size: 12px;
	color: #717071;
	line-height: 120%;
	margin-bottom: 15px;
}
#kyuujitsu > p:last-child {
	margin-bottom: 0;
}
#map {
	float: left;
	width: 335px;
	padding: 15px;
	background-color: white;
}
#map h2 {
	font-size: 17px;
	font-weight: normal;
	color: #2da775;
	margin-bottom: 5px;
}
#map p {
	font-size: 12px;
	color: #00a0e8;
	margin-top: 5px;
}
.doctor {
	width: 315px;
	height: 170px;
	padding: 15px;
	margin-bottom: 10px;
	border: solid 1px #b4b5b5;
	background-color: #FFF;
}
.doctor img {
	float: left;
	height: 140px;
	margin-right: 10px;
}
.doctor h2 {
	font-size: 13px;
	font-weight: normal;
	color: #2da775;
}
.doctor p {
	font-size: 11px;
	color: #221814;
	line-height: 150%;
	margin-top: 4px;
}
.doctor .fullname {
	font-size: 13px;
}
.doctor .fullname span {
	font-size: 10px;
}
#topics {width: 470px;}
#topics #topicstitle {
	float: left;
	width: 230px;
	height: 104px;
	margin: 0 10px 10px 0;
	background-color: #00a0e8;
	background-image: url(../img/top_article_topics.png);
	background-repeat: no-repeat;
	background-position: 35px 10px;
}
#topics #topicstitle h2 {
	font-size: 26px;
	font-weight: normal;
	color: #fefefe;
	text-align: center;
	line-height: 80%;
	padding: 34px 0 0 70px;
}
#topics #topicstitle h2 span {font-size: 12px;}
.topicsbox {width: 470px;}
.topics {
	float: left;
	width: 230px;
	height: 104px;
	padding: 10px;
	margin-right: 10px;
	margin-bottom: 10px;
	border: solid 1px #b4b5b5;
	background-color: #fefefe;
}
.topics:nth-child(2n) {margin-right: 0;}
.topics h3 {
	font-size: 13px;
	font-weight: normal;
	color: #00a0e8;
	margin-bottom: 4px;
}
.topics p {
	font-size: 12px;
	color: #717071;
	line-height: 120%;
}
.btn01,
.btn02 {
	float: left;
	font-size: 12px;
	color: #FFF;
	text-decoration: none;
	padding: 2px 5px 1px;
	margin-top: 4px;
}
.btn01 {background-color: #888889;}
.btn02 {background-color: #00a0e8;}
.btn01:hover,
.btn02:hover {opacity: 0.5;}
.slider {
	float: left;
	width: 100%;
	border-right: solid 8px #00a0e8;
	border-left: solid 8px #00a0e8;
}
.slider img{
  border: 0px;
  margin-right: 5px;
}


/* --------------------------------------------------- */


/* footer */
/* --------------------------------------------------- */
footer {
	float: left;
	position: fixed;
	bottom: 0px;
	width: 100%;
	min-width: 1900px;
	z-index: 0;
}
footer #illustmap {
	position: fixed;
	left: 20px;
	bottom: 37px;
	width: 30%;
	max-width: 470px;
}
footer:hover {
	z-index: 100;
}
footer #illustmap img {
	float: left;
	width: 95%;
}
footer #illustmap p {
	position: fixed;
	left: 20px;
	bottom: 40px;
	font-size: 18px;
	color: #2da775;
}
#footer {
	float: left;
	position: absolute;
	bottom: 0px;
	width: 100%;
	padding: 10px 0px 10px 20px;
	margin-top: 12px;
	border-top: 1px solid #9f9fa0;
	background-color: white;
}
#footer p small {font-size: 12px;}
/* --------------------------------------------------- */


/* banner */
/* --------------------------------------------------- */
#banner {
	position: fixed;
	right: 10px;
	bottom: 49px;
	z-index: 100;
}
.purpleback,
.greenback,
.orangeback,
.blueback {
	float: left;
	width: 200px;
	height: 64px;
	padding: 4px;
	margin: 0 6px;
}
.purpleback {background-color: #fd9a9b;}
.greenback {background-color: #2da775;}
.orangeback {background-color: #f29600;}
.blueback {background-color: #009fe8;}
.whiteline {
	width: 100%;
	height: 100%;
	border: 1px solid #FFF;
}
.whiteline h2 {
	font-family: "ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif;
	font-size: 24px;
	color: #FFF;
	margin-top: 8px;
	margin-left: 10px;
	line-height: 120%;
}
.whiteline p {
	font-family: "ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif;
	font-size: 11px;
	color: #FFF;
	margin-left: 10px;
}
.purpleback:hover,
.greenback:hover,
.orangeback:hover,
.blueback:hover {
	opacity:0.75;
	cursor: pointer;
}
/* --------------------------------------------------- */


/* --------------------------------------------------- */
@media (max-height: 900px) {

#header {position: inherit;}
#slid {position: inherit;}
#slid img {
	position: absolute;
	top: 134px;
}
#contents {
	position: absolute;
	top: 250px;
}
footer {
	position: relative;
	top: 220px;
}
footer #illustmap {position: absolute;}
footer #illustmap p {
	position: absolute;
	left: 0px;
	bottom: 10px;
}
#banner {bottom: 10px;}

}
/* --------------------------------------------------- */


/* --------------------------------------------------- */
@media (max-width: 768px) {

body {background-image: url(../img/top_header_back768.png);}
#header {
	position: absolute;
	height: 100px;
	padding-left:100px;
	background-image: url(../img/top_header_logo768.png);
}
#header h1 {
	font-size: 24px;
	padding-top: 17px;
}
#header p {font-size: 13px;}
#header h2 {font-size: 24px;}
#slid {
	position: absolute;
	top: 100px;
	min-width: 100%;
}
#slid img {
	position: absolute;
	left: 0px;
	top: -1%;
	width: 84%;
}
#contents {
	position: relative;
	top: 220px;
}
#contents section {
	width: 100%;
	margin-right: 0px;
}
#menu {width: 100%;}
#menu #name {width: 32%;}
#menu ul {width: 68%;}
#menu ul li {width: 25%;}
#menu ul li a {width: 25%;}
#news {width: 100%;}
#news h2 {width: 100%;}
#kyuujitsu, #map {
	float: left;
	width: 50%;
}
.doctor {
	float: left;
	width: 48%;
	margin-left: 1%;
	margin-right: 1%;
}
#myslider {margin-bottom:20px;}
.topicsbox {width: 100%;}
#topics {
	width: 98%;
	margin-left: 1%;
	margin-right: 1%;
}
#topics #topicstitle {
	width: 49%;
	margin-right: 1%;
}
.topics {
	width: 49%;
	margin-right: 1%;
}
footer {
	position: relative;
	top: 520px;
	min-width: 100%;
}
footer #illustmap {
	position: absolute;
	width: 60%;
}
footer #illustmap p {
	position: absolute;
	left: 0px;
	bottom: 10px;
}
#banner {
	display: none;
	bottom: 10px;
}

}
/* --------------------------------------------------- */


/* --------------------------------------------------- */
@media (max-width: 500px) {

#header h1 {padding-top: 8px;}
#header p {font-size: 12px;}
#contents {width: 100%;}
#slid img {width: 100%;}
#menu #name {display:none;}
#menu ul {width: 100%;}
#kyuujitsu, #map {width: 98%;}
#kyuujitsu table {width: 98%;}
.doctor {width: 98%;}
.topicsbox {width: 98%;}
#topics #topicstitle {width: 98%;}
.topics {width: 98%;}
footer #illustmap {width: 98%;}
#footer p {text-align: center;}

}
/* --------------------------------------------------- */