@import url(https://fonts.googleapis.com/earlyaccess/notosansjapanese.css);
@import url('https://fonts.googleapis.com/css?family=Noto+Sans');
/*************************
body 
**************************/
body { 
	color: #4d4d4d;
	font-size: 15px; 
	font-family: "Noto Sans","Noto Sans CJK JP","Noto Sans Japanese","メイリオ", "Meiryo","ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro",  sans-serif;
	min-width :960px;
	line-height :1.6rem;
 	 -webkit-text-size-adjust: 100%;
}
@media screen and (max-width:  767px) {
	body {
		min-width :100%;
	}
}
/*************************
common
**************************/
.W100Hauto {
	height: auto;
	width: 100%;
}
@media screen and (max-width:  767px) {
	.spW100Hauto {
		height: auto;
		width: 100%;
	}
}
.c-orange {
    color: #eb6100;
}
a.button.blue {
    color: #FFFFFF;
    background: rgb(59,103,158);
    background: -moz-linear-gradient(top, rgba(59,103,158,1) 0%, rgba(43,136,217,1) 50%, rgba(32,124,202,1) 51%, rgba(125,185,232,1) 100%);
    background: -webkit-linear-gradient(top, rgba(59,103,158,1) 0%,rgba(43,136,217,1) 50%,rgba(32,124,202,1) 51%,rgba(125,185,232,1) 100%);
    background: linear-gradient(to bottom, rgba(59,103,158,1) 0%,rgba(43,136,217,1) 50%,rgba(32,124,202,1) 51%,rgba(125,185,232,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3b679e', endColorstr='#7db9e8',GradientType=0 );
}
a.button {
    text-align: center;
    margin: 6px auto;
    padding: 10px 0;
    width: 90%;
    max-width: 300px;
    display: block;
    border: 2px solid #cfcfcf;
    text-decoration: none;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    border-radius: 8px;
}
iframe {
	width: 100%;
}
.bb2 {
    margin-bottom: 15px;
    padding-bottom: 10px;
    border-bottom: 2px dotted #9999CC;
}
ul.common {
	padding-left: 25px;
}
ul.common li {
	line-height: 1.5rem;
	list-style-type: disc;
	list-style-position: outside;
}
.col2 ul.common li {
	font-size :14px;
}
.col2 ul.common {
	padding-left: 15px;
}


.ttl1 {
    color: #ffffff;
    padding-top: 6px;
    padding-left: 8px;
    height: 29px;
    background-image: url(../images/ttl1.jpg);
    background-repeat: repeat-x;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    margin: 5px 0 15px;
}
.ttl2 {
    font-size: 15px;
    font-weight: bold;
    line-height: 1;
    margin-bottom: 10px;
    padding: 0 3px 0 6px;
    border-left: 4px solid #1E6FFF;
}
.ttl3 {
    font-weight: bold;
    font-size: 15px;
    color: #005ebd;
    padding: 8px;
    border: 2px solid #005ebd;
    line-height: 1;
    -webkit-border-radius: 16px;
    -moz-border-radius: 16px;
    border-radius: 16px;
}
.border-box {
	box-sizing: border-box;
}
.tel {
    font-family: arial;
    font-size: 26px;
    font-weight: bold;
}

/*************************
layout
**************************/
.wrap {
	margin: 0 auto;
	width: 960px;
}

@media screen and (max-width:  767px) {
	.wrap {
		width :100%;
	}
	section {
	margin: 0 auto;
	width: 95%;
	}
	iframe {
	width: 100%;
	}
}


/*************************
header 
**************************/
.heading-main {
	font-size: 14px;
	margin-top: 15px;
	margin-bottom: 5px;
}
header {
	position: relative;
	height: 80px;
	background-color: #1E1E80;
}
#logo {
	position: absolute;
	top: 38px;
	left: 15px;
	width: 300px;
}
#logo img {
	height: auto;
	width: 100%;
}
.header-copy {
	font-size: 13px;
	color: #FFFFFF;
	position: absolute;
	top: 10px;
	left: 15px;
}
.organization {
	font-size: 13px;
	color: #FFFFFF;
	position: absolute;
	top: 42px;
	left: 325px;
}
header .label {
	font-size: 12px;
	color: #FFFFFF;
	text-align: center;
	padding-top: 1px;
	padding-bottom: 1px;
	border: 2px solid #FFFFFF;
	position: absolute;
	background-color: #f76b21;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	border-radius: 8px;
	line-height: 1.4rem;
}
header .label span {
	font-size: 14px;
	font-weight: bold;
}
header .copy1 {	
	top: 8px;
	right: 170px;
	width: 120px;
}

header .copy2 {
	top: 8px;
	right: 10px;
	width: 150px;
}
header .tel {
	color: #FFFFFF;
	font-weight: bold;
	position: absolute;
	right: 10px;
	bottom: 5px;
}
header .tel a {
	font-size: 21px;
	color: #FFFFFF;
}

header .tel span {
font-size: 14px;
}
@media screen and (max-width:  767px) {
	.heading-main {
		font-size: 10px;
		margin-top: 0px;
		margin-bottom: 0px;
		padding: 0 5px;
		color: #FFFFFF;
		background-color: #1E1E80;
		line-height: 1.2rem;
	}
	header {
		position: relative;
		height: 30px;
		background-color: #1E1E80;
	}
	#logo {
		position: absolute;
		top: 0px;
		left: 5px;
		width: 180px;
	}
	.header-copy {
		display:none;
	}
	.organization {
		font-size: 9px;
		top: -2px;
		left: 190px;
	}
	header .label{
		display:none;
	}
	header .tel  {
	display:none;
	}
}
/*************************
nav
**************************/

