@charset "UTF-8";

/*メインイメージ
---------------------------------------------------------*/
.m_img{
	 background-image: url(../images/ippan/slide.jpg);
}





/*
---------------------------------------------------------*/
.com_btn{
	max-width: 345px;
	margin: 0 auto;
}
.tit{
	margin-bottom: 70px;
}
.tit p{
	margin-bottom: 50px;
letter-spacing: 0.5em;

}
.tit h2{
font-size: 170%;
letter-spacing: 0.2em;
	color:#000000;
}

/* Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) and (max-width: 959px) {
.tit h2{
	margin-bottom:50px;
}
.tit{
	margin-bottom: 40px;
}
.tit p{
	margin-bottom: 30px;
}
}

/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {
.com_btn {
    margin: 0 auto;
}
.tit h2{
	font-size: 150%;
	letter-spacing: 0.15em;
	line-height: 1.5em;
	margin-bottom:8%;
}
.tit{
	margin-bottom: 10%;
}
.tit p{
	margin-bottom: 6%;
}
}





/*歯周病チェック
---------------------------------------------------------*/
.flow_box {
	background: #e6e6e6;
	padding:  50px 50px 45px 50px;
	text-align: center;
	position: relative;
}
.flow_box ul li:last-child{
	position: relative;
}
.flow_box .abs_img{
position: absolute;
right: -38%;
top: -20%;
width: 70%;
padding: 0 6%;
}

.flow_box h6 {
	color: #000;
	font-size: 120%;
	font-weight: bold;
	letter-spacing: .15em;
	line-height: 1.2em;
	margin-bottom: 30px;
}
.flow_box ul{
	max-width:840px;
	margin: 0 auto;
}
.flow_box li {
width: 21.25%;
float: left;
max-width: 180px;
}
.flow_box li p {
max-width: 180px;
	margin: 0 auto;
}
.flow_box li .txt {
text-align: center;
margin-top: 15px;
line-height: 1.6em;
color: #5b5b5b;
font-size: 90%;
	letter-spacing: .05em;
}
.flow_box li.flow_arrow {
width: 5%;
padding-top: 10%;
}
.flow_box li.flow_arrow img {
	max-width: 27px;
	margin: auto;
}


/* Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) and (max-width: 1070px) {
.flow_box .abs_img{
position: absolute;
right: -24%;
top: -15%;
width: 55%;
padding: 0 6%;
}
}

/* Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) and (max-width: 959px) {
.flow_box {
	padding:  4%;
}
.flow_box li .txt {
	font-size: 90%;
	line-height: 1.4em;
}
}

/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {
.flow_box li {
	width: 100%;
	float: none;
	max-width: 100%;
}
.flow_box {
	padding:5% 3%;
}	
.flow_box h6 {
	margin-bottom:3%;
}
.flow_box li p {
	max-width: 100%;
	display: inline-block;
	vertical-align: middle;
}
.flow_box li .illust {
	width: 28%;
}
.flow_box li .txt {
	margin-top: 0;
	width: 62%;
	margin-left: 2%;
	font-size: 90%;
	text-align: left;
}
.flow_box li.flow_arrow {
	width: 100%;
	padding: 0;
}
.flow_box li.flow_arrow img {
	transform: rotate(90deg);
}
.flow_box .abs_img {
    left: 15%;
	right: inherit;
    top: -37%;
    width: 19%;
    padding: 0 6%;
}
}



/*虫歯について
---------------------------------------------------------*/
.medical #pagebody .in_box.box03{
	margin-bottom: 0;
}
.med_flex_3 .flx_c {
	background: rgba(239,92,108,0.30);
}
.med_flex_3 .flx_c dt {
	background: #db979f;
}

.med_flex_3 .flx_r {
	background: rgba(118,174,97,0.30);
}
.med_flex_3 .flx_r dt {
	background: #89b379;
}
.box03 .bdr_box{
	border: 1px solid #e6e6e6;
	padding: 55px 70px 40px;
}
.box03 .bdr_box dt{
	margin-bottom: 1.2em;
	font-size: 113%;
	font-weight: bold;
	text-align: center;
	color: #000;
}


/* Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) and (max-width: 959px) {
.medical #pagebody .in_box.box03{
	margin-bottom: 0;
}
.box03 .bdr_box{
	padding: 5% 3%;
}
}

/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {
.medical #pagebody .in_box.box03{
	margin-bottom: 0;
}
.box03 .bdr_box{
	padding: 5% 3%;
}
.box03 .bdr_box dt{
	margin-bottom: .5em;
	font-size: 113%;
}
}





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

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

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