@charset "UTF-8";

/*============================================
 2014.04.21
 common.css
 ============================================*/

/* 基本
 ------------------------------------------- */
body {
	color: #0c0c0c;
	font: 13px/1.6 "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	-webkit-text-size-adjust: none;
}

a:link {
	color: #ff3d6e;
	text-decoration: none;
}
a:visited {
	color: #ff6f93;
	text-decoration: underline;
}
a:hover {
	color: #ff6f93;
	text-decoration: underline;
}
a:active {
	color: #ff3d6e;
	text-decoration: none;
}

.f1 {
	font-size: 11px;
}
.f2 {
	font-size: 13px;
}
.f3 {
	font-size: 16px;
}

.fl_l {
	float: left;
}

.fl_r {
	float: right;
}

.he_58 {
	height: 58px !important;
}

/* 共通
 ------------------------------------------- */
.wrap {
	margin: 0 auto;
	width: 960px;
}
/* ヘッダー
 ------------------------------------------- */
#header {
	background: url(../img/common/hdr_line.gif) repeat-x;
}
#header .wrap {
	padding: 17px 0 13px;
}
h1 {
	float: left;
	width: 340px;
}
#header .info {
	float: right;
	width: 437px;
}
#header .info .call {
	float: left;
	padding: 11px 0 0;
	width: 196px;
}
#header .info .call .tel {
	padding: 0 0 5px;
	margin: 0 0 3px;
	background: url(../img/common/two_dotted.gif) repeat-x left bottom;
}
#header .info .size {
	float: right;
	margin: 0 0 10px;
	width: 152px;
	background: url(../img/common/hdr_size_ttl.png) no-repeat left 8px;
}
#header .info .size li {
	float: right;
	margin-left: 4px;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
}
#header .info .size li a {
	display: block;
}
#header .info .size li.size_s {
	padding: 4px 0 0;
}
#header .info .size li.size_s a {
	width: 21px;
	height: 21px;
	background: url(../img/common/size_s_n.png) no-repeat;
}
#header .info .size li.size_s a.textresizer-active {
	background: url(../img/common/size_s_o.png) no-repeat;
}
#header .info .size li.size_m {
	padding: 2px 0 0;
}
#header .info .size li.size_m a {
	width: 23px;
	height: 23px;
	background: url(../img/common/size_m_n.png) no-repeat;
}
#header .info .size li.size_m a.textresizer-active {
	background: url(../img/common/size_m_o.png) no-repeat;
}
#header .info .size li.size_l a {
	width: 25px;
	height: 25px;
	background: url(../img/common/size_l_n.png) no-repeat;
}
#header .info .size li.size_l a.textresizer-active {
	background: url(../img/common/size_l_o.png) no-repeat;
}
#header .info .hdr_contact {
	float: right;
	width: 218px;
}

/* ナビゲーション
 ------------------------------------------- */
#nav {
	height: 78px;
	background: url(../img/common/nav_bg.png) repeat-x;
}
#home #nav {
	height: 78px;
	background: url(../img/home/home_nav_bg.png) repeat-x;
}
#nav ul li {
	float: left;
	height: 71px;
}
#nav ul li a {
	display: block;
}
#nav ul li.nav_home {
	width: 56px;
	background: url(../img/common/nav_home_on.png) no-repeat;
}
#home #nav ul li.nav_home img {
	visibility: hidden;
}
#nav ul li.nav_about {
	width: 185px;
	background: url(../img/common/nav_about_on.png) no-repeat;
}
#about #nav ul li.nav_about img {
	visibility: hidden;
}
#nav ul li.nav_day {
	width: 181px;
	background: url(../img/common/nav_day_on.png) no-repeat;
}
#day #nav ul li.nav_day img {
	visibility: hidden;
}
#nav ul li.nav_treatment {
	width: 182px;
	background: url(../img/common/nav_treatment_on.png) no-repeat;
}
#treatment #nav ul li.nav_treatment img {
	visibility: hidden;
}
#nav ul li.nav_voice {
	width: 105px;
	background: url(../img/common/nav_voice_on.png) no-repeat;
}
#voice #nav ul li.nav_voice img {
	visibility: hidden;
}
#nav ul li.nav_qa {
	width: 117px;
	background: url(../img/common/nav_qa_on.png) no-repeat;
}
#qa #nav ul li.nav_qa img {
	visibility: hidden;
}
#nav ul li.nav_entry {
	width: 134px;
	background: url(../img/common/nav_entry_on.png) no-repeat;
}
#entry #nav ul li.nav_entry img {
	visibility: hidden;
}

/* メイン
 ------------------------------------------- */
