@charset "utf-8";

#main { margin:0; width:auto; }

@media all and (min-width: 0) and (max-width: 767px) {
#main { padding-top:100px; margin:0; }
#container { padding:0; }
}

#taiho dd { white-space:pre-wrap; }




/*------------------------------------------------------------
	index
------------------------------------------------------------*/
.index .bgBox {
	padding-bottom: 80px;
	background-color: #F1E8DF;
}

.index .mainVisual img {
	margin-top: -1%;
	width: 82.2%;
	height:auto;
}

/****************************************************
		あいさつ
****************************************************/
.index .subBox {
	position: relative;
	width: 996px;
	margin: 0 auto 90px;
}

.index .subBox .txtImg {
	position: absolute;
	left: 0px;
	top: -80px;
	width: 33px;
}

.index .subBox .textBox {
	margin-top: -57px;
	padding: 84px 0 90px;
	float: right;
	width: 790px;
	text-align: center;
	background-color: #fff;
}

.index .subBox .textBox .title {
	margin-bottom: 50px;
	font-size: 28px;
	color: #1E1E1E;
	letter-spacing: 4px;
	line-height: 1.5;
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}

.index .subBox .textBox p {
	margin-bottom: 49px;
	line-height: 2;
}

/****************************************************
		バナー
****************************************************/
.index .bannerBox {
	position: relative;
	width: 996px;
	margin: 0 auto 50px;
}

.index .bannerBox .link {
	text-align: center;
}

.index .bannerBox .link a {
	position: relative;
	top: -105px;
	left: -185px;
	padding: 10px 0 9px;
	width: 240px;
	margin: 0 auto;
	color: #fff;
	display: block;
	font-size: 14px;
	text-decoration: none;
	background: #FD7275 url(../img/common/icon01.gif) no-repeat 93% center;
	background-size: 4px auto;
}

.index .bannerBox .link a:hover {
	opacity: 0.7;
	text-decoration: none;
}

/****************************************************
		おしらせ
****************************************************/
.index .newsBox {
	width: 994px;
	margin: 0 auto 87px;
}

.index .newsBox .lPhoto {
	padding-top: 36px;
	float: left;
}

.index .newsBox .lPhoto img {
	margin-left: -1px;
	width: 156px;
}

.index .newsBox .textBox {
	float: right;
	width: 792px;
}

.index .newsBox .textBox dl {
	border-top: 1px solid #E2DBD3;
}

.index .newsBox .textBox dt {
	padding: 26px 0 0 20px;
	float: left;
}

.index .newsBox .textBox dd {
	padding: 26px 0 27px 10.2em;
	border-bottom: 1px solid #E2DBD3;
}

/****************************************************
		3点セットメニュー
****************************************************/
.index .photoList {
	margin: 0 auto;
	width: 996px;
}

.index .photoList li {
	margin-right: 6px;
	float: left;
	width: 328px;
}

.index .photoList li a {
	text-decoration: none;
	display: block;
}

.index .photoList li:last-child {
	margin: 0;
}

.index .photoList li a:hover {
	opacity: 0.7;
}

.index .photoList li .text {
	padding: 20px 0 0 17px;
	display: block;
	font-size: 19px;
	background: url(../img/common/icon02.png) no-repeat 94.5% 35px;
	background-size: 8px auto;
}

.index .photoList li .text span {
	margin-bottom: 2px;
	font-size: 15px;
	display: block;
}

/****************************************************
		このようなお悩みありませんか？
****************************************************/
.index .secBox01 {
	padding: 87px 0 92px;
	margin: 0 auto;
	width: 998px;
}

.index .secBox01 .listUl li {
	padding: 0 16px;
	float: left;
	width: 300px;
	text-align: center;
	border-right: 1px solid #EBEBEB;
}

.index .secBox01 .listUl li a {
	display: block;
	text-decoration: none;
}

.index .secBox01 .listUl li a:hover {
	opacity: 0.7;
}

.index .secBox01 .listUl li:last-child {
	border-right: none;
}

.index .secBox01 .listUl li img {
	display: block;
	margin: -4px auto 10px;
	width: 61%;
}

.index .secBox01 .listUl li .text {
	margin-bottom: 5px;
	display: block;
	font-size: 16px;
}