.navi li {
	border-left: 1px solid #43436d;
	float: left;
	width: 140px;
	box-sizing: border-box;
}
.navi li:first-child {
	width: 120px;
	border-left: 0;
}
.navi li a {
	color: #FFFFFF;
	text-align: center;
	padding-top: 9px;
	padding-bottom: 9px;
	background-image: url('../images/btn_bg.jpg');
	background-repeat: repeat-x;
	display: block;
}
@media screen and (max-width:  767px) {
	.navi ul {

	}
	.navi ul li{
		border-left: 1px solid #43436d;
	float: left;
	width: 33.3333333%;
	}
	.navi ul li:first-child {
		display :none;
	}
	.navi ul li a {
	padding-top: 1px;
	padding-bottom: 1px;
	font-size :10px;
	background-position: 10% 50%;
	}
}


/*************************
pan
**************************/
.pan,pan a {
	font-size: 13px;
}
@media screen and (max-width:  767px) {
	.pan {
		padding : 0 5px;
	}
	.pan,pan a {
		font-size: 10px;
	}

}
/*************************
col
**************************/
.col {
	margin-left: 30px;
	float: left;
	margin-bottom: 30px;
}
.col:after
{
    content: "";
    display: block;
    clear: both;
}
.col:first-child {
	margin-left: 0;
}

.grid2 .col {
	width: 465px;
}
.grid3 .col {
	width: 300px;
}	
.col2:after,
.grid2:after,
.grid3:after {
	content: "";
	display: block;
	clear: both;
}


.col2 .main{
float: left;
width: 750px;
margin-bottom: 15px;
}
.col2 .aside{
float: right;
width: 180px;
}

.col2 .grid2 .col {
	width: 360px;
}


@media screen and (max-width:  767px) {
	.col {
	margin-left: 0px;
	float: none;
	}
	.grid2 .col,.grid3 .col {
		width: 100%;
	}
	.col2 .main{
	float: none;
	width: 100%;
	}
	.col2 .aside{
	float: none;
	width: 100%;
	}
	
	.col2 .grid2 .col {
		width: 100%;
	}
}



/*************************
footer
**************************/
.copyright {

    font-size: 12px;
    color: #C0C0C0;
    text-align: center;
    margin-top: 15px;
    margin-bottom: 15px;
    padding-top: 15px;
}
.footer-link {
    margin-top: 15px;
    border-top: 1px solid #C0C0C0;
	padding: 50px 0 20px;
	width: 960px;
	margin: 0 auto;
}
.footer-link li {
	float: left;
	line-height: 1rem;
	margin-right: 15px;
	border-right: 1px solid #e1e1e1;
}
.footer-link li:last-child {
	border-right: 0;
}
.footer-link li a {
padding-right: 8px;

}
@media screen and (max-width:  767px) {
	.copyright {
	    margin-top: 15px;
	    margin-bottom: 15px;
	    padding-top: 15px;
	}
	.footer-link {
	    margin-top: 15px;
		padding: 0px 0 20px;
		width: 100%;
		margin: 0 auto;
	}
	.footer-link li {
		float: none;
		line-height: 1.6rem;
		margin-right: 0px;
		border-right: 0px;
		border-bottom: 1px solid #e1e1e1;
	}
	.footer-link li:last-child {
		border-right: 0;
	}
	.footer-link li a {
		font-size: 12px;
		padding: 15px 8px;
	}

}


/*************************
index
**************************/
.index-main {
	margin-bottom: 30px;
}
.index-menu .col {
	border: 1px solid #E1E1E1;
	position: relative;
	height: 280px;
	box-sizing: border-box;
}
.index-menu .title {
	font-size: 21px;
	color: #FFFFFF;
	margin-bottom: 5px;
	padding: 10px 2%;
	background-color: #1E1E80;
}
.index-menu .lead {
	padding: 10px;
}
.index-menu a.button {
position: absolute;
bottom: 5px;
right: 5%;
}

.index-menu .title span {
	font-size: 15px;
	display: block;
}
.index-news {
float: left;
width: 600px;
}
.index-news ul {
padding: 0 10px 10px;
}