#breadcrumb {
	font-size: 93%;
}
#breadcrumb ul {
	padding: 15px 0 0;
}
#breadcrumb ul li {
	display: inline;
	margin-right: 5px;
}
#breadcrumb  ul li a {
	line-height: 20px;
	padding-right: 20px;
	background: url(../img/common/bc_bg.gif) no-repeat right center;
}
#container {
	padding: 20px 0 100px;
}
#main {
	float: left;
	width: 714px;
}
#main .contents h2.line {
	padding: 14px 0 0 10px;
	margin: 0 0 30px;
	height: 36px;
	background: url(../img/common/head_bg.gif) repeat-x left center;
}
#main .contents h2.line img, #main .contents h2.line span {
	padding-left: 20px;
	background: url(../img/common/head_ico.png) no-repeat;
}
#main .contents h2.line span {
	font-size: 139%;
	font-weight: bold;
}
#side {
	float: right;
	width: 221px;
}
.w_day {
	margin: 0 0 20px;
}
.contact_box {
	position: relative;
	border: 1px solid #ff3d6e;
}
.contact_box .block {
	padding: 10px 20px 15px 100px;
	background: #f9f8f2;
}
.contact_box .block .lead {
	margin: 0 0 7px;
}
.contact_box .block .info {
	float: left;
	width: 246px;
}
.contact_box .block .info .tel {
	margin: 0 0 7px;
}
.contact_box .block .entry_btn {
	float: right;
	padding: 15px 0 0;
	width: 318px;
}
.cb_chara {
	position: absolute;
	top: 15px;
	left: 18px;
}
#view_table table {
	width: 100%;
	background: #d6d6d6;
}
#view_table table th, #view_table table td {
	padding: 15px 18px;
}
#view_table table th {
	width: 225px;
	font-weight: bold;
	background: #fff7f9;
	border: 1px solid #fff;
}
#view_table table td {
	background: #fff;
}
#news .news_head {
	padding: 10px 13px;
	background: #5f5f5f;
	-webkit-border-radius: 3px 3px 0px 0px;
	-moz-border-radius: 3px 3px 0px 0px;
	border-radius: 3px 3px 0px 0px;
}
#news .news_head h3 {
	float: left;
	width: 127px;
}
#news .news_head .more {
	text-align: right;
	font-size: 85%;
}
#news .news_head .more a {
	padding-left: 10px;
	color: #fff;
	text-decoration: underline;
	background: url(../img/home/news_arrow.png) no-repeat left center;
}
#news .main {
	padding: 1px;
	border-right: 1px solid #d5d5d5;
	border-bottom: 1px solid #d5d5d5;
	border-left: 1px solid #d5d5d5;
}
#news .inner {
	padding: 18px 18px 10px;
	border-right: 1px solid #f2f2f2;
	border-bottom: 1px solid #f2f2f2;
	border-left: 1px solid #f2f2f2;
}
#news dl {
	overflow: hidden;
	clear: both;
	padding: 10px 0;
	height: 1%;
	background: url(../img/common/two_dotted.gif) repeat-x left bottom;
}
#news dt {
	float: left;
	clear: left;
	padding-left: 8px;
	width: 130px;
	color: #666;
}
#news dd {
	float: left;
	width: 530px;
}
#news dd a {
	font-weight: bold;
	text-decoration: underline;
}

/* サイド
 ------------------------------------------- */
#side ul li {
	margin: 0 0 15px;
}
#side ul li.sb_treatment {
	background: url(../img/common/sb_treatment_bnr_on.jpg) no-repeat;
}
#side ul li.sb_day {
	background: url(../img/common/sb_day_bnr_on.jpg) no-repeat;
}
.sb_contact {
	padding: 5px;
	margin: 0 0 15px;
	text-align: center;
	background: url(../img/common/sb_contact_bg.gif);
}
.sb_contact .inner {
	padding: 17px 10px 13px;
	border: 1px solid #d6d6d6;
	background: #fff;
}
.sb_contact h4 {
	padding: 0 0 9px;
	margin: 0 0 3px;
	background: url(../img/common/sb_contact_line.gif) repeat-x left bottom;
}
.sb_contact .tel {
	margin: 0 0 4px;
}
.sb_contact .pc img {
	width: 100%;
}
.sb_contact .hour {
	margin: 0 0 10px;
}
#side ul li.sb_entry {
	background: url(../img/common/sb_entry_on.jpg) no-repeat;
}

/* フッター
 ------------------------------------------- */