.index .secBox01 .listUl li .more {
	padding-right: 15px;
	color: #F57173;
	font-size: 13px;
	background: url(../img/common/icon03.png) no-repeat right 6px;
	background-size: 5px auto;
}

/****************************************************
		どうして矯正治療がひつようなの？
****************************************************/
.index .secBox02 {
	padding: 88px 0 0;
	background-color: #F1E8DF;
}

.index .secBox02 .content {
	width: 998px;
	margin: 0 auto;
}

.index .secBox02 .photoBox {
	padding-top: 24px;
	float: right;
	width: 30.5%;
}

.index .secBox02 .photoBox img {
	width: 100%;
}

.index .secBox02 .textBox {
	width: 665px;
	float: left;
}

.index .secBox02 .textBox .headLine01 {
	margin-bottom: 42px;
}

.index .secBox02 .textBox p {
	margin-bottom: 77px;
	line-height: 2;
	letter-spacing: -0.5px;
}

.index .secBox02 .textBox .comLink {
	text-align: center;
}

.index .secBox02 .textBox .comLink a {
	margin: 0;
}

/****************************************************
		矯正装置はじめてコース
****************************************************/
.index .secBox03 {
	padding: 32px 0 32px;
	background: url(../img/index/sec_box04_bg.jpg) no-repeat center top;
}

.index .secBox03 .content {
	width: 996px;
	margin: 0 auto;
}

.index .secBox03 .lBox {
	float: left;
	height: 408px;
	background: url(../img/index/bg01.png) no-repeat left top;
	width: 498px;
	background-size: 100% auto;
}

.index .secBox03 .lBox p {
	padding-top: 149px;
	color: #fff;
	font-size: 26px;
	text-align: center;
}

.index .secBox03 .lBox p span {
	margin-bottom: 4px;
	font-size: 20px;
	display: inline-block;
	position: relative;
}

.index .secBox03 .lBox p span:before {
	width: 14px;
	height: 19px;
	background: url(../img/index/line01.png) no-repeat;
	background-size: 14px auto;
	position: absolute;
	left: -32px;
	top: 6px;

	content: "";
}

.index .secBox03 .lBox p span:after {
	width: 14px;
	height: 19px;
	background: url(../img/index/line02.png) no-repeat;
	background-size: 14px auto;
	position: absolute;
	right: -32px;
	top: 6px;

	content: "";
}

.index .secBox03 .rBox {
	width: 498px;
	height: 408px;
	float: right;
	box-sizing: border-box;
	background: url(../img/index/bg02.png) no-repeat right top;
	background-size: 100% auto;
}

.index .secBox03 .rBox p {
	padding: 53px 47px 33px;
	line-height: 1.85;
}

.index .secBox03 .rBox dl {
	padding-left: 47px;
}

.index .secBox03 .rBox dt {
	padding: 10px 0;
	float: left;
	width: 130px;
	font-size: 13px;
	font-weight: bold;
	text-align: center;
	letter-spacing: 1px;
	border: 1px solid #EBEBEB;
}

.index .secBox03 .rBox dd {
	padding: 3px 0 8px 142px;
	color: #F57173;
	font-size: 25px;
	font-weight: bold;
}

.index .secBox03 .rBox dd .price {
	font-size: 18px;
}

.index .secBox03 .rBox dd .text {
	font-size: 15px;
}

/****************************************************
		グーグルマップ
****************************************************/
.index .map {
	margin-bottom: -37.5px;
}

.index .map iframe {
	vertical-align: top;
}

