@charset "utf-8";

/* ▼▼▼ ヘッダー
=====================================*/
#header_top {
	width: 100%;
	text-align: center;
	overflow: hidden;
}

#visual {
	width: 100%;
	background: url(../img/top/header_bg.png) center;
}

#myFlash {
	background: url(../img/top/top.jpg) center no-repeat;
	width: 100%;
	height: 427px;
}

/* html5化したswfの制御 */
#mainvisial {
  width: 1200px;
  height: 427px;
  margin: auto;
}

/* グローバルナビゲーション */
ul#gnav_top {
	width: 940px;
	margin: 0 auto;
	padding: 20px 0 25px;
	clear: both;
	overflow: hidden;
}

ul#gnav_top li {
	float: left;
	line-height: 1.0;
	position: relative;
	cursor: pointer;
}

ul#gnav_top ul {
	width: 200px;
	margin-left: 19px;
}

* html ul#gnav_top ul {
	line-height: 0;
}

ul#gnav_top ul li {
	background: #fff;
}

ul#gnav_top .child li {
	height: 0;
	opacity: 0;
	transition: .3s all;
}

ul#gnav_top .child.panelactive li {
	opacity: 1;
	height: 27px;
}

.overlay {
	content: "";
	display: block;
	width: 0;
	height: 0;
	background-color: rgba(0,0,0,.7);
	position: absolute;
	top: 0;
	left: 0;
	z-index: 150;
	opacity: 0;
	transition: opacity .5s;
	overflow: hidden;
	/* z-index: 999; */
}

.overlay.open {
	width: 100%;
	height: 100%;
	opacity: 0;
}




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

	ul#gnav_top {
		width: 100%;
		overflow: unset;
		display: block;
		padding: 0;
		margin: 0 0 10px;
		overflow-y: scroll;
		height: 430px;
	}

	ul#gnav_top li {
		float: none;
		border-bottom: 1px solid #EE657E;
	}

	ul#gnav_top li:last-child {
		border-bottom: none;
	}

	ul#gnav_top li a {
		text-align: center;
		display: block;
		padding: 30px 0;
		box-sizing: border-box;
		text-decoration: none;
	}

	ul#gnav_top li a:hover,
	ul#gnav_top li.current a {
		color: #fff;
		background-color: #EE657E;
	}

	.side_banner a img {
		width: unset;
	}

	.menu {
		/* z-index: 99; */
		position: fixed;
		top: 0;
		left: 150%;
		width:100%;
		transition: all 0.5s;
		z-index: 9999;
		background: #fff;
	}

	.menu.panelactive {/* メニューボタンが押されたら左に出す設定 */
		left: 0%;
		transition: all 0.5s;
	}

	.openbtn1 {
		position: relative;/*ボタン内側の基点となるためrelativeを指定*/
		position: fixed;
		top: 0;
		right: 0;
		background: #EE5E78;
		border-left: 1px solid #fff;
		border-bottom: 1px solid #fff;
		cursor: pointer;
		width: 50px;
		height: 50px;
		z-index: 9999999999;
	}

	/*ボタン内側*/
	.openbtn1 span {
		display: inline-block;
		transition: all .4s;/*アニメーションの設定*/
		position: absolute;
		left: 50%;
		height: 3px;
		border-radius: 2px;
		background: #fff;
		width: 45%;
		transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
	}

	.openbtn1 span:nth-of-type(1) {
		top: 15px;
	}

	.openbtn1 span:nth-of-type(2) {
		top: 25px;
	}

	.openbtn1 span:nth-of-type(3) {
		top: 35px;
	}

	/*activeクラスが付与されると線が回転して×に*/
	.openbtn1.active span:nth-of-type(1) {
		top: 18px;
		left: 18px;
		transform: translateY(6px) rotate(-45deg);
		width: 30%;
	}

	/*真ん中の線は透過*/
	.openbtn1.active span:nth-of-type(2) {
		opacity: 0;
	}

	.openbtn1.active span:nth-of-type(3) {
		top: 30px;
		left: 18px;
		transform: translateY(-6px) rotate(45deg);
		width: 30%;
	}

	/*==================================
	メニューを開いたら背景が暗くなる
	==================================*/
	.overlay.open {
		width: 100%;
		height: 100%;
		opacity: 0.5;
		position: fixed;
		z-index: 9;
	}

}



/* ▼▼▼ メイン 「コンテンツとサイドを囲む要素」
=====================================*/
#main_top {
	width: 948px;
	margin: 0 auto;
	clear: both;
	/* overflow: hidden; */
	position: relative;
}

#main_top .section {
	clear: both;
}

