@charset "utf-8";

/* --------------------------------
	reset
-------------------------------- */
.break {
	margin-top: 15px;
}
.spacing { margin: 20px 0 !important; }
.spacing-auto { margin: 20px auto !important; }
.spacing-auto3 { margin: 30px auto !important; }
.circle {
	list-style-type: disc;
	margin-left: 20px;
	font-size: 117.81%;
	line-height: 2;
}

.yellow-box,
.green-box,
.p-green-box,
.p-blue-box,
.p-red-box,
.orange-box {
	padding: 2%;
}
.yellow-box { background-color: #fcfae7; }
.green-box { background-color: #ecf7cb; }
.p-green-box { background-color: #f9fcef; }
.p-blue-box { background-color: #e8f4fe; }
.p-red-box { background-color: #feeded; }
.orange-box { background-color: #ffeed3; }

ul.decimal li {
	list-style-type: decimal;
	list-style-position: outside;
	margin-left: 30px;
	margin-top: 10px;
	font-size: 112.71%;
	line-height: 1.6;
}

/* --------------------------------
	page-inlinks ページ内リンク
-------------------------------- */
#page-inlinks {
	background-color: #f6f6f6;
	box-shadow: 0px 2px 3px #eee inset;
	padding: 2%;
	margin-bottom: 0px;
}
#page-inlinks ul {
	text-align: center;
}
#page-inlinks li {
	display: inline;
	margin-left: 20px;
	line-height: 1.8;
}
#page-inlinks li:before {
	content: "|";
	margin-left: -20px;
	margin-right: 5px;
}
#page-inlinks li:first-child {
	margin-left: 0px;
}
#page-inlinks li:first-child:before {
	content: "";
	margin-left: 0px;
}
/* --------------------------------
	page-title タイトル
-------------------------------- */
#page-title-block .en-title {
	font-size: 112%;
}
.page-title {
	font-size: 248.71%;
	text-align: center;
	padding: 30px 0 5px;
	/* font-family: "Noto Sans JP", "Hiragino Sans", "Yu Gothic", "Meiryo", sans-serif;
	font-weight: 600; */
	font-weight: 700;
}
/* --------------------------------
	content-title タイトル
-------------------------------- */
.content-title {
	font-size: 224.71%;
	text-align: center;
	padding: 50px 0 60px;
	/* font-family: "Noto Sans JP", "Hiragino Sans", "Yu Gothic", "Meiryo", sans-serif;
	font-weight: 600; */
	font-weight: 700;
}
.content-title:after {
	content: '';
	display: block;
	height: 3px;
	width: 20%;
	position: absolute;
	margin-top: 26px;
	left: 40%;
	background: #003c96;
}
.en-title {
	font-size: 142%;
	color: #999;
	text-align: center;
}
/* --------------------------------
	sub-content-title
-------------------------------- */
.sub-content-title {
	font-size: 134%;
	text-align: center;
	border-bottom: 1px dotted #ccc;
	padding-bottom: 10px;
	margin: 40px 0 20px;
	font-family: "Noto Sans JP", "Hiragino Sans", "Yu Gothic", "Meiryo", sans-serif;
}
.content-title span {
	font-size: 82%;
}

/* --------------------------------
	blue-line-title
-------------------------------- */
.blue-line-title,
.red-line-title {
	font-size: 168.71%;
	text-align: center;
	border-bottom: 2px solid #0f489c;
	color: #0f489c;
	padding-bottom: 15px;
	margin: 40px 0 20px;
	font-family: "Noto Sans JP", "Hiragino Sans", "Yu Gothic", "Meiryo", sans-serif;
}
.red-line-title {
	border-bottom: 2px solid #e60012;
	color: #e60012;
}

