@charset "UTF-8";

/* メインイメージ */
.contentpage #header .bg {
	background-image: url(../images/clinic/m_img.jpg);
}





/*共通部分
---------------------------------------------------------*/
#pagebody{
	padding-bottom:95px;
}
.titlebox .title_bg{
	text-align: center;
	background: #ffffff;
	padding-top: 45px;
}
.titlebox p{
	font-size:110%;
	color: #c7af80;
}
.titlebox h4{
  font-style: normal;
  font-weight: 400;
	font-size: 210%;
	letter-spacing: 0.1em;
	padding-bottom: 15px;
	line-height: 1.5em;
}
.titlebox{
	position:relative;
	margin-bottom: 70px;
	padding-top: 240px;
}
.titlebox::before {
	content: "";
	position: absolute;
	width: 1px;
	height: 45px;
	left: 0;
	right: 0;
	top: 100%;
	margin: 0 auto;
}
#quality,#everyone{
	position: relative;
}
#quality:before,#everyone:before {
   width: 100%;
   height:305px;
   content: "";
   position: absolute;
   top: 0;
   left:0;
}
#relaxing,#quality{
	margin-bottom:120px;
}
.c_title{
  font-family: "NotoSansCJKjp-Jxck";
  font-weight: 700;
	font-size: 120%;
	letter-spacing: 0.1em;
	margin-bottom:15px;
	line-height: 1.8em;
}
.main_imgstyle{
	position:relative;
	overflow: hidden;
	margin-bottom: 60px;
}
.main_imgstyle .img_style{
	position:absolute;
	left: 0;
	top:0;
	max-width: 700px;
	width: 60%;
}
.main_imgstyle .bg_box{
	background: #f1eaef;
	width: 60%;
	margin-top:90px;
}
.main_imgstyle .bg_box dl{
	padding: 60px 60px 60px 60px;}

.imgstyle_2 ul{
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}
.imgstyle_2 li{
	text-align:center;
	width: 47%;
	margin-top: 80px;
}
.imgstyle_2 li:nth-child(-n + 2){
	margin-top: 0;
}
.imgstyle_2 li dl{
	margin-top:25px;
}

/* Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) and (max-width: 1000px) {
.main_imgstyle .bg_box dl{
	padding: 7%;}
}

/* Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) and (max-width: 959px) {
#pagebody{
	padding-bottom:60px;
}
.titlebox .title_bg{
	padding-top: 40px;
}
.titlebox{
	margin-bottom: 50px;
	padding-top: 150px;
}
.titlebox::before {
	height: 30px;
}
#quality:before,#everyone:before {
   height:200px;
}
#relaxing,#quality{
	margin-bottom:90px;
}
.main_imgstyle{
	margin-bottom: 60px;
}
.main_imgstyle .img_style{
	width: 55%;
}
.main_imgstyle .bg_box{
	width: 60%;
	margin-top:50px;
}
.main_imgstyle .bg_box dl{
	padding: 7%;}
}
.imgstyle_2 li{
	width: 48%;
	margin-top: 6%;
}


/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {
#pagebody{
	padding-bottom:10%;
}
.titlebox .title_bg{
	padding-top: 5%;
}
.titlebox p{
	font-size:100%;
}
.titlebox h4{
	font-size: 155%;
	letter-spacing: 0.05em;
	padding-bottom: 3%;
}
.titlebox{
	margin-bottom: 40px;
	padding-top: 100px;
}
.titlebox::before {
	height: 20px;
}
#quality:before,#everyone:before {
   height:140px;
}
#relaxing,#quality{
	margin-bottom:10%;
}
.c_title{
	margin-bottom:3%;
	line-height: 1.6em;
}
.main_imgstyle{
	margin-bottom: 8%;
}
.main_imgstyle .img_style{
	width:80%;
}
.main_imgstyle .bg_box{
	background: #f1eaef;
	width: 95%;
	margin-top:50%;
}
.main_imgstyle .bg_box dl{
	padding:10% 7% 7% 7%;}
	
.imgstyle_2 ul{
	display: block;
}
.imgstyle_2 li{
		width: 100%;
	margin-top: 8%!important;
}
.imgstyle_2 li:first-child{
		margin-top: 0;
}
.imgstyle_2 li img{
		width:80%;
		margin: 0 auto;
}	
.imgstyle_2 li dl{
	margin-top:5%;
}
.imgstyle_2 li dd{
	text-align:left;
}	
}





/*lead
---------------------------------------------------------*/
.clinic .lead .slide_list {
	position: relative;
	z-index: 0;
}
.clinic .lead .leadbox{
	background:url(../images/clinic/bg1.jpg) no-repeat center center;
	background-size:cover;
	padding: 0 0 105px 0;
}
.clinic .lead .leadbox .w1200{
	position: relative;
}
.clinic .lead .leadbox h3{
	font-size:700%;
	color: #c7af80;
	font-weight: normal;
	letter-spacing: 0.1em;
	margin-top: -10px;
}
.clinic .lead .leadbox dt{
	font-size:250%;
	color: #0c4f80;
	margin-top: 80px;
}
.clinic .lead .leadbox .txt{
	margin:50px 0 60px 0;
}
.clinic .lead .leadbox dd{
	max-width:650px;
}

/* Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) and (max-width: 959px) {
.clinic .lead .leadbox{
	padding: 0 0 90px 0;
}
.clinic .lead .leadbox h3{
	font-size:600%;
}
.clinic .lead .leadbox dt{
	font-size:250%;
	margin-top: 60px;
}
.clinic .lead .leadbox .txt{
	margin:40px 0 40px 0;
}
}

/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {
.clinic .lead .leadbox{
	background:url(../images/clinic/bg1.jpg) no-repeat center 130%;
	background-size:cover;
	padding: 0 0 20% 0;
}
.clinic .lead .leadbox h3{
	font-size:400%;
	margin-top: -10px;
}
.clinic .lead .leadbox dt{
	font-size:135%;
	margin-top: 5%;
}
.clinic .lead .leadbox .txt{
	margin:5% 0 4% 0;
}
}





/*歯科医院を感じさせないリラックス空間
---------------------------------------------------------*/
#relaxing .titlebox {
	padding-top:0;
}
#relaxing .titlebox .title_bg{
	margin-top: -65px;
}
#relaxing .titlebox h4,
#relaxing .c_title{
	color: #a27190;
}
#relaxing .titlebox::before {
	background: rgba(162,113,144,0.50);
}
#relaxing .main_imgstyle .bg_box dl{
	padding-bottom:90px;
	padding-left: 40%;
}
#relaxing .imgstyle_3 li{
	float: left;
	width: 30%;
	margin-right: 5%;
	max-width: 360px;
}
#relaxing .imgstyle_3 li:last-child{
	margin-right:0%;
}
#relaxing .imgstyle_3 dl{
	text-align: center;
	margin: 30px auto 0 auto;
	max-width: 1000px;
}

/* Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) and (max-width: 959px) {
#relaxing .main_imgstyle .bg_box dl{
	padding-bottom:7%;
	padding-left: 32%;
}
}

/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {
#relaxing .main_imgstyle .bg_box dl{
	padding-bottom:7%;
	padding-left: 7%;
}
#relaxing .imgstyle_3 li{
	width: 32%;
	margin-right: 2%;
}
#relaxing .imgstyle_3 dl{
	margin: 6% auto 0 auto;
}
}





/*質の高い診療を提供するために
---------------------------------------------------------*/
#quality:before {
	background:url(../images/clinic/bg2.jpg) no-repeat top center;
	background-size: cover;
}
#quality .titlebox h4,
#quality .c_title,
#quality .c_title a{
	color: #708acd;
}
#quality .c_title a{
	text-decoration: underline;
}
#quality .c_title a:hover{
	text-decoration: none;
}
#quality .titlebox::before {
	background: rgba(112,138,205,0.50);
}
#quality .main_imgstyle .img_style{
	right: 0;
	left: auto;
}
#quality .main_imgstyle .bg_box dl{
	padding-bottom:70px;
	padding-right: 40%;
}
#quality .main_imgstyle .bg_box{
	background: #e9edf8;
}
#quality .imgstyle_bg{
	background: #e9edf8;
padding: 70px 0;}
#quality .imgstyle_bg .w1230{
	padding:0 3%;
	width: 94%;
	max-width: 1230px;
	position:relative;
	margin: 0 auto;
}
#quality .imgstyle_bg div{
	text-align: center;
	max-width: 780px;
	margin: 0 auto;
}
#quality .imgstyle_bg li:nth-child(1),
#quality .imgstyle_bg li:nth-child(2){
	position: absolute;
	max-width: 228px;
	top: -10px;
}
#quality .imgstyle_bg li:nth-child(1){
	left: 3%;}
#quality .imgstyle_bg li:nth-child(2){
	right: 3%;}