h2.title {
	position: relative;
	font-size: 15px;
	line-height: 1;
	color: #fff;
	background-color: #ee627b;
	box-sizing: border-box;
	padding: 5px 0 5px 27px;
	margin-bottom: 10px;
}

h2.title::before {
	position: absolute;
	top: 50%;
	left: 13px;
	transform: translate(-50%, -50%);
	-webkit-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	z-index: 2;
	content: '';
	width: 7px;
	height: 7px;
	border: 4px solid #fff;
	border-radius: 100%;
}

h3.title {
	position: relative;
	font-size: 18px;
	line-height: 1;
	color: #ee627b;
	box-sizing: border-box;
	padding: 13px 0 13px 20px;
	margin-bottom: 10px;
}

h3.title::before {
	position: absolute;
	top: 50%;
	left: 8px;
	transform: translate(-50%, -50%);
	-webkit-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	z-index: 2;
	content: '';
	width: 7px;
	height: 7px;
	border: 4px solid #ee627b;
	border-radius: 100%;
}

h3.title a {
	color: #37342F;
	font-size: 13px;
	text-decoration: unset;
}

h3.title a i {
	color: #ee627b;
}


@media screen and (max-width : 1024px) {
	#main_top {
		width: 95%;
	}

	h2.title {
		font-size: 20px;
		padding: 10px 0 10px 37px;
	}

	h2.title::before {
		left: 20px;
		width: 10px;
		height: 10px;
		border: 5px solid #fff;
	}

	h3.title {
		font-size: 20px;
		padding: 15px 0 15px 30px;
	}

	h3.title::before {
		left: 15px;
		width: 10px;
		height: 10px;
		border: 5px solid #ee627b;
	}

	h3.title a {
		font-size: 20px;
	}

}



/* 診療時間 */
#open {
	float: left;
	/* background: url(../img/top/bg01.png) no-repeat left top; */
	background-color: #fff;
	box-shadow: 
	1px -1px 3px rgba(0, 0, 0, 0.05),
	-1px 1px 3px rgba(0, 0, 0, 0.05),
	-1px -1px 3px rgba(0, 0, 0, 0.05),
	1px 1px 3px rgba(0, 0, 0, 0.05),
	1px -1px 3px rgba(0, 0, 0, 0.05),
	 -1px 1px 3px rgba(0, 0, 0, 0.05);
	width: 470px;
	height: 250px;
	padding: 19px;
	box-sizing: border-box;
	/* overflow: hidden; */
	border-radius: 10px;
	margin-bottom: 20px;
}

#open table {
	width: 100%;
}

#open table td {
	text-align: center;
	width: 20%;
	font-size: 14px;
}

#open table td:last-child {
	font-size: 12px;
}

#open table th {
	text-align: center;
	color: #ee627b;
	font-size: 17px;
}

#open table tr {
	border-bottom: 1px solid #bebebe;
}

#open table tr:first-child th {
	font-size: 14px;
	color: #35312b;
}

#open table tr:last-child th:last-child {
	color: #433d37;
	font-size: 5px;
}

#open ul.kome {
	margin-top: 10px;
	margin-bottom: 0;
	font-size: 10px;
	padding: 0;
	border: none;

}

#open ul.kome li {
	margin: 0;
	line-height: 1.6;
}



@media screen and (max-width : 1024px) {
	#open {
		float: none;
		width: 100%;
		height: unset;
		padding: 15px;
		margin-top: 20px;
	}

	#open table td {
    width: 25%;
    font-size: 15px;
	}

	#open table th {
		font-size: 15px;
		padding: 15px 0;
	}

	#open table tr:first-child th {
		font-size: 15px;
		font-weight: 100;
	}

	#open table tr:last-child th:last-child {
		font-size: 10px;
	}

	#open ul.kome li {
		font-size: 15px;
	}

}



/* 交通のご案内 */
#access {
	float: right;
	/* background: url(../img/top/bg02.png) no-repeat left top; */
	background-color: #fff;
	box-shadow: 
	1px -1px 3px rgba(0, 0, 0, 0.05),
	-1px 1px 3px rgba(0, 0, 0, 0.05),
	-1px -1px 3px rgba(0, 0, 0, 0.05),
	1px 1px 3px rgba(0, 0, 0, 0.05),
	1px -1px 3px rgba(0, 0, 0, 0.05),
	 -1px 1px 3px rgba(0, 0, 0, 0.05);
	 width: 460px;
	 height: 250px;
	padding: 18px;
	box-sizing: border-box;
	/* overflow: hidden; */
	border-radius: 10px;
	margin-bottom: 20px;
}

#access .map {
	float: left;
	width: 210px;
}

#access .map p a {
	font-size: 11px;
	float: right;
}