.index-news span.date {
	color: #990000;
	font-weight: bold;
	margin-right: 2%;
	float: left;
	width: 15%;
	display: block;
}
.index-news p {
	float: left;
	width: 83%;
}
.index-attention {
float: right;
width: 340px;
}



@media screen and (max-width:  767px) {
	.index-main {
		margin-bottom: 10px;
	}
	.index-menu .col {
		margin-bottom: 10px;
		height: auto;
	}
	.index-menu .title {
		font-size: 18px;
		color: #FFFFFF;
		margin-bottom: 5px;
		padding: 5px 2%;
		background-color: #1E1E80;
	}
	.index-menu .lead {
		padding: 10px;
	}
	.index-menu a.button {
	position: static;
	bottom: 5px;
	right: 5%;
	}
	.index-menu .title span {
		font-size: 12px;
		display: block;
	}
	.index-news,.index-attention  {
	float: none;
	width: 100%;
	}
	.index-news ul {
	padding: 0 10px 10px;
	}
	
	.index-news span.date {
		font-size: 10px;
		margin-right: 2%;
		float: left;
		width: 18%;
		display: block;
	}
	.index-news p {
		font-size: 13px;
		width: 80%;
	}

}


/*************************
access 
**************************/
.howto .lead {
height: 260px;
}

@media screen and (max-width:  767px) {
	.howto .lead {
	height: auto;
	}
}

/*************************
clinic
**************************/
.lot-image a {
    margin-right: 2%;
    margin-left: 2%;
    float: left;
    width: 21%;
}
.lot-image a img {
    height: 190px;
    width: auto;
}
.attention-banner {
padding-top: 15px;
padding-bottom: 15px;
}

@media screen and (max-width:  767px) {
	.lot-image a img {
	    height: auto;
	    width: 100%;
	}

}


/*************************
price
**************************/

.price-table {
border: 1px solid #e1e1e1;
width: 100%;
max-width :750px;
margin: 0 auto;;
}
.price-table td {
padding: 5px;
}
.price-table td.price {
text-align: right;
}
table.price-table tr:nth-child(odd) {
    background-color: #D7E0F8;
}
table.price-table tr:nth-child(even) {
    background-color: #E6EBF8;
}

@media screen and (max-width:  767px) {
	.price-table {
	font-size: 13px;
	}
	.price-table td.price {
	width :30%;
	}
}
.aside {
	margin-bottom: 15px;
}
.aside li a {
	font-size: 14px;
	color: #FFFFFF;
	padding: 8px;
	border-bottom: 1px solid #FFFFFF;
	position: relative;
	display: block;
}
.aside li a:after  {
	font-size: 12px;
  font-family: FontAwesome;
  color: #FFFFFF;
  position: absolute;
  top: 18%;
  right: 5%;
  content: "\f105";
}

.aside li a  {

background: rgb(59,82,175); /* Old browsers */
background: -moz-linear-gradient(top, rgba(59,82,175,1) 0%, rgba(53,73,160,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, rgba(59,82,175,1) 0%,rgba(53,73,160,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, rgba(59,82,175,1) 0%,rgba(53,73,160,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3b52af', endColorstr='#3549a0',GradientType=0 ); /* IE6-9 */

}
.form1 {
	margin-bottom: 15px;
}
.form1 table {
  margin: 0 auto;
}
.form1 th {
  padding-right: 20px;
  padding-top: 5px;
  font-weight: normal;
}
.form1 select {
  margin-bottom: 10px;
  padding: 5px;
  font-size: 16px;
  border-radius: 5px;
  border: 1px solid #ccc;
}
.form1 input[type="text"],
.form1 input[type="tel"],
.form1 input[type="email"],
.form1 textarea {
  margin-bottom: 10px;
  padding: 5px;
  font-size: 16px;
  border-radius: 5px;
  border: 1px solid #ccc;
}
.form1 input[type="text"] {
  width: 300px;
}
.form1 textarea {
  width: 400px;
  height: 300px;
}
.form1 input[type="submit"] {
  display: inline-block;
  font-size: 16px;
}
.form1 input[type="submit"]:first-child {
  margin-left: 0;
}
.form1 input[type="submit"],
.form1 button[type="submit"] {
  padding: 12px 30px;
  border: 1px solid #0071bc;
  display: inline-block;
  text-align: center;
  color: #fff;
  background: #0071bc;
  text-decoration: none;
  cursor: pointer;
  outline: 0;
  line-height: 1.5;
}
.form1 input[type="submit"]:hover,
.form1 button[type="submit"]:hover {
  opacity: 0.5;
}
.form1 .required {
  margin-left: 5px;
  color: #c00;
  font-size: 12px;
}

@media screen and (max-width:  767px) {
	.form1 th {
		display: block;
	  padding-right: 0;
	  padding-top: 5px;
	}
	.form1 td {
		display: block;
	  padding-right: 0;
	  padding-top: 5px;
	  font-weight: normal;
	}
	.form1 textarea {
	  width: 90%;
	  height: 200px;
	}
}