@charset "utf-8";

/* 施術詳細ボックス 20180629 */
.treatment-info * {
	box-sizing: border-box;
  line-height: 1.2;
  font-size: 11px;
  text-align: left;
}

.treatment-info {
  /* display: none; */
	position: fixed;
	bottom: 25%;
  left: 0;
	width: 100%;
	margin: 0 auto;
	transition: left 1s;
	-webkit-transition: left 1s;
}

.treatment-info.is-hide {
	left: calc( -1 * (100% - 40px));
}

.treatment-info .info-inner {
	position: relative;
	width: 100%;

}

.treatment-info .info-title {
	float: right;
	width: 40px;
  padding: 20px 10px 10px;
  margin-right: 5px;
  background: #ddd;
  border-radius: 0 5px 5px 0;
  -ms-writing-mode: tb-rl;
  writing-mode: vertical-rl;
	z-index: 5;
}

.treatment-info .info-title em {
  color: #333;
}

.treatment-info .info-title::before {
	content: '';
	display: block;
	position: absolute;
	width: 0;
	height: 0;
  position: absolute;
  right: 16px;
  top: 5px;
  margin-right: 10px;
  border-right: 10px #66ccff solid;
  border-top: 5px transparent solid;
	border-bottom: 5px transparent solid;
}

.treatment-info.is-hide .info-title::before {
	border-right: none;
  border-top: 5px transparent solid;
	border-bottom: 5px transparent solid;
	border-left: 10px #66ccff solid;
}

.treatment-info .info-detail {
	position: absolute;
	top: 0;
	left: 0;
  width: calc(100% - 40px);
	padding: 20px 20px;
  background: #ddd;
}

.treatment-info .price-inner .info-list-text span {
  display: block;
	padding-left: 10px;
	font-size: 11px;
}

.treatment-info .price-inner .info-list-text span::before {
	display: inline-block;
	content: '※';
}

.treatment-info .info-list-title {
	clear: both;
	float: left;
}

.treatment-info .info-list-title::after {
	content: ':';
	display: inline-block;
	padding: 0 3px;
	font-weight: bold;
}

.treatment-info .info-list-text {
  float: left;
	margin-bottom: .5rem;
}
/*--------------
下部リンク
----------------*/
ul.accordion {
	margin:0 auto 30px;
	padding:0px;
	font-size:14px;
	font-family:"KozGoPro-Light", "小塚ゴシック Pro L", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "游ゴシック", YuGothic, "メイリオ", Meiryo, sans-serif;
}
ul.accordion a {
	display:block;
	padding:15px;
	background-position:97% center;
	background-repeat:no-repeat;
	text-decoration:none;
	color:#555;
	font-weight:500;
	text-align:left;
}
ul.accordion span {
	display:block;
	padding:15px;
	background-position:97% center;
	background-repeat:no-repeat;
	color:#fff;
	font-weight:500;
	text-align:left;
}
ul.accordion ul {
	display:none;
}
ul.accordion > li {
	background-color:#79B6E5;
	/*background: -moz-linear-gradient(top, #4EA2BD, #71ABBC);
	background: -webkit-gradient(linear, left top, left bottom, from(#4EA2BD), to(#71ABBC));*/
	border-bottom:1px solid #fff;
}

ul.accordion > li a{
	color:#ffffff;
	background:url(/sphone/images/implant/go_white.png) no-repeat 97% center;
}


ul.accordion > li > p {
	background-color:#79B6E5;
	/*background: -moz-linear-gradient(top, #4EA2BD, #71ABBC);
	background: -webkit-gradient(linear, left top, left bottom, from(#4EA2BD), to(#71ABBC));*/
	cursor:pointer;
	margin-bottom:0px;
	/*border-bottom:1px solid #fff;*/
}
ul.accordion > li > p span {
	background-image: url(/sphone/images/implant/open.png);;
}
ul.accordion > li > p span.open {
	background-image:url(/sphone/images/implant/close.png);
}
ul.accordion > li > ul > li {
	background:#fff;
	border-bottom:1px solid #EEE;

}
ul.accordion > li > ul > li > p {
	background:#999;
}
ul.accordion > li > ul > li > a {
	background:url(/sphone/images/implant/go.png) no-repeat 97% center;
	color:#79B6E5;
}
ul.accordion > li > ul > li > ul > li {
	background:#FFF;
	border-bottom:1px dotted #888;
}
ul.accordion > li > ul > li > ul > li:last-child {
	border:none;
}