#access .place {
	float: right;
	width: 205px;
	font-size: 11px;
	position: relative;
}

#access .place dl.address dt {
	font-size: 14px;
	font-weight: bold;
}

#access .place dl.address dd .tel {
	color: #ec5e78;
	font-size: 25px;
	font-family: Baskerville;
	margin: 0px 0 5px;
}

#access .place dl.address dd .tel span {
	font-size: 13px;
}

#access .place dl.address dd ul.icon li {
	float: left;
	margin-right: 5px;
	color: #fff;
	background-color: #ec5e78;
	padding: 1px 5px;
	box-sizing: border-box;
	border-radius: 5px;
}

#access .place .btn_access {
	position: absolute;
	top: 160px;
}

#access .place .btn_access a {
	display: flex;
	font-size: 12px;
	text-decoration: none;
	padding: 2px 8px;
	box-sizing: border-box;
	border: 1px solid #ec5e78;
}

#access .place .btn_access a i {
	font-size: 18px;
	margin-right: 5px;
}

#access .place .btn_access a:hover {
	color: #fff;
	background-color: #ec5e78;
}



@media screen and (max-width : 1024px) {
	#access {
		float: none;
		width: 100%;
		height: unset;
		padding: 15px;
	}

	#access .map {
    float: none;
    width: 100%;
	}

	#access .map a img {
		width: 100%;
		height: auto;
	}

	#access .map p a {
		font-size: 15px;
	}

	#access .place {
		float: none;
		width: 100%;
		font-size: 16px;
	}

	#access .place dl.address dt {
    font-size: 25px;
		font-weight: normal;
	}

	#access .place dl.address dd .tel {
    font-size: 40px;
	}

	#access .place dl.address dd .tel span {
    font-size: 20px;
	}

	#access .place dl.address dd ul.icon li {
		float: none;
		padding: 5px 10px;
		margin: 0 0 10px;
	}

	#access .place .btn_access {
		position: relative;
		top: unset;
	}

	#access .place .btn_access a {
    font-size: 16px;
	}

	#access .place .btn_access a i {
    font-size: 23px;
    margin: 0 10px;
	}

}

/* 診療科目など */
.section.space {
	margin-top: 12px;
}

#box_l {
	float: left;
	width: 568px;
	margin: 0 0 50px;
	/* overflow: hidden; */
}

#medical_list {
	width: 530px;
	height: 64px;
	background-color: #f9eae9;
	border: 5px solid #fff;
	padding: 8px 10px;
	border-radius: 10px;
	box-shadow:
	1px -1px 3px rgba(0, 0, 0, 0.05),
	-1px 1px 3px rgba(0, 0, 0, 0.05),
	-1px -1px 3px rgba(0, 0, 0, 0.05),
	1px 1px 3px rgba(0, 0, 0, 0.05),
	1px -1px 3px rgba(0, 0, 0, 0.05),
	-1px 1px 3px rgba(0, 0, 0, 0.05);
}

#medical_list dl.list dt {
	float: left;
	/* width: 75px; */
	font-size: 17px;
	color: #fff;
	background-color: #ec5e78;
	line-height: 1.25;
	padding: 10px 20px;
}

#medical_list dl.list dd {
	margin-left: 81px;
}

#medical_list dl.list dd ul.medical {
	display: flex;
	flex-flow: wrap;
}

#medical_list dl.list dd ul.medical li {
	width: 19%;
	text-align: center;
	font-size: 16px;
	line-height: 1.2;
	color: #fff;
	background-color: #ec5e78;
	margin: 0 4px 5px 0;
	padding: 5px 0px;
	border-radius: 50px;
}

#medical_list dl.list dd ul.medical li.last {
	margin-right: 0;
}

#medical_list dl.list dd ul.medical li.naika {
	background-color: #fdaa45;
}

#medical_list dl.list dd ul.medical li.gaika {
	background-color: #a8c05f;
}

#medical_list dl.list dd ul.medical li.seikei {
	background-color: #9a9abe;
}

#medical_list dl.list dd ul.medical li.masui {
	background-color: #6dbda2;
}

#medical_list dl.list dd ul.medical li.rihabiri {
	background-color: #77c3c7;
}

#medical_list dl.list dd ul.medical li.hihu {
	background-color: #d68bba;
}

#medical_list dl.list dd ul.medical li.seikeigeka {
	background-color: #fc9666;
}

#medical_list dl.list dd ul.medical li.hinyoukika {
	background-color: #e2989f;
}

#medical_list dl.list dd ul.medical li.housyasen {
	background-color: #82accf;
}

ul.guide {
	margin: 3px -5px 17px 0;
	clear: both;
	overflow: hidden;
}

ul.guide li {
	float: left;
	margin-right: 5px;
}

