@charset "UTF-8";

/*メインイメージ
---------------------------------------------------------*/
.cln_page .m_img_area{
background: url(../images/clinic/m_img.jpg) no-repeat center top;
background-size: cover;
}


/*メインコピー
---------------------------------------------------------*/
.m_copy_area{
padding-bottom: 0;
margin-bottom: 10%;
position: relative;
}
.m_copy_area:after{
content: "";
position: absolute;
left: 0;
right: 0;
top: 0;
width: 100%;
height: 100%;
margin: auto;
background: url(../images/clinic/copy_bg.png) no-repeat center top;
background-size: cover;
}
.m_copy_area .w1200{
background: url(../images/clinic/copy_img.png) no-repeat center bottom;
background-size: 90%;
padding-bottom: 40%;
position: relative;
z-index: 1;
}

.m_copy_area ul{
_zoom:1;
overflow: hidden;
max-width: 840px;
width: 100%;
margin-top: 3%;
margin-left: auto;
margin-right: auto;
text-align: center;
}
.m_copy_area li{
margin-top: 3%;
background: #ffff5c;
border-radius: 100px;
padding: 1.5em 2% .2em;
}

.m_copy_area li , .m_copy_area li a{
color: #64c4d0;
}
.m_copy_area li i{
font-size: .5em;
position: relative;
top:-.3em;
}

/* PC
------------------------------------------*/
@media only screen and (min-width: 768px) {
.m_copy_area .w1200{
background-size: 941px 300px;
padding-bottom: 360px;
}
.m_copy_area li{
float: left;
max-width: 400px;
width: 43%;
}
.m_copy_area li:last-child{
float: right;
}
}
/* Mobile
------------------------------------------*/
@media only screen and (max-width: 767px) {
.m_copy_area li{
padding: 1em 2%;
}
.m_copy_area li i{
margin-left: .7em;
}
}



.box_type1{
padding-bottom: 7%;
padding-top: 20px;
}
.box_type1 li{
position: relative;
margin-top: 7%;
}
.box_type1 li .img_box ,.box_type1 li .txt_box{
position: relative;
}
.box_type1 li .img_box{
z-index: 1;
}
.box_type1 li .txt_box{
z-index: 0;
border: solid 1px #56bef4;
}
.box_type1 li .txt_inbox{
padding: 10% 13%;
}

.txt_box p{
font-size: 1.2em;
}
.box_type1 li .txt_box dt{
margin-top: .3em;
}
#medical_device li .col_green{
	color:#75dca6;
}
li .col_bl2{
	color:#60c1e1;
}
.box_type1 ul > li{
	position: relative;
}
.box_type1 ul > li:nth-child(1) .abs{
	position: absolute;
	display: block;
	max-width: 148px;
	width: 12.3%;
	right: -2.5%;
	bottom: 6%;
}
.box_type1 ul > li:nth-child(2) .abs{
	position: absolute;
	display: block;
	max-width: 148px;
	width: 12.3%;
	left: -2.5%;
	bottom: -25%;
}
.box_type1 ul > li:nth-child(2) .abs.cyousei{
	bottom: -15%;
}
/* 微調整
------------------------------------------*/
@media only screen and (min-width: 900px) {
.box_type1 li .img_box{
max-width: 600px;
width: 49%;
}
.box_type1 li .txt_box{
max-width: 650px;
width: 55%;
max-height: 385px;
}
.box_type1 li:nth-child(odd) .txt_box{
position: absolute;
top: -70px;
right: 0;
}
.box_type1 li:nth-child(even) .img_box{
position: absolute;
top: 70px;
right: 0;
}
}
@media only screen and (max-width: 899px) {
.box_type1 li .img_box{
width: 70%;
margin-right: 0;
margin-left: auto;
margin-top: -30px;
}
.box_type1 li .txt_box{
width: 90%;
}
}
/* Tablet
------------------------------------------*/
@media only screen and (min-width: 768px) and (max-width: 959px) {
.box_type1{
padding-bottom: 0;
padding-top: 0;
}
.box_type1 li .txt_inbox{
padding: 7% 7% 65px;
}
}
/* Mobile 
------------------------------------------*/
@media only screen and (max-width: 767px) {
.box_type1{
padding-bottom: 7%;
padding-top: 0;
}
.txt_box p{
font-size: .8em;
}
.box_type1 li .txt_inbox{
padding: 7% 7% 35px;
}
.box_type1 ul > li:nth-child(1) .abs{
	width: 23%;
	right: auto;
	left: 0;
	bottom: 0;
}
.box_type1 ul > li:nth-child(2) .abs{
	width: 23%;
	left: 3%;
	bottom: 0;
}
.box_type1 ul > li:nth-child(2) .abs.cyousei{
	bottom: 0;
}
}


.clinic_photo{
_zoom:1;
overflow: hidden;
max-height: 290px;
height: 100%;
margin-top: 100px;
margin-bottom: 100px;
}
.clinic_photo li{
float: left;
width: 33.333333%;
}
.clinic_photo li{
position: relative;
}
.clinic_photo li:before{
content: "";
position: absolute;
bottom: -1px;
right: 0;
margin: auto;
width: 23px;
height: 69px;
background: url(../images/clinic/deco_sankaku.svg) no-repeat right bottom;
}
/* 微調整
------------------------------------------*/
@media only screen and (min-width: 1100px) {
.clinic_photo li:before{
top: 221px;
bottom: auto;
}
}
/* Mobile 
------------------------------------------*/
@media only screen and (max-width: 767px) {
.clinic_photo{
margin-top: 5%;
margin-bottom: 12%;
}
.clinic_photo li{
width: 50%;
}
.clinic_photo li:first-child{
display: none;
}
.clinic_photo li:before{
width: 11px;
height: 34px;
}
}