#footer {
	background: url(../img/common/ftr_line.gif) repeat-x;
}
#footer .wrap {
	position: relative;
	padding: 35px 0;
}
#footer .wrap .pagetop {
	position: absolute;
	top: -27px;
	right: 0;
}
#footer .foot_main .foot_nav {
	float: left;
	width: 600px;
}
#footer .foot_main .foot_nav ul {
	float: left;
	width: 200px;
}
#footer .foot_main .foot_nav ul li {
	padding-left: 10px;
	margin: 0 0 10px;
	background: url(../img/common/p_arrow.png) no-repeat left center;
}
#footer .foot_main .copy {
	float: right;
	padding: 75px 0 0;
	width: 310px;
	text-align: right;
	font-size: 93%;
}
#footer .foot_main .copy .name {
	font-weight: bold;
}
#footer .foot_main .copy .arr {
	font-size: 93%;
}

/* ////////////////////////// 以下レスポンシブ化記述 /////////////////////////////////////// */

/*--------------------
 追加記述
 ---------------------*/

/* SP,PCでの出し分け
 * --------------------------*/
.sp {
	display: none;
}
.pc {
	display: block;
}
/* テーブルのスマホ時スクロール
 * --------------------------*/
.scroll_table {
	width: 100%;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	margin: 0 0 40px;
}

/* 追加記述のSP時処理
 * ------------------------- */
@media screen and (max-width: 640px) {
	.container {
		width: 100%;
		box-sizing: border-box;
		padding: 0 5%;
	}
	.sp {
		display: block;
	}
	.pc {
		display: none;
	}
	img {
		max-width: 100%;
	}
	.scroll_table {
		overflow: scroll;
		overflow-x: scroll;
	}
	.scroll_table:before {
		content: "※下の表は横にドラッグできます。";
		display: block;
		margin-bottom: 10px;
		font-size: 10px;
		-webkit-font-smoothing: antialiased;
		color: #b70215;
	}
}

/* 以下、common.cssのSP化
 * → 必要なもののみ記載
 * ------------------------- */