@media all and (min-width: 0) and (max-width: 767px) {
	.index .bgBox {
		padding-bottom: 37px;
	}

	.index .mainVisual img {
		margin: 0;
		width: 100%;
		height:auto;
	}

	.index .subBox {
		margin: -20px 32px 35px;
		width: auto;
	}

	.index .subBox .textBox {
		margin: 0;
		padding: 52px 16px;
		width: auto;
		position: relative;
	}

	.index .subBox .textBox .spImg {
		position: absolute;
		right: -20px;
		top: -57px;
		width: 114px;
		height:auto;
	}

	.index .subBox .textBox .title {
		margin: 0 0 32px;
		font-size: 19px;
	}

	.index .subBox .textBox p {
		margin: 0 10px 40px;
		line-height: 1.8;
	}

	/****************************************************
		バナー
****************************************************/
	.index .bannerBox {
		margin: 0 32px 35px;
		width: auto;
	}

	.index .bannerBox img {
		margin: 0 auto;
		width: 100%;
		height:auto;
		display: block;
	}

	.index .newsBox {
		margin: 0 33px 59px;
		width: auto;
	}

	.index .newsBox .lPhoto {
		padding-top: 33px;
		float: none;
		margin: 0 auto 7px;
	}

	.index .newsBox .lPhoto img {
		margin: 0 auto;
		width: 100px;
		height:auto;
		display: block;
	}

	.index .newsBox .textBox {
		float: none;
		width: 100%;
	}

	.index .newsBox .textBox dl {
		border: none;
		line-height: 1.8;
	}

	.index .newsBox .textBox dt {
		padding: 12px 0 1px 0px;
		float: left;
		width: 100%;
		font-size: 11px;
	}

	.index .newsBox .textBox dd {
		padding: 24px 0 10px 0;
		font-size: 12px;
		border-bottom: 1px solid #E2DBD3;
	}

	.index .photoList {
		margin: 0 31px;
		width: auto;
	}

	.index .photoList li {
		margin: 0 0 5px;
		float: left;
		width: 100%;
	}

	.index .photoList li a {
		display: table;
	}

	.index .photoList li .imgSpan {
		padding-right: 13px;
		display: table-cell;
		vertical-align: middle;
		width: 56.5%;
	}

	.index .photoList li .imgSpan img {
		width: 100%;
		height:auto;
	}

	.index .photoList li:last-child {
		margin: 0;
	}

	.index .photoList li .text {
		padding: 0 0 28px;
		display: table-cell;
		vertical-align: middle;
		font-size: 15px;
		background: url(../img/common/icon02.png) no-repeat 60px 75%;
		background-size: 4px auto;
	}

	.index .photoList li .text span {
		margin-bottom: 1px;
		font-size: 12px;
	}

	.index .secBox01 {
		padding: 40px 31px 22px;
		margin: 0 auto;
		width: auto;
	}

	.index .secBox01 .listUl {
		padding-top: 2px;
	}

	.index .secBox01 .listUl li {
		padding: 12px 0 12px;
		float: left;
		width: 100%;
		text-align: left;
		border-bottom: 1px solid #EBEBEB;
		border-right: none;
	}

	.index .secBox01 .listUl li a {
		display: table;
	}

	.index .secBox01 .listUl li:last-child {
		border-bottom: none;
	}

	.index .secBox01 .listUl li .imgSpan {
		padding-right: 24px;
		display: table-cell;
		vertical-align: middle;
		width: 36.5%;
	}

	.index .secBox01 .listUl li img {
		display: block;
		margin: 0;
		width: 100%;
		height:auto;
	}

	.index .secBox01 .listUl li .rBox {
		display: table-cell;
		vertical-align: middle;
	}

	.index .secBox01 .listUl li .text {
		margin-bottom: 11px;
		display: block;
		font-size: 12px;
		line-height: 1.65;
	}

	.index .secBox01 .listUl li .more {
		padding-right: 15px;
		font-size: 12px;
		background: url(../img/common/icon03.png) no-repeat right 5px;
		background-size: 5px auto;
	}

	.index .secBox02 {
		padding: 40px 31px 53px;
		background-color: #F1E8DF;
	}

	.index .secBox02 .content {
		width: auto;
		margin: 0 auto;
		position: relative;
	}

	.index .secBox02 .photoBox {
		padding: 0;
		width: 48.5%;
		float: none;
		position: absolute;
		right: 0;
		bottom: -53px;
	}

	.index .secBox02 .photoBox img {
		margin: 0;
		width: 100%;
		height:auto;
	}

	.index .secBox02 .textBox {
		width: auto;
		float: none;
		position: relative;
		z-index: 100;
	}

	.index .secBox02 .textBox .headLine01 {
		margin-bottom: 28px;
	}

	.index .secBox02 .textBox p {
		margin-bottom: 29px;
		line-height: 1.8;
	}

	.index .secBox02 .textBox .comLink {
		text-align: center;
	}

	.index .secBox02 .textBox .comLink a {
		margin: 0;
	}

	.index .secBox03 {
		padding: 30px 28px 30px 31px;
		background: url(../img/index/sp_sec_box04_bg.jpg) no-repeat center top;
		background-size: cover;
	}

	.index .secBox03 .content {
		width: auto;
	}

	.index .secBox03 .lBox {
		padding: 1px 1px 0;
		float: none;
		height: auto;
		width: 100%;
		background: none;
		border: 2px solid #FD7275;
		box-sizing: border-box;
		border-bottom: none;
	}

	.index .secBox03 .lBox .spBorder {
		background-color: #FD7275;
	}

	.index .secBox03 .lBox p {
		padding: 45px 0 51px;
		color: #fff;
		font-size: 17px;
		line-height: 1.4;
		text-align: center;
	}

	.index .secBox03 .lBox p span {
		margin-bottom: 4px;
		font-size: 14px;
		display: inline-block;
		position: relative;
	}

	.index .secBox03 .lBox p span:before {
		width: 9px;
		height: 14px;
		background: url(../img/index/line01.png) no-repeat;
		background-size: 9px auto;
		position: absolute;
		left: -22px;
		top: 4px;

		content: "";
	}

	.index .secBox03 .lBox p span:after {
		width: 9px;
		height: 14px;
		background: url(../img/index/line02.png) no-repeat;
		background-size: 9px auto;
		position: absolute;
		right: -22px;
		top: 4px;

		content: "";
	}

	.index .secBox03 .rBox {
		padding: 0 1px 1px;
		width: 100%;
		height: auto;
		float: none;
		box-sizing: border-box;
		background: none;
		border: 2px solid #fff;
		border-top: none;
	}

	.index .secBox03 .rBox .spBorder {
		padding-bottom: 32px;
		background-color: #fff;
	}

	.index .secBox03 .rBox p {
		padding: 17px 20px 23px;
		line-height: 1.85;
	}

	.index .secBox03 .rBox dl {
		padding: 0 20px;
	}

	.index .secBox03 .rBox dt {
		padding: 5px 0;
		width: 90px;
		font-size: 10px;
	}

	.index .secBox03 .rBox dd {
		padding: 3px 0 3px 100px;
		color: #F57173;
		font-size: 17.5px;
		font-weight: bold;
	}

	.index .secBox03 .rBox dd .price {
		font-size: 13px;
	}

	.index .secBox03 .rBox dd .text {
		font-size: 10px;
	}

	.index .map {
		margin-bottom: -19px;
	}

	.index .map iframe {
		height: 276px !important;
	}
}