.box_type2{
margin-top: 12%;
}
.box_type2 ul{
_zoom:1;
overflow: hidden;
}
.box_type2 ul li{
position: relative;
padding-bottom: 5%;
margin-bottom: 5%;
}
.box_type2 ul li:before{
content: "";
position: absolute;
bottom: 0;
left: 0;
right: 0;
margin: auto;
width: 150px;
height: 1px;
background: rgba(86,190,244,.5);
}
.box_type2 ul:last-child li:before{
display: none;
}

.txt_m{
margin-top: .25em;
letter-spacing: .25em;
}

/* PC
------------------------------------------*/
@media only screen and (min-width: 768px) {
.box_type2 li{
float: left;
max-width: 510px;
width: 45%;
}
.box_type2 li:last-child{
float: right;
}
.box_type2 ul li .img_box{
float: left;
max-width: 230px;
width: 45%;
}
.box_type2 ul li .txt_box{
float: right;
max-width: 250px;
width: 50%;
}
.box_type2 ul:nth-child(even) .img_box{
float: right;
}
.box_type2 ul:nth-child(even) .txt_box{
float: left;
}
}
/* Tablet
------------------------------------------*/
@media only screen and (min-width: 768px) and (max-width: 959px) {
.box_type2 ul li{
float: none;
display: inline-block;
text-align: center;
margin-left: auto;
margin-right: auto;
}
.box_type2 ul li .img_box{
float: none;
width: 100%;
max-width: 500px;
}
.box_type2 ul li .txt_box{
float: none;
width: 100%;
max-width: 500px;
}
.box_type2 ul:nth-child(even) .img_box{
float: none;
}
.box_type2 ul:nth-child(even) .txt_box{
float: none;
}
}
/* Mobile 
------------------------------------------*/
@media only screen and (max-width: 767px) {
.box_type2 li{
text-align: center;
}
.box_type2 ul li .img_box{
width: 55%;
margin: 0 auto 3%;
}
.box_type2 ul:last-child li:first-child:before{
display: block;
}
}




.box_hygiene{
background: #60c1e1;
padding-top: 5%;
padding-bottom: 5%;
margin-top: 5%;
text-align: center;
color: #fff;
}
.box_hygiene .ft_yant{
font-size: 1.3em;
letter-spacing: .2em;
margin-bottom: .2em;
}
.box_hygiene ul{
background: url(../images/clinic/wave.svg) no-repeat center top;
background-size: 100%;
_zoom:1;
overflow: hidden;
padding-left: 6%;
padding-right: 6%;
padding-top: 4%;
margin-top: 3%;
}
.box_hygiene ul li{
margin-top: 5%;
}
.box_hygiene ul li .txt_box{
margin-top: 1em;
}
/* PC
------------------------------------------*/
@media only screen and (min-width: 768px)  {
.box_hygiene ul li{
float: left;
width: calc((100% / 3) - 5%);
margin-left: 2.5%;
margin-right: 2.5%;
}
}
/* Mobile
------------------------------------------*/
@media only screen and (max-width: 767px) {
.box_hygiene ul li{
border-bottom: solid 1px #fff;
padding-bottom: 5%;
margin-bottom: 6%;
}
.box_hygiene ul li:last-child{
border: none;
padding-bottom: 0;
margin-bottom: 0;
}
}


.box_type3{
margin-top: 5%;
margin-bottom: 5%;
}

.box_type3 li{
_zoom:1;
overflow: hidden;
border-bottom: solid 1px rgba(77,77,77,.2);
padding: 5% 0;
}

.pickup{
background: #75dca6;
color: #fff;
padding: 3%;
_zoom:1;
overflow: hidden;
margin-top: 5%;
font-size: .9em;
line-height: 1.9em;
}
.pickup1 dt{
margin-bottom: .3em;
}

.pickup2 .item{
margin-top: 2.5%;
}

.pickup2 .item p{
padding-bottom: .5em;
}

/* PC
------------------------------------------*/
@media only screen and (min-width: 768px)  {
.box_type3 li .img_box{
float: left;
max-width: 390px;
width: 40%;
}
.box_type3 li .txt_box{
float: right;
max-width: 625px;
width: 57%;
}
.pickup1 .box_l{
max-width: 666px;
width: 60%;
}
.pickup1 .box_r{
max-width: 256px;
width: 35%;
}
.pickup2 .item{
float: left;
width: calc((100% / 3) - 2%);
padding-right: 2.5%;
margin-right: 2.5%;
box-sizing: border-box;
border-right: solid 1px #fff;
}
.pickup2 .item:last-child{
border: none;
padding-right: 0;
margin-right: 0;
}
}
/* Mobile 
------------------------------------------*/
@media only screen and (max-width: 767px) {
.box_type3 li .img_box{
text-align: center;
}
.box_type3 li .txt_box{
margin-top: 3%;
}
.box_type3 li .txt_box p , .box_type3 li .txt_box dt{
text-align: center;
}
.pickup{
text-align: center;
}
.pickup2{
padding: 7% 5% 0;
}
.pickup2 .item{
border-top: solid 1px #fff;
padding-top: 5%;
margin-top: 7%;
}
.pickup2 .img_style{
margin-top: 0;
}
}