.copy_box .copy {
	margin-bottom: 15px;
}

.copy_box .txt {
	font-size: 13px;
}

.box_r {
	float: right;
	width: 370px;
}

.ct_mri a {
	display: block;
	margin: 0 0 5px;
}



@media screen and (max-width : 1024px) {
	#box_l {
    float: none;
    width: 100%;
		margin: 0 0 10px;
	}

	#medical_list {
    width: 100%;
    height: unset;
		box-sizing: border-box;
	}

	#medical_list dl.list dt {
    float: none;
    width: 100%;
		font-size: 20px;
		padding: 5px 10px;
		box-sizing: border-box;
	}

	#medical_list dl.list dd {
    margin-left: 0;
	}

	#medical_list dl.list dd ul.medical {
		justify-content: space-between;
	}

	#medical_list dl.list dd ul.medical::after {
		content: "";
    display: block;
    width: 32%;
	}

	#medical_list dl.list dd ul.medical li {
    width: 32%;
		font-size: 16px;
    margin: 10px 0px 10px 0px;
    padding: 5px 0px;
	}

	ul.guide {
		width: 100%;
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
	}

	ul.guide li {
		width: 33%;
    float: none;
    margin-right: 0;
	}

	ul.guide li a {
		display: block;
	}

	ul.guide li a img {
		width: 100%;
		height: auto;
	}

	.copy_box img {
		width: 100%;
		height: auto;
	}

	.copy_box .txt {
		font-size: 16px;
	}

	.box_r {
		float: none;
		width: 100%;
	}

	.box_r img {
		width: 100%;
		height: auto;
		margin: 0 0 10px;
	}

}



/* トピックス */
#topics {
	float: right;
	/* background: url(../img/top/bg04.png) no-repeat left top; */
	background-color: #fff;
	/* background-size: 100% 265px; */
	width: 320px;
	/* height: 215px; */
	padding: 21px 24px 27px;
	border-radius: 5px;
	box-shadow:
	1px -1px 3px rgba(0, 0, 0, 0.05),
	-1px 1px 3px rgba(0, 0, 0, 0.05),
	-1px -1px 3px rgba(0, 0, 0, 0.05),
	1px 1px 3px rgba(0, 0, 0, 0.05),
	1px -1px 3px rgba(0, 0, 0, 0.05),
	-1px 1px 3px rgba(0, 0, 0, 0.05);
}

#topics h3.title {
	border-bottom: 2px solid #EE5E78;
	/* padding-bottom: 7px; */
	/* margin-bottom: 9px; */
	margin: 10px 0;
}

#topics span a img {
	vertical-align: top;
	margin-top: 3px;
}

/***************/
/** スクロール **/
/***************/
.jScrollbar4 {
	/* width: 320px; */
	/* height: 187px; */
	/* overflow: hidden; */
	/* position: relative; */
}

.jScrollbar4 .jScrollbar_mask {
	/* float: left;
	width: 290px;
	position: relative;
	top: 0; */
	float: none;
}

.jScrollbar4 .jScrollbar_mask dl.topics {
	color: #46AB90;
	border-bottom: 1px dotted #595959;
	padding-bottom: 10px;
	margin-bottom: 10px;
}

.jScrollbar4 .jScrollbar_mask dl.topics i {
	color: #EE657E;
}

.jScrollbar4 .jScrollbar_mask dl.topics dt {
	/* background: url(../img/top/arrow.gif) no-repeat left center; */
	/* padding-left: 18px; */
	margin-bottom: 3px;
	display: block;
}

.jScrollbar4 .jScrollbar_mask dl.topics dd {
	margin-left: 18px;
}

.jScrollbar4 .jScrollbar_mask dl.topics dd a {
	color: #37342F;
}

.jScrollbar4 .jScrollbar_draggable {
	/* float: right;
	width: 6px;
	height: 262px;
	overflow: hidden;
	background: none;
	background: url('../img/top/bg_slider4.png') no-repeat center top;
	position: relative; */
}

.jScrollbar4 .jScrollbar_draggable a.draggable {
	/* position: relative;
	background: url('../img/top/bg_draggable4.png') no-repeat center top;
	display: block;
	height: 30px;
	width: 6px;
	cursor: s-resize; */
}

.clr {
	clear: both;
	height: 0
}



@media screen and (max-width : 1024px) {
	#topics {
    float: none;
    width: 100%;
		box-sizing: border-box;
		padding: 15px;
		margin: 0 0 50px;
	}

	.jScrollbar4 .jScrollbar_mask dl.topics dt {
		font-size: 16px;
	}

	.jScrollbar4 .jScrollbar_mask dl.topics dd {
		font-size: 16px;
	}

}