#quality .imgstyle_bg .abs_r{
	position: absolute;
	bottom: -25px;
	right:220px;
}
#quality .imgstyle_bg .abs_l{
	position: absolute;
	bottom: -25px;
	left:220px;
}
#quality .imgstyle_1{
	margin: 80px 0;
}
#quality .imgstyle_1 div{
	float: left;
	width: 60%;
	max-width: 704px;
	text-align: left;
}
#quality .imgstyle_1 dl{
	float: right;
	width:30%;
	padding: 0 5%;
}
#quality .imgstyle_2{
	margin-top: 80px;
}
/* PC調整
------------------------------------------*/
@media only screen and (min-width: 960px) and (max-width: 1230px) {
#quality .imgstyle_bg div{
	width: 80%;
}
#quality .imgstyle_bg li:nth-child(1),
#quality .imgstyle_bg li:nth-child(2){
	top: -15px;
	width: 16%;
}
#quality .imgstyle_bg li:nth-child(1){
	left: 5%;}
#quality .imgstyle_bg li:nth-child(2){
	right: 5%;}	
#quality .imgstyle_bg .abs_r{
	right:200px;
	width: 15%;
}
#quality .imgstyle_bg .abs_l{
	left:200px;
	width: 15%;
}	
}

/* PC調整2
------------------------------------------*/
@media only screen and (min-width: 960px) and (max-width: 1000px) {
#quality .imgstyle_bg div{
	width: 75%;
}
}
/* Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) and (max-width: 959px) {
#quality .main_imgstyle .bg_box dl{
	padding-bottom:7%;
	padding-right:32%;
}
#quality .imgstyle_bg{
padding: 50px 0;}
#quality .imgstyle_bg div{
	width: 80%;
}
#quality .imgstyle_bg li:nth-child(1),
#quality .imgstyle_bg li:nth-child(2){
	top: -10px;
	width: 17%;
}
#quality .imgstyle_bg .abs_r{
	right:150px;
	width: 18%;
}
#quality .imgstyle_bg .abs_l{
	left:150px;
	width: 18%;
}
#quality .imgstyle_1{
	margin: 60px 0;
}
#quality .imgstyle_1 div{
	width: 55%;
}
#quality .imgstyle_1 dl{
	width:40%;
	padding:0 0 0 5%;
}
#quality .imgstyle_2{
	margin-top: 60px;
}
}

/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {
#quality .main_imgstyle .bg_box dl{
	padding-bottom:7%;
	padding-right:7%;
}
#quality .imgstyle_bg{
padding: 7% 0;}
#quality .imgstyle_bg li:nth-child(1),
#quality .imgstyle_bg li:nth-child(2){
	position: relative;
	float: left;
	width: 42%;
	margin-top: 7%;
	z-index: 2;
}
#quality .imgstyle_bg li:nth-child(1){
	padding-left: 8%;
	}
#quality .imgstyle_bg li:nth-child(2){
	padding-right: 8%;}
#quality .imgstyle_bg .abs_r{
	bottom: 20px;
	right:5%;
	width: 40%;
}
#quality .imgstyle_bg .abs_l{
	bottom: 20px;
	left:5%;
	width: 45%;
}
#quality .imgstyle_1{
	margin: 8% 0;
}
#quality .imgstyle_1 div{
	width: 100%;
	margin-bottom: 5%;
}
#quality .imgstyle_1 dl{
	float: none;
	width:100%;
	padding:0%;
}
#quality .imgstyle_1 dt{
	text-align:center;
}
#quality .imgstyle_2{
	margin-top: 8%;
}
}





/*質の高い診療を提供するために
---------------------------------------------------------*/
#everyone:before {
	background:url(../images/clinic/bg3.jpg) no-repeat top center;
	background-size: cover;
}
#everyone .titlebox h4,
#everyone .c_title{
	color: #49b59b;
}
#everyone .titlebox::before {
	background:rgba(73,181,155,0.50);
}
#everyone .main_imgstyle .bg_box dl{
	padding-bottom:135px;
	padding-left: 40%;
}
#everyone .main_imgstyle .bg_box{
	background: #f2f8ea;
}
#everyone .imgstyle_bg{
	background: #f2f8ea;
margin: 120px 0 60px 0;
padding-bottom: 70px;}

#everyone #kids h5{
	text-align:center;
  font-family: "NotoSansCJKjp-Jxck";
  font-weight: 700;
	font-size: 120%;
	letter-spacing: 0.1em;
	margin-bottom:110px;
	line-height: 1.8em;
	color: #49b59b;
	border: #49b59b 3px solid;
	padding: 15px;
}
#everyone #kids .h5_box{
	padding-top: 50px;}
