/*-----------------------------------------------------------------
	TOPビジュアル
-----------------------------------------------------------------*/

.mv {
	width: 100%;
	height: 0;
	/* 表示画像の高さ ÷ 表示画像の幅 × 100 */
  padding-top: 50.7%;
	background: url(../images/top_img_pc.jpg) no-repeat;
	background-size: contain;
	margin: 0;
}

/*-----------------------------------------------------------------
	top
-----------------------------------------------------------------*/

.top_contents {
	position: relative;
	padding: 0;
}

.h1_top {
	color: #666;
	font-size: 93%;
	font-weight: normal;
	margin: 0 0 30px;
	text-align: center;
}

.h1_top strong {
	color: #ff314f;
	display: block;
	font-size: 150%;
	line-height: 0.8em;
}

/*-----------------------------------------------------------------
	top_about
-----------------------------------------------------------------*/

.top_about {
	padding: 50px 0;
}

.h1_top_about {
	color: #fff;
	font-size: 133%;
	font-weight: bold;
	margin: 0 auto 30px;
	text-align: center;
}

.top_about p {
	color: #fff;
}

.top_about_img {
	width: 20%;
	position: absolute;
	bottom: -20%;
	right: 6%;
	z-index: 100;
}
	
.top_about_img img {
	width: 100%;
}

/*-----------------------------------------------------------------
	top_howto
-----------------------------------------------------------------*/

.top_howto {
	background: #eeeeee url(../images/bg_about.png) no-repeat center center;
	background-size: 100%;
	padding: 100px 0 30px;
}

.top_howto_list {
	width: 100%;
	margin: 0 auto;
	text-align: center;
}

.top_howto_list li {
	width: 300px;
	display: inline-block;
	margin: 0 1% 80px;
	text-align: center;
	vertical-align: top;
}

.top_howto_box {
	min-height: 300px;
	background: #fff;
	border: #29a01d 4px solid;
	border-radius: 20px;
	margin: 0 0 30px;
	padding: 50px 20px 20px;
	position: relative;
	text-align: left;
}

.top_howto_box:before {
  content: "";
  position: absolute;
  bottom: -22px;
  left: 50%;
  margin-left: -15px;
  border: 12px solid transparent;
  border-top: 12px solid #FFF;
  z-index: 2;
}

.top_howto_box:after {
  content: "";
  position: absolute;
  bottom: -30px;
  left: 50%;
  margin-left: -17px;
  border: 14px solid transparent;
  border-top: 14px solid #29a01d;
  z-index: 1;
}

.top_howto_icon {
	width: 80px;
	height: 80px;
	border-radius: 50%;
	position: absolute;
	top: -40px;
	left: 0;
	right: 0;
	margin: auto;
}

.thi01 {background: #29a01d url(../images/icon_merit.png) no-repeat center center;}
.thi02 {background: #29a01d url(../images/icon_diagnosis.png) no-repeat center center;}
.thi03 {background: #29a01d url(../images/icon_price.png) no-repeat center center;}

.top_howto_title {
	color: #29a01d;
	font-size: 133%;
	font-weight: bold;
	margin: 0 0 20px;
	text-align: center;
}

/*-----------------------------------------------------------------
	top_contact
-----------------------------------------------------------------*/

.top_contact {
	padding: 30px 0;
}

.top_contact_list {
	text-align: center;
}

.top_contact_list li:first-child {
	border-top: none;
}

.top_contact_list li {
	border-top: #cccccc 1px solid;
	padding: 30px 0;
}

.top_contact_title {
	border-bottom: #29a01d 2px solid;
	display: inline-block;
	font-size: 133%;
	font-weight: bold;
	background-size: 50px;
	margin: 0 0 20px;
	padding: 10px 10px 20px 60px;
}

.icon_phone { background: url(../images/icon_tel.png) no-repeat left top;}
.icon_mail { background: url(../images/icon_mail.png) no-repeat left top;}
.icon_fax { background: url(../images/icon_fax.png) no-repeat left top;}

.top_contact_time {
	background: #29a01d;
	color: #fff;
	display: inline-block;
	font-weight: bold;
	margin: 0 0 20px;
	padding: 4px 10px;
}

.top_contact_tel {
	font-size: 200%;
	font-weight: bold;
	margin: 0 0 20px;
}

.top_contact_tel small {
	font-size: 50%;
	font-weight: bold;
}

.icon_freephone {
	background: url(../images/icon_freephone.png) no-repeat;
	background-size: auto 30px;
	display: inline-block;
	margin: 0 0 20px;
	padding: 0 0 0 50px;
}

@media screen and (max-width:800px) {

/*-----------------------------------------------------------------
	TOPビジュアル
-----------------------------------------------------------------*/

.mv {
	background: url(../images/top_img_sp.jpg) no-repeat;
	background-size: contain;
  padding-top: 131.6%;
}

/*-----------------------------------------------------------------
	top
-----------------------------------------------------------------*/

.top_contents {
	padding: 30px 0;
}

.h1_top {
	font-size: 88%;
}

.h1_top strong {
	font-size: 113%;
}

/*-----------------------------------------------------------------
	top_about
-----------------------------------------------------------------*/

.top_about p {
	color: #fff;
	font-size: 88%;
}

.top_about_img {
	width: 60%;
	position: static;
	margin: 20px auto 0;
	text-align: center;
}

/*-----------------------------------------------------------------
	top_howto
-----------------------------------------------------------------*/

.top_howto {
	background: #eeeeee;
	padding: 50px 0 20px;
}

/*-----------------------------------------------------------------
	top_contact
-----------------------------------------------------------------*/

.top_contact_list li {
	border-top: #cccccc 1px solid;
	padding: 30px 0;
}

.top_contact_title {
	font-size: 113%;
	background-size: 40px;
	padding: 10px 10px 20px 40px;
}

.top_contact_tel small {
	display: block;
}

}