/* --------------------------------
	装飾タイトル
-------------------------------- */
.red-title {
	background-color: #eb6877;
	padding: 15px 20px;
	color: #fff;
	font-size: 118%;
	margin-bottom: 20px;
}
.green-title,
.p-green-title,
.b-green-title,
.orange-title,
.blue-title {
	background-color: #80c269;
	padding: 15px 20px;
	color: #fff;
	font-size: 118%;
	margin-bottom: 20px;
}
.p-green-title { background-color: #32b16c; }
.b-green-title { background-color: #8fa93c; }
.blue-title { background-color: #448aca; color: #fff; }
.orange-title { background-color: #eb6100; color: #fff; }

.red-box {
	border: 1px solid #e51118;
	padding: 20px;
	text-align: center;
	font-size: 118.71%;
	line-height: 1.5;
}
.blue-box {
	border: 3px solid #184ea0;
	padding: 20px;
	text-align: center;
	font-size: 118.71%;
	line-height: 1.5;
}
/* --------------------------------
	各種ボタン
-------------------------------- */
.price-btn-links a,
.treatment-btn-links a,
.voice-btn-links a,
.reserve-btn-links a {
	display: block;
	text-align: center;
	font-size: 128%;
	color: #fff;
	background-color: #cd667c;
	padding: 20px 10px;
	margin: 0 auto 50px;
}
/* 予約 */
.reserve-btn-links a:hover { background-color: #cd667c; }
/* 料金表 */
.price-btn-links a:hover { background-color: #b9475c; }
/* 症状別治療例 */
.treatment-btn-links a { background-color: #45b87a; }
.treatment-btn-links a:hover { background-color: #107e33; }
/* 患者様の声 */
.voice-btn-links a {
	background-color: #448aca;
	font-size: 118%;
	width: 80%;
	margin: 0 auto 20px;
}
.voice-btn-links a:hover { background-color: #124ba0; }
.reserve-btn-links a:hover { background-color: #b9475c; }
.reserve-btn-links a:before {
	content: "";
	position: absolute;
	background-image:url("../../images/icon-reservation.png");
	background-size: 30px 30px;
	/*background-position: 10px 5px;*/
	width:30px;
	height:30px;
	margin-top:-4px;
	margin-left:-42px;
}

/* --------------------------------
	table テーブルフォーマット
-------------------------------- */
.f-gray_tbl {
	width: 100%;
	font-size: 108%;
	border-collapse: collapse;
}
.f-gray_tbl th {
	width: 30%;
	padding: 15px;
	text-align: center;
	vertical-align: top;
	color: #333;
	background-color: #fafafa;
	border: 1px solid #eee;
	vertical-align: middle;
	text-align: center;
	font-family: "Noto Sans JP", "Hiragino Sans", "Yu Gothic", "Meiryo", sans-serif;
}
.f-gray_tbl td {
	padding: 15px;
	background-color: #fff;
	border: 1px solid #eee;
	vertical-align: middle;
	line-height: 1.5;
}

/* --------------------------------
	flow 治療の流れ
-------------------------------- */
.step-point {
	background-color: #cd667c;
	color: #fff;
	font-size: 118%;
	padding: 15px 20px;
	margin: 30px 0;
	display: inline-table;

	-moz-border-radius: 1.5em;
	-webkit-border-radius: 1.5em;
	-o-border-radius: 1.5em;
	-ms-border-radius: 1.5em;
    border-radius: 1.5em;
    -webkit-transform: translateZ(0);
}
.type-point-s {
	font-size: 118%;
	text-align: center;
	margin: 35px 0 50px;
}
.type-point-s span a {
	padding: 10px 20px;
	margin-right: 20px;
	background-color: #32b16c;
	color: #fff;
	-moz-border-radius: 1.7em;
	-webkit-border-radius: 1.7em;
	-o-border-radius: 1.7em;
	-ms-border-radius: 1.7em;
    border-radius: 1.7em;
}
.type-point-s span:first-of-type {
	margin-left: 0px;
}

/* --------------------------------
	simulation-block シュミレーション
-------------------------------- */
#simulation-block {
	background: url('../../images/common/img-simulation.webp') no-repeat top center;
	height: 562px;
	margin-bottom: 10px;
}
#simulation-block .content-title {
	padding-top: 100px;
}
#simulation-block .simulation-desc {
	font-size: 146.71%;
	line-height: 1.7;
	background-color: rgba(245,245,245,0.3);
	border: 1px solid #eee;
	margin: 50px 0 30px;
	padding: 20px 70px;
	text-align: center;
	display: inline-block;
}

/* --------------------------------
	links-btn 枠ボタン
-------------------------------- */
.links-btn a {
	display:block; /*ブロック化*/
	padding: 28px 40px 28px 15px; /*a要素の領域を拡大*/
	text-decoration:none;
	font-size: 176.71%;
	background-color: #fff;
	border: 1px solid #e51118;
	color: #e51118;
	font-family: "Noto Sans JP", "Hiragino Sans", "Yu Gothic", "Meiryo", sans-serif;
	font-weight: 500;
	text-align: center;
	position:relative;
}
.links-btn a:hover {
	background: #e51118;
	color: #fff;
}
.links-btn a:hover:after {
	border-top: #fff 4px solid;
	border-right: #fff 4px solid;
}
.links-btn a:after {
	content:"";
	display:block;

	width: 15px;
	height: 15px;
	border-top: #e51118 4px solid;
	border-right: #e51118 4px solid;

	-webkit-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	transform: rotate(45deg);

	position:absolute;
	right: 25px;

	top:0;
	bottom:0;
	margin:auto;
}

/* --------------------------------
	content-title-s
-------------------------------- */
.content-title-s {
	font-size: 224.71%;
	text-align: center;
	padding: 30px 0 10px;
	font-family: "Noto Sans JP", "Hiragino Sans", "Yu Gothic", "Meiryo", sans-serif;
	font-weight: 400;
}

/* モーダルCSS */
.modal {
  display: none;
  vertical-align: middle;
  position: relative;
  z-index: 2;
  max-width: 600px;
  box-sizing: border-box;
  width: 90%;
  background: #fff;
  padding: 15px 0px;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  -o-border-radius: 8px;
  -ms-border-radius: 8px;
  border-radius: 8px;
  -webkit-box-shadow: 0 0 10px #000;
  -moz-box-shadow: 0 0 10px #000;
  -o-box-shadow: 0 0 10px #000;
  -ms-box-shadow: 0 0 10px #000;
  box-shadow: 0 0 10px #000;
  text-align: center;
}
.info-area li {
	display: inline-block;
	width: 50%;
	background-color: gray;
}
.info-area li:first-child {
	background-color: aqua;
}
/* ************************************************************************ */
/* ************************************************************************ */

/* PC SIZE */
@media screen and (min-width: 980px){
	/* --------------------------------
		cover ヘッダー段差
	-------------------------------- */
	.u-cover {
		position: relative;
		background-color: #fff;
		height: 23px;
		top: 0;
		left: 0;
		right: 0;
		width: 980px;
		z-index: 999;
		margin: 0 auto;
		border-bottom: 3px solid #a7c54a;
	}
	/* --------------------------------
		reset
	-------------------------------- */
	#main p {
		font-size: 118%;
		line-height: 1.8;
	}
	/* --------------------------------
		並列ブロック
	-------------------------------- */
	.ps-left,
	.ps-right {
		float: left;
		display: table-cell;
	}
	.ps-right {
		margin-left: 10px;
	}
	/* 左画像 */
	.half-image .ps-left { width: 488px; }
	.half-image .ps-right { width: 482px; }
	/* お客様の声 */
	.voice-image { display: table; }
	.voice-image .ps-left { width: 358px; }
	.voice-image .ps-right { width: 612px; }
	/* 割引回数券 */
	.left-ticket { width: 600px; }
	/* --------------------------------
		footer-time-ticket フッター部分受付時間／クーポン
	-------------------------------- */
	#footer-time-ticket .footer-coupon { width: 330px; }
	/* --------------------------------
		content-title-s
	-------------------------------- */
	.content-title-s {
		padding: 80px 0 10px;
	}
}

/* ************************************************************************ */
/* ************************************************************************ */

/* SMARTPHONES SIZE */
@media screen and (max-width: 980px){
	/* --------------------------------
		reset
	-------------------------------- */
	#page-inlinks {
		margin-top: 20px;
	}
	p {
		font-size: 112%;
		line-height: 1.6;
	}
	.adjust {
		width: 80% !important;
	}
	.sp-st { margin-top: 30px; }
	.yellow-box,
	.green-box,
	.blue-box,
	.p-blue-box,
	.p-red-box,
	.orange-box {
		padding: 3%;
	}
	/* スペース調整 */
	.half-image .ps-right,
	.voice-image ul {
		margin-top: 20px;
	}
	.page-title,
	.content-title,
	.sub-content-title {
		font-family: "Noto Sans JP", "Hiragino Sans", "Yu Gothic", "Meiryo", sans-serif;
	}
	/* --------------------------------
		page-title タイトル
	-------------------------------- */
	#page-title-block {
		padding-bottom: 15px;
		margin-bottom: 0px;
		border-bottom: 4px solid #ccc;
	}
	/* --------------------------------
		page-title ページタイトル
	-------------------------------- */
	h1.page-title {
		font-size: 168%;
		font-family: "Noto Sans JP", "Hiragino Sans", "Yu Gothic", "Meiryo", sans-serif;
	}
	/* --------------------------------
		simulation-block シュミレーション
	-------------------------------- */
	#simulation-block {
		background: url('../../images/common/img-simulation-480.webp') no-repeat top right;
		height: 432px;
	}
	#simulation-block .content-title-s {
		padding-top: 50px;
		text-shadow: 1px 2px 1px #fff;
	}
	#simulation-block .simulation-desc {
		font-size: 118.71%;
		background-color: rgba(245,245,245,0.5);
		margin: 30px 0 30px;
		padding: 10px 20px;
	}
}
/* SMALL SMARTPHONES SIZE */
@media screen and (max-width: 600px){
	.sp-l { text-align: left; }
}
@media screen and (max-width: 480px){
	/* --------------------------------
		page-title タイトル
	-------------------------------- */
	.page-title {
		font-size: 168.71%;
	}

	/* --------------------------------
		content-title タイトル
	-------------------------------- */
	.content-title { font-size: 184.71%; }
	.content-title-s { font-size: 204.71%; }
	/* --------------------------------
		links-btn 枠ボタン
	-------------------------------- */
	.links-btn a {
		font-size: 128.71%;
		padding: 20px 40px 20px 10px; /*a要素の領域を拡大*/
	}
	.links-btn a:after {
		width: 10px;
		height: 10px;
		border-top: #eb6877 2px solid;
		border-right: #eb6877 2px solid;
		right: 20px;
	}
	.links-btn a:hover:after {
		border-top: #fff 2px solid;
		border-right: #fff 2px solid;
	}
	.blue-line-title,
	.red-line-title {
		font-size: 148.71%;
	}
}
@media screen and (max-width: 350px){
}