#everyone #kids .box01 {
	margin-bottom: 50px;
}
#everyone #kids .box01 dl{
	text-align: center;
	max-width: 1000px;
	margin:35px auto 0 auto;
}
#everyone #kids .box01 .imgstyle_kids{
	position:relative;
}
#everyone #kids .box01 .imgstyle_kids li{
	width:50%;
	float: left;
}
#everyone #kids .box01 .imgstyle_kids .abs_title{
	text-align:center;
	position: absolute;
	left: 0;
	right:0;
	top: -65px;
	margin: 0 auto;
}
#everyone #kids .box01 .imgstyle_kids .abs_l{
	position: absolute;
	left:4%;
	top: -85px;
}
#everyone #kids .box01 .imgstyle_kids .abs_r{
	position: absolute;
	right: 4%;
	top: -85px;
}
#everyone #kids .box02 li{
	/*float: left;*/
	margin: 0 auto;
	width: 50%;
	box-sizing: border-box;
	/*border-right: 4px dotted #49b59b;*/
	padding-right: 3%;
}
/*#everyone #kids .box02 li:last-child{
	border-right:none;
	padding-right: 0%;
	padding-left: 3%;
}*/
#everyone #kids .box02 div{
	float: left;
	width: 30%;
	max-width: 180px;
}
#everyone #kids .box02 dl{
	float: right;
	width: 65%;
}
#everyone .imgstyle_2_s{
	max-width: 820px;
	margin: 0 auto;
}
#everyone .imgstyle_2_s li{
	width: 45%;
}

/* TB調整
------------------------------------------*/
@media only screen and (min-width: 768px) and (max-width: 1200px) {
#everyone #kids .box01 .imgstyle_kids .abs_title{
	top: -55px;
	width: 40%;
}
#everyone #kids .box01 .imgstyle_kids .abs_l{
	left:0%;
	top: -80px;
	width: 25%;
}
#everyone #kids .box01 .imgstyle_kids .abs_r{
	right: 0%;
	top: -80px;
	width: 25%;
}	
}

/* Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) and (max-width: 959px) {
#everyone .main_imgstyle .bg_box dl{
	padding-bottom:7%;
	padding-left: 32%;
}
#everyone .imgstyle_bg{
margin:70px 0 60px 0;
padding-bottom: 40px;}
#everyone #kids .box01 .imgstyle_kids .abs_title{
	top: -45px;
}
#everyone #kids .box01 .imgstyle_kids .abs_l{
	top: -70px;
}
#everyone #kids .box01 .imgstyle_kids .abs_r{
	top: -70px;
}	
}

/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {
#everyone .main_imgstyle .bg_box dl{
	padding-bottom:7%;
	padding-left:7%;
}
#everyone .imgstyle_bg{
margin: 10% 0 7% 0;
padding-bottom: 7%;}

#everyone #kids h5{
	letter-spacing: 0.1em;
	margin-bottom:5%;
	line-height: 1.6em;
}
#everyone #kids .h5_box{
	padding-top: 7%;}
#everyone #kids .box01 {
	margin-bottom: 8%;
}
#everyone #kids .box01 dl{
	margin:5% auto 0 auto;
}
#everyone #kids .box01 .imgstyle_kids li{
	width:80%;
	float: none;
	margin: 0 auto;
}
#everyone #kids .box01 .imgstyle_kids li:last-child{
	margin:5% auto 3% auto;
}	
#everyone #kids .box01 .imgstyle_kids .abs_title{
	position: static;
	width: 70%;
}
#everyone #kids .box01 .imgstyle_kids .abs_l{
	position: static;
	float: left;
	width: 45%;
}
#everyone #kids .box01 .imgstyle_kids .abs_r{
	position: static;
	float: left;
	width: 45%;
}
#everyone #kids .box02 li{
	float: none;
	width: 100%;
	border-right:none;
	padding-right: 0%;
	border-bottom: 4px dotted #49b59b;
	padding-bottom: 7%;
}
#everyone #kids .box02 li:last-child{
	padding-left: 0%;
	margin-top: 7%;
	border-bottom:none;
	padding-bottom: 0;
}
#everyone #kids .box02 div{
	float: none;
	width: 40%;
	margin: 0 auto 5% auto;
}
#everyone #kids .box02 dl{
	float: none;
	width: 100%;
}
	#everyone #kids .box02 dt{
		text-align:center;
	}	
#everyone .imgstyle_2_s li{
	width: 100%;
}
#everyone .imgstyle_2_s li img{
	width: 70%;
}	
}





/*
---------------------------------------------------------*/

/* Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) and (max-width: 959px) {
}

/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {
}

/*
---------------------------------------------------------*/

/* Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) and (max-width: 959px) {
}

/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {
}

/*
---------------------------------------------------------*/

/* Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) and (max-width: 959px) {
}

/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {
}