@charset "UTF-8";
@keyframes slide_index {
	0% {
		background-position: 0 0;
	}
	100% {
		background-position: -2100px 0;
	}
}

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

*/
.wrapper {
	width: 100%;
	min-width: 1000px;
}

.pc_container,
.pc_tb_container,
.container {
	width: 1000px;
	box-sizing: border-box;
	margin-left: auto;
	margin-right: auto;
	padding-left: 20px;
	padding-right: 20px;
}

.pc_container-small,
.pc_tb_container-small,
.container-small {
	max-width: 800px;
}

.pc_container-relative,
.pc_tb_container-relative,
.container-relative {
	position: relative;
	top: 0;
	left: 0;
}

.hmenu_area::before,
.hmenu_area::after,
.menu ul::after,
.menu ul::before,
.menu ul::after,
.hmenu1::before,
.hmenu1::after,
.hmenu2::before,
.hmenu2::after,
.like_table::before,
.like_table::after {
	content: '';
	display: table;
	height: 0;
}

.hmenu_area::after,
.menu ul::after,
.hmenu1::after,
.hmenu2::after,
.like_table::after {
	clear: both;
}

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

## Utility - Cosmetic

ユーティリティー設定。
このサイト専用というわけでもない共通設定。

<div class="_h3">.pc</div>
PCの時だけ表示される。

<div class="_h3">.pc_block</div>
PCの時だけ、ブロック要素になる。

<div class="_h3">.tel</div>
SPの時だけ、リンクになる。(クリックで電話するリンク)

*/
.tb,
.sp,
.mb,
.tb_sp,
.contents .tb,
.contents .sp,
.contents .mb,
.contents .tb_sp {
	display: none;
}

.block,
.pc_block {
	display: block;
}

.mm-navbar,
.header .menu .mm-next {
	display: none;
}

.tel {
	pointer-events: none;
	cursor: default;
	color: #000;
	border-bottom: 0 none;
}

.tel.black:hover,
.tel .black:hover {
	color: #333;
}

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



## Component - Base

コンポーネント設定。
各ページでよく使い回す記述。
このサイト専用の共通設定。

*/
/* .no_text */
.menu .sub a {
	text-indent: 120%;
	white-space: nowrap;
	overflow: hidden;
	display: block;
}

.menu .sub .subsub {
	display: none;
}

/*

<div class="_h3">.vertical_middle</div>

適当にテキストを vertical-align: middle

	<div class="vertical_middle">テキスト</div>

*/
.vertical_middle {
	display: table-cell;
	vertical-align: middle;
}

/**************************
.button
*/
.button {
	/*box-sizing: border-box;
	width: 180px;
	margin-left: auto;
	margin-right: auto;*/
}

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

## - 段組設定 2列 3列 4列

PCの時だけ、中央に等間隔で余白を作り、width: 100%; を守って列になる。  
ul でなくてもいい。  

**2列 .pc_column2**

	<ul class="pc_column2">
		<li>コンテンツ</li>
		<li>コンテンツ</li>
		<li>コンテンツ</li>
		<li>コンテンツ</li>
		<li>コンテンツ</li>
	</ul>

**3列 .pc_column3**

	<ul class="pc_column3">
		<li>コンテンツ</li>
		<li>コンテンツ</li>
		<li>コンテンツ</li>
		<li>コンテンツ</li>
		<li>コンテンツ</li>
	</ul>

**4列 .pc_column4**

	<ul class="pc_column4">
		<li>コンテンツ</li>
		<li>コンテンツ</li>
		<li>コンテンツ</li>
		<li>コンテンツ</li>
		<li>コンテンツ</li>
	</ul>

*/
.pc_column2:before,
.pc_column2:after,
.pc_column3:before,
.pc_column3:after,
.pc_column4:before,
.pc_column4:after {
	content: ' ';
	display: table;
}

.pc_column2:after,
.pc_column3:after,
.pc_column4:after {
	clear: both;
}

.pc_column2 > *:nth-child(2n),
.pc_column3 > *:nth-child(3n),
.pc_column4 > *:nth-child(4n) {
	padding-bottom: 20px;
}

.pc_column2 > *:last-child,
.pc_column3 > *:last-child,
.pc_column4 > *:last-child {
	padding-bottom: 0;
}

.pc_column2 > * {
	width: 50%;
	box-sizing: border-box;
	float: left;
}

.pc_column2 > *:nth-child(2n+1) {
	clear: left;
	padding-right: 10px;
}

.pc_column2 > *:nth-child(2n) {
	padding-left: 10px;
}

.pc_column2-info > .main_area {
	margin-right: -400px;
	padding-right: 420px;
	width: 100%;
	padding-left: 0;
}

.pc_column2-info > .sub_area {
	width: 400px;
	padding: 0;
	position: relative;
	top: 0;
	left: 0;
}

.pc_column2-info > .sub_area .pc_bottom {
	position: absolute;
	bottom: 0;
	left: 0;
}

.pc_column2 img {
	max-width: 100%;
}

.pc_column3 > * {
	width: 33.33%;
	box-sizing: border-box;
	float: left;
}

.pc_column3 > *:nth-child(3n+1) {
	clear: left;
	padding-right: 20px;
}

.pc_column3 > *:nth-child(3n+2) {
	padding-left: 10px;
	padding-right: 10px;
}

.pc_column3 > *:nth-child(3n) {
	padding-left: 20px;
}

.pc_column3-medium > *:nth-child(3n+1) {
	clear: left;
	padding-right: 16.666px;
}

.pc_column3-medium > *:nth-child(3n+2) {
	padding-left: 8.333px;
	padding-right: 8.333px;
}

.pc_column3-medium > *:nth-child(3n) {
	padding-left: 16.666px;
}

.pc_column3-partner {
	border-bottom: 1px dotted #9d9d9d;
}

.pc_column3-partner > *:nth-child(3n+1) {
	clear: left;
	padding-right: 0;
}

.pc_column3-partner > *:nth-child(3n+1)::before {
	content: '';
	display: block;
	border-top: 1px dotted #9d9d9d;
	box-sizing: border-box;
	height: 1px;
	width: 300%;
}

.pc_column3-partner > *:nth-child(3n+1),
.pc_column3-partner > *:nth-child(3n+2),
.pc_column3-partner > *:nth-child(3n) {
	padding-bottom: 30px;
}

.pc_column3-partner > *:nth-child(3n+2) {
	padding-left: 0;
	padding-right: 0;
}

.pc_column3-partner > *:nth-child(3n) {
	padding-left: 0;
}

.pc_column3-partner > *:nth-child(3n+1),
.pc_column3-partner > *:nth-child(3n+2) {
	position: relative;
	top: 0;
	left: 0;
}

.pc_column3-partner > *:nth-child(3n+1)::after,
.pc_column3-partner > *:nth-child(3n+2)::after {
	content: '';
	display: block;
	background: url("../img/icon_plus.png") 0 0 no-repeat transparent;
	background-size: 17px 17px;
	width: 17px;
	height: 17px;
	z-index: 1;
	position: absolute;
	top: 0;
	right: 0;
	-ms-transform: translateX(50%) translateY(-50%);
	    transform: translateX(50%) translateY(-50%);
}

.pc_column3-partner > *:nth-child(1)::after,
.pc_column3-partner > *:nth-child(2)::after {
	display: none;
}

.pc_column4 > * {
	width: 25%;
	box-sizing: border-box;
	float: left;
}

.pc_column4 > *:nth-child(4n+1) {
	clear: left;
	padding-right: 14px;
}

.pc_column4 > *:nth-child(4n+2),
.pc_column4 > *:nth-child(4n+3) {
	padding-left: 7px;
	padding-right: 7px;
}

.pc_column4 > *:nth-child(4n) > .inner {
	padding-left: 14px;
}

/**************************
.section
*/
.section p .node,
.section span.p .node {
	margin-left: .5em;
	margin-right: .5em;
}

.section .p-pc_tb_16 {
	font-size: 1em;
}

.section--small {
	margin-bottom: 1em;
}

.section2 {
	margin-bottom: 40px;
}

.section2.section--line {
	padding-bottom: 40px;
}

.section2.section--line--small {
	padding-bottom: 20px;
	margin-bottom: 20px;
	border-bottom: 1px dotted #ccc;
}

.section2.section--line:last-child {
	padding-bottom: 0;
}

.section3 {
	margin-bottom: 1em;
}

.section3 .h5 {
	margin-bottom: .5em;
}

.section4 {
	margin-bottom: 1em;
}

.section4:last-child {
	margin-bottom: 0;
}

/*

<div class="_h3">.pc_indent</div>

左右に余白を作る。 
pc_indent ならPCの時だけ

	<div class="section">
		<h4>電車でお越しの場合</h4>
		<div class="pc_indent">
			<ul class="ul1">
				<li>寒川駅北口を下車、寒川町役場方面へ徒歩約10分です。</li>
				<li>宮山駅を下車、寒川神社方面へ約徒歩12分です。</li>
			</ul>
			<p>寒川病院では、<a href="#">無料で送迎バス</a>を用意させて頂いております。近郊の方はご利用ください。</p>
		</div>
	</div>

*/
.indent,
.pc_indent {
	padding-left: 1em;
	padding-right: 1em;
}

.indent2 {
	padding-left: 1.5em;
	padding-right: 1.5em;
}

/**************************
.line_list
*/
.line_list {
	margin-bottom: 1em;
	text-align: right;
}

.line_list li {
	display: inline-block;
}

.line_list li:not(:last-child) {
	margin-right: 2em;
}

.line_list._center {
	text-align: center;
}

/* form */
.input_frame.node,
.input_frame.node input {
	width: 70px;
	display: inline-block;
}

.input_frame.node2,
.input_frame.node2 input {
	width: 100px;
}

/* bxslider */
.bx-pager {
	height: 16px;
	bottom: 20px;
}

.bx-pager-item {
	margin: auto 15px;
}

.bx-pager-link {
	width: 14px;
	height: 14px;
	border-radius: 7px;
}

.dl1 dt,
.dl1 dd,
.dl2 dt,
.dl2 dd {
	float: left;
}

.dl1 dt,
.dl2 dt {
	clear: both;
	width: 20%;
}

.dl1 dd,
.dl2 dd {
	width: 80%;
}

.dl1--large dt,
.dl2--large dt {
	width: 40%;
}

.dl1--large dd,
.dl2--large dd {
	width: 60%;
}

/*

<div class="_h3">.like_table</div>

PCの時だけ、簡易的に table のような表示をする。
(SPの時には、何もおきない)
横幅が広からず、もろいので注意。

	<div class="like_table">
		<div class="cell row">th のような</div>
		<div class="cell">td のような</div>
		<div class="cell row">th のような</div>
		<div class="cell">td のような</div>
	</div>

*/
.like_table .cell {
	float: left;
	margin-right: 2em;
	white-space: nowrap;
}

.like_table .row,
.like_table .c1 {
	width: 20%;
	clear: both;
}

.like_table.column3 .c2 {
	width: 20%;
}

.like_table._medium .row,
.like_table._medium .c1 {
	width: 40%;
	clear: both;
}

.like_table._large .row,
.like_table._large .c1 {
	width: 60%;
	clear: both;
}

.like_table.__pa .c1 {
	float: none;
	margin-right: 0;
	width: 5em;
	white-space: normal;
	position: absolute;
}

.like_table.__pa .c2::before {
	content: '：';
	display: inline-block;
	width: 1em;
	height: 1em;
	margin-left: -1em;
}

.like_table.__pa .c2 {
	float: none;
	margin-left: 6em;
	white-space: normal;
}

.like_table.sm .row,
.like_table.sm .c1 {
	width: 8%;
	clear: both;
}

.like_table.sm .c2 {
	width: 8%;
}

.like_table.xs .row,
.like_table.xs .c1 {
	width: 5%;
	clear: both;
}

.like_table.column2 .c2,
.like_table.column2 .cell:nth-child(2n) {
	margin-right: 0;
}

.like_table._20per {
	width: 100%;
}

.like_table._20per .cell {
	white-space: normal;
}

.like_table._20per .row {
	clear: left;
	width: 20%;
	margin-right: 0;
}

.like_table._20per .cell:not(.row) {
	padding-left: 22%;
	margin-right: 0;
	margin-left: -22%;
	box-sizing: border-box;
	width: 100%;
}

/*

<div class="_h3">flex</div>

flex 対応ブラウザで flex 表示にする  
非対応ブラウザでは float にする

.flex-order_main_sub で、  
.flex__main 左にしてメインコンテンツ、 ._flex_sub を右にしてサブコンテンツとみなしてレイアウトする

.flex-order_sub_main で、  
.flex_sub 左にしてサブコンテンツ、 .flex__main を右にしてメインコンテンツとみなしてレイアウトする


	<div class="flex flex-column2 flex-order_main_sub">
		<div class="flex__main"></div>
		<div class="flex_sub"></div>
	</div>

*/
.flex,
.pc_flex,
.main_flex {
	box-sizing: border-box;
	display: -ms-flexbox;
	display: flex;
}

.flex-order_main_sub > .flex__main,
.main_flex > .main_container {
	-ms-flex-order: 0;
	    order: 0;
}

.flex-order_main_sub > .flex__sub,
.main_flex > .sub_container {
	-ms-flex-order: 1;
	    order: 1;
}

.flex-order_sub_main > .flex__main,
.main_flex > .main_container {
	-ms-flex-order: 1;
	    order: 1;
}

.flex-order_sub_main > .flex__sub,
.main_flex > .sub_container {
	-ms-flex-order: 0;
	    order: 0;
}

/**************************
.contact_box
*/
.contact_box {
	width: 340px;
	padding: 2.2em;
}

.contact_box__head {
	font-size: 1.125em;
	font-weight: bold;
}

/*

<div class="_h3">電話番号</div>

	<a href="tel:042-323-9200" title="予約センターへ電話をする" class="reserve_tel tel">042-323-9200</a>
	<a href="tel:042-323-5111" title="代表番号へ電話をする" class="rep_tel tel">042-323-5111</a>

*/
.tel_text {
	vertical-align: baseline;
}

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

## Project

特定ページ専用、効果範囲が限定的な記述。
コンテンツ内容に密接で、汎用性がなく、機能の付け替えを想定していない。

*/
.sp_menu {
	display: block !important;
}

.pc_flex-info > .flex__main {
	padding-right: 20px;
}

.pc_flex-info > .flex__main .anotation {
	margin-bottom: 2em;
}

.pc_flex-info > .flex__sub {
	width: 400px;
	min-width: 400px;
	position: relative;
	top: 0;
	left: 0;
}

.pc_flex-info > .flex__sub img {
	max-width: 100%;
}

.pc_flex-info > .flex__sub .pc_bottom {
	position: absolute;
	bottom: 0;
	left: 0;
}

.pc_flex-info > .flex__sub .pc_bottom > img {
	width: 400px;
}

.pc_flex-guest .column {
	width: 33.33%;
	padding-left: 15px;
	padding-right: 15px;
	position: relative;
	top: 0;
	left: 0;
}

.pc_flex-partner .column {
	width: 33.333%;
	border-bottom: 1px dotted #9d9d9d;
	padding-bottom: 30px;
	display: -ms-flexbox;
	display: flex;
}

.pc_flex-partner .column:nth-child(3n+1), .pc_flex-partner .column:nth-child(3n+2) {
	position: relative;
	top: 0;
	left: 0;
}

.pc_flex-partner .column:nth-child(3n+1)::after, .pc_flex-partner .column:nth-child(3n+2)::after {
	content: '';
	display: block;
	background: url("../img/icon_plus.png") 0 0 no-repeat transparent;
	background-size: 17px 17px;
	width: 17px;
	height: 17px;
	z-index: 1;
	position: absolute;
	bottom: 0;
	right: 0;
	-ms-transform: translateX(50%) translateY(50%);
	    transform: translateX(50%) translateY(50%);
}

.person__link {
	position: absolute;
	bottom: 0;
	left: 15px;
	height: 60px;
}

.section-main {
	height: 600px;
}

.section-main-mm {
	height: 200px;
	margin-top: 0;
	padding-top: 16px;
	box-sizing: border-box;
}

.section-main .main_text {
	margin-bottom: 50px;
}

.section-main .main_text-mm {
	height: 166px;
	margin-bottom: 0;
}

.section__content-intro::before {
	background-size: 360px 194px;
	width: 360px;
	height: 194px;
	position: absolute;
	top: -55px;
	left: 63%;
}

.section-whatisthis {
	background-image: url("../img/whatisthis.png"), url("../img/bg-whatisthis.png");
	background-position: center center, 0 0;
	background-repeat: no-repeat, repeat-x;
	height: 700px;
}

.header__li {
	float: left;
	height: 60px;
}

.header__li-button {
	position: absolute;
	top: 0;
	right: 0;
}

.header__li-last {
	position: absolute;
	top: 0;
	right: 96px;
}

.header__a {
	font-size: 1em;
	display: inline-block;
	height: 60px;
	color: #000;
	padding: 13px 1em;
	box-sizing: border-box;
	border-bottom: 0 none;
}

.header__a:hover {
	color: #00357b;
}

.header__a-button {
	color: #fff;
}

.header__a-button:hover {
	color: #fff;
}

.person__link-center {
	-ms-transform: translateX(-0.7em);
	    transform: translateX(-0.7em);
}

.area-person::before, .area-person::after {
	content: '';
	display: table;
}

.area-person::after {
	clear: both;
}

.area-person > .column_sub {
	width: 250px;
	position: relative;
	top: 0;
	left: 0;
	float: left;
	z-index: 2;
}

.area-person > .column_main {
	width: 100%;
	box-sizing: border-box;
	padding-left: 280px;
	margin-left: -250px;
	float: left;
}

.report__section__content::before, .report__section__content::after {
	content: '';
	display: table;
}

.report__section__content::after {
	clear: both;
}

.report__section__content > .column_sub {
	width: 230px;
	position: relative;
	top: 0;
	left: 0;
	float: left;
	z-index: 2;
}

.report__section__content > .column_main {
	width: 100%;
	box-sizing: border-box;
	padding-right: 250px;
	margin-right: -230px;
	float: left;
}

.partner {
	display: -ms-flexbox;
	display: flex;
}

.partner__content {
	padding-bottom: 30px;
}

.partner__rp_button {
	position: absolute;
	bottom: 0;
	left: 0;
}