@media screen and (max-width: 640px) {

	/* 基本
	 ------------------------------------------- */

	/* 共通
	 ------------------------------------------- */
	.wrap {
		margin: 0 auto;
		width: 100%;
		box-sizing: border-box;
	}
	/* ヘッダー
	 ------------------------------------------- */
	#header {
		background: url(../img/common/hdr_line.gif) repeat-x;
	}
	#header .wrap {
		padding: 17px 10px 13px;
	}
	h1 {
		float: none;
		width: auto;
		text-align: center;
		box-sizing: border-box;
		padding: 0 10px 10px;
		margin: 0 0 10px;
	}
	#header .info {
		float: none;
		width: 100%;
		box-sizing: border-box;
		padding: 0;
	}
	#header .info .call {
		padding: 0;
		width: 48%;
	}
	#header .info .call img {
		width: 100%;
	}
	#header .info .size {
		float: none;
		display: none;
	}
	#header .info .hdr_contact {
		padding-top: 4%;
		width: 48%;
	}
	#header .info .hdr_contact img {
		width: 100%;
	}

	/* ナビゲーション
	 ------------------------------------------- */
	#nav {
		height: auto;
		background-size: auto 100%;
	}
	#home #nav {
		height: auto;
		background: url(../img/home/home_nav_bg.png) repeat-x;
	}
	#nav ul li {
		padding: 0;
		height: auto;
		background-size: 100% auto !important;
	}
	#nav ul li a {
		overflow: hidden;
		height: 0px;
		background-position: left 0px;
		background-repeat: no-repeat;
		background-size: 100% auto;
	}
	#nav ul li img {
		display: none;
	}
	/* nav li */

	#nav ul li {
		width: 25% !important;
	}
	#nav ul li.nav_entry {
		width: 50% !important;
	}
	/* nav a */
	#nav ul li.nav_home a {
		padding-top: 88%;
		background-image: url(../img/common/nav_home_sprite.png);
		
	}
	#home #nav ul li.nav_home a {
	}
	#nav ul li.nav_about a {
		padding-top: 88%;
		background-image: url(../img/common/nav_about_sprite.png);
	}
	#about #nav ul li.nav_about a {
	}
	#nav ul li.nav_day a {
		padding-top: 88%;
		background-image: url(../img/common/nav_day_sprite.png);
	}
	#day #nav ul li.nav_day a {
	}
	#nav ul li.nav_treatment a {
		padding-top: 88%;
		background-image: url(../img/common/nav_treatment_sprite.png);
	}
	#treatment #nav ul li.nav_treatment a {
	}
	#nav ul li.nav_voice a {
		padding-top: 88%;
		background-image: url(../img/common/nav_voice_sprite.png);
	}
	#voice #nav ul li.nav_voice a {
	}
	#nav ul li.nav_qa a {
		padding-top: 88%;
		background-image: url(../img/common/nav_qa_sprite.png);
	}
	#qa #nav ul li.nav_qa a {
	}
	#nav ul li.nav_entry a {
		padding-top: 44%;
		background-image: url(../img/common/nav_entry_sprite.png);
	}
	#entry #nav ul li.nav_entry a {
	}
	#nav ul li.nav_home a:hover,
	#nav ul li.nav_about a:hover,
	#nav ul li.nav_day a:hover,
	#nav ul li.nav_treatment a:hover,
	#nav ul li.nav_voice a:hover,
	#nav ul li.nav_qa a:hover,
	#nav ul li.nav_entry a:hover {
		background-position: 0 100%;
	}
	#nav ul li.nav_home a,
	#nav ul li.nav_about a,
	#nav ul li.nav_day a,
	#nav ul li.nav_treatment a,
	#nav ul li.nav_voice a,
	#nav ul li.nav_qa a,
	#nav ul li.nav_entry a {
		background-position: 0 0;
	}
	#nav ul li.nav_home,
	#nav ul li.nav_about,
	#nav ul li.nav_day,
	#nav ul li.nav_treatment,
	#nav ul li.nav_voice,
	#nav ul li.nav_qa,
	#nav ul li.nav_entry {
		background: none;
	}

	/* メイン
	 ------------------------------------------- */
	#breadcrumb {
		padding: 0 20px;
		font-size: 86%
	}
	#container {
		padding: 20px 0 100px;
	}
	#main {
		float: none;
		width: 100%;
		padding: 0 10px;
		box-sizing: border-box;
	}
	#main .contents h2.line {
		padding: 14px 10px;
		height: auto;
		background-image: none;
		border-top: 1px solid #ddd;
		border-bottom: 1px solid #ddd;
	}
	#main .contents h2.line img, #main .contents h2.line span {
		padding-left: 20px;
		box-sizing: border-box;
	}
	#main .contents h2.line span {
		font-size: 120%;
	}
	#side {
		float: none;
		width: 100%;
		text-align: center;
		padding: 20px 10px 0;
		box-sizing: border-box;
	}
	.w_day {
		margin: 0 0 20px;
	}
	.contact_box {
		max-width: 470px;
		box-sizing: border-box;
		margin: auto;
	}
	.contact_box .block {
		padding: 10px 20px 15px;
		background: #f9f8f2;
		text-align: center;
	}
	.contact_box .block .info {
		float: none;
		width: 100%;
	}
	.contact_box .block .entry_btn {
		float: none;
		width: 100%;
	}
	.cb_chara {
		display: none;
	}
	#view_table table {
		width: 100%;
		background: #d6d6d6;
	}
	#view_table table th {
		padding: 10px 5px;
	}
	#view_table table td {
		padding: 10px 10px;
	}
	#view_table table th {
		width: 35%;
	}
	#company #view_table table th {
		width: 27%;
	}

	/* サイド
	 ------------------------------------------- */
	#side ul li {
		display: inline-block;
		margin: 0 10px 15px;
	}
	#side ul li.sb_treatment {
		background-size: 100% auto;
	}
	#side ul li.sb_day {
		background-size: 100% auto;
	}
	.sb_contact {
		margin: 0 auto 15px;
		max-width: 480px;
		box-sizing: border-box;
	}
	#side ul li.sb_entry {
		display: block;
		max-width: 221px;
		margin-left: auto;
		margin-right: auto;
		background-size: 100% auto;
	}

	/* フッター
	 ------------------------------------------- */
	#footer .wrap {
		padding: 35px 10px;
	}
	#footer .wrap .pagetop {
		right: 10px;
	}
	#footer .foot_main .foot_nav {
		float: none;
		width: auto;
		margin: auto;
		text-align: center;
	}
	#footer .foot_main .foot_nav ul {
		float: none;
		width: 170px;
		margin:auto;
	}
	#footer .foot_main .foot_nav ul li {
		text-align: left;
	}
	#footer .foot_main .copy {
		clear: both;
		float: none;
		padding: 30px 0 0;
		width: 100%;
		text-align: center;
	}
	#footer .foot_main .copy .name {
		font-weight: bold;
	}
	#footer .foot_main .copy .arr {
		font-size: 93%;
	}

	#news dt {
		float: none;
		clear: left;
		padding-left: 0px;
		width: 100%;
		box-sizing:border-box;
		color: #666;
		margin:0 0 5px;
	}
	#news dd {
		float: none;
		width: 100%;
	}
}