/*** add 200320 ***/

.index .covid {
	width: 650px;
	margin: 0 auto 87px;
	background: #fff;
	padding: 84px 80px 90px;
	text-align: center;
}

.index .covid .ttl {
	font-size: 23px;
	color: red;
	margin-bottom: 25px;
}

.index .covid .txt {
	line-height: 2;
	font-size: 16px;
}

@media all and (min-width: 0) and (max-width: 767px) {
	.index .covid {
		margin: 0;
		padding: 52px 16px;
		width: auto;
		position: relative;
	}

	.index .covid .ttl {
		font-size: 16px;
		margin-bottom: 18px;
	}

	.index .covid .txt {
		line-height: 1.8;
		font-size: 13px;
		text-align: left;
	}

	.index .covid .txt span {
		display: block;
		text-align: right;
	}

}

/*** 200320 end ***/




.index .bannerUl {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	width: 996px;
	margin: 0 auto 82px;
}

.index .bannerUl a:hover {
	opacity: 0.7
}

.index .bannerUl li {
	margin-bottom: 15px;
}




@media all and (min-width: 0) and (max-width: 767px) {
	.index .bannerUl {
		display: block;
		margin: 0 31px 57px;
		width: auto;
	}

	.index .bannerUl li {
		width: 100%;
		margin-bottom: 32px;
	}

	.index .bannerUl li:last-child {
		margin-bottom: 0;
	}

	.index .bannerUl li img {
		width: 100%;
		height:auto;
	}
}

.dx-box { font-size: 13px; width: 996px; margin: 24px auto; padding: 40px; background-color: #F1E8DF; position: relative; }

.dx-box ul {text-indent: -1em; padding-left: 1em;}

.dx-box .icon { position: absolute; right: 0; bottom: 0;}

.dx-box .icon img {width: 27px;}

@media all and (min-width: 0) and (max-width: 767px) {
	
.dx-box { width: 80vw; font-size: 10px; padding: 24px;}
	
}