
/*============================================================================

	#mainvisual

============================================================================*/

#mainvisual{
	height:986px;
	background-size: cover;
}

#container {
    padding-bottom: 0;
    padding-top: 100px;
}
#mainvisual h2:before {
    position: absolute;
    top: 24px;
    left: 742px;
    width: 1000px;
    height: 1px;
    background-color: #ff2c75;
    content: "";
}
#mainvisual h2:after {
    position: absolute;
    top: 24px;
    right: 742px;
    width: 970px;
    height: 1px;
    background-color: #ff2c75;
    content: "";
}
#mainvisual h2:before{
    animation-duration: 3s;
    animation-name: lineh2;
	animation-timing-function: ease-out;
}
#mainvisual h2:after{
    animation-duration: 3s;
    animation-name: line2h2;
	animation-timing-function: ease-out;
}
@keyframes lineh2 {
    from {
    left: 0;
    width: 0;
    }
    to {
    left: 742px;
    width: 900px;
    }
}
@keyframes line2h2 {
    from {
    right: 0;
    width: 0;
    }
    to {
    right: 742px;
    width: 900px;
    }
}




.main_clinic{
}
.main_clinic li {
    position: absolute;
}
.main_clinic li:nth-child(1) {
    top: 227px;
    left: 148px;
}
.main_clinic li:nth-child(2) {
    top: 228px;
    left: 338px;
}
.main_clinic li:nth-child(3) {
    top: 227px;
    left: 522px;
}
.main_clinic li:nth-child(4) {
    top: 227px;
    right: 392px;
}
.main_clinic li:nth-child(5) {
    top: 228px;
    right: 232px;
}
.main_clinic li:nth-child(6) {
    top: 408px;
    left: 83px;
}
.main_clinic li:nth-child(7) {
    top: 408px;
    left: 267px;
}
.main_clinic li:nth-child(8) {
    top: 408px;
    left: 427px;
}
.main_clinic li:nth-child(9) {
    top: 407px;
    left: 606px;
}
.main_clinic li:nth-child(10) {
    top: 404px;
    right: 311px;
}
.main_clinic li:nth-child(11) {
    top: 407px;
    right: 166px;
}
.main_clinic li:nth-child(12) {
    top: 584px;
    left: 129px;
}
.main_clinic li:nth-child(13) {
    top: 586px;
    left: 310px;
}
.main_clinic li:nth-child(14) {
    top: 586px;
    left: 453px;
}
.main_clinic li:nth-child(15) {
    top: 586px;
    left: 603px;
}
.main_clinic li:nth-child(16) {
    top: 586px;
    right: 372px;
}
.main_clinic li:nth-child(17) {
    top: 586px;
    right: 215px;
}


.main_clinic li {
    animation-duration: 1.2s;
    animation-name: fadeIn;
	animation-timing-function: ease-out;
}
.main_clinic li:nth-child(6),
.main_clinic li:nth-child(7),
.main_clinic li:nth-child(8),
.main_clinic li:nth-child(9),
.main_clinic li:nth-child(10),
.main_clinic li:nth-child(11) {
    animation-duration: 1.5s;
}
.main_clinic li:nth-child(12),
.main_clinic li:nth-child(13),
.main_clinic li:nth-child(14),
.main_clinic li:nth-child(15),
.main_clinic li:nth-child(16),
.main_clinic li:nth-child(17) {
    animation-duration: 1.8s;
}


.main_clinic li:nth-child(2) {
    animation-name: fadeIn2;
}
.main_clinic li:nth-child(3) {
    animation-name: fadeIn3;
}
.main_clinic li:nth-child(4) {
    animation-name: fadeIn4;
}
.main_clinic li:nth-child(5) {
    animation-name: fadeIn5;
}


.main_clinic li:nth-child(6) {
    animation-name: fadeIn6;
}
.main_clinic li:nth-child(7) {
    animation-name: fadeIn7;
}
.main_clinic li:nth-child(8) {
    animation-name: fadeIn8;
}
.main_clinic li:nth-child(9) {
    animation-name: fadeIn9;
}
.main_clinic li:nth-child(10) {
    animation-name: fadeIn10;
}
.main_clinic li:nth-child(11) {
    animation-name: fadeIn11;
}


.main_clinic li:nth-child(12) {
    animation-name: fadeIn12;
}
.main_clinic li:nth-child(13) {
    animation-name: fadeIn13;
}
.main_clinic li:nth-child(14) {
    animation-name: fadeIn14;
}
.main_clinic li:nth-child(15) {
    animation-name: fadeIn15;
}
.main_clinic li:nth-child(16) {
    animation-name: fadeIn16;
}
.main_clinic li:nth-child(17) {
    animation-name: fadeIn17;
}



@keyframes fadeIn {
    from {
	opacity:0;
    top: 0px;
    left: 0px;
    }
    to {
	opacity:1;
    top: 227px;
    left: 148px;
    }
}
@keyframes fadeIn2 {
    from {
	opacity:0;
    top: 100px;
    left: 338px;
    }
    to {
	opacity:1;
    top: 228px;
    left: 338px;
}
}
@keyframes fadeIn3 {
    from {
	opacity:0;
    top: 0px;
    left: 538px;
    }
    to {
	opacity:1;
    top: 227px;
    left: 522px;
}
}
@keyframes fadeIn4 {
    from {
	opacity:0;
    top: 0px;
    right: 0;
    }
    to {
	opacity:1;
    top: 227px;
    right: 392px;
}
}
@keyframes fadeIn5 {
    from {
	opacity:0;
    top: -50px;
    right: 538px;
    }
    to {
	opacity:1;
    top: 228px;
    right: 232px;
}
}


@keyframes fadeIn6 {
    from {
	opacity:0;
    top: 100px;
    left: 0px;
    }
    to {
	opacity:1;
	top: 408px;
    left: 83px;
}
}
@keyframes fadeIn7 {
    from {
	opacity:0;
    top: 0;
    left: 267px;
    }
    to {
	opacity:1;
    top: 408px;
    left: 267px;
}
}
@keyframes fadeIn8 {
    from {
	opacity:0;
    top: 200px;
    left: 638px;
    }
    to {
	opacity:1;
    top: 408px;
    left: 427px;
}
}
@keyframes fadeIn9 {
    from {
	opacity:0;
    top: 100px;
    left: 0;
    }
    to {
	opacity:1;
    top: 407px;
    left: 606px;
}
}
@keyframes fadeIn10 {
    from {
	opacity:0;
    top: 300px;
    right: 311px;
    }
    to {
	opacity:1;
    top: 404px;
    right: 311px;
}
}
@keyframes fadeIn11 {
    from {
	opacity:0;
    top: 0px;
    right: 0px;
    }
    to {
	opacity:1;
    top: 407px;
    right: 166px;
}
}


@keyframes fadeIn12 {
    from {
	opacity:0;
    top: 100px;
    left: 0px;
    }
    to {
	opacity:1;
    top: 584px;
    left: 129px;
}
}
@keyframes fadeIn13 {
    from {
	opacity:0;
    top: 0;
    left: 310px;
    }
    to {
	opacity:1;
    top: 586px;
    left: 310px;
}
}
@keyframes fadeIn14 {
    from {
	opacity:0;
    top: 300px;
    left: 738px;
    }
    to {
	opacity:1;
    top: 586px;
    left: 453px;
}
}
@keyframes fadeIn15 {
    from {
	opacity:0;
    top: 100px;
    left: 0;
    }
    to {
	opacity:1;
    top: 586px;
    left: 603px;
}
}
@keyframes fadeIn16 {
    from {
	opacity:0;
    top: 300px;
    right: 311px;
    }
    to {
	opacity:1;
    top: 586px;
    right: 372px;
}
}
@keyframes fadeIn17 {
    from {
	opacity:0;
    top: 0px;
    right: 0px;
    }
    to {
	opacity:1;
    top: 586px;
    right: 215px;
}
}










.footer_map {
	display:block;
	position:relative;
}
.footer_info {
    padding-bottom: 0;
}














@media screen and (max-width:640px) {
/* スマホ */
#mainvisual{
	height:78vh;
	background-size: cover;
	background-position: top center;
}

	.main_clinic img{
		width: 40%;
	}
	
	.main_clinic li:nth-child(1){
		top: 187px;
    left: 48px;
	}
	
	.main_clinic li:nth-child(2) {
    top: 187px;
    left: 114px;
}
	
	.main_clinic li:nth-child(3) {
    top: 187px;
    left: 174px;
}
	
	.main_clinic li:nth-child(4) {
    top: 187px;
    right: 42px;
}
	
.main_clinic li:nth-child(5) {
    top: 187px;
    right: -17px;
}
	
	.main_clinic li:nth-child(6) {
    top: 260px;
    left: 25px;
}
	
	.main_clinic li:nth-child(7) {
    top: 260px;
    left: 90px;
}
	
	.main_clinic li:nth-child(8) {
    top: 260px;
    left: 142px;
}
	
	.main_clinic li:nth-child(9) {
    top: 260px;
    left: 204px;
}
	
	.main_clinic li:nth-child(10) {
    top: 260px;
    right: -2px;
}
	
	.main_clinic li:nth-child(11) {
    top: 260px;
    right: -40px;
}
	
	.main_clinic li:nth-child(12) {
    top: 330px;
    left: 48px;
}
	
	.main_clinic li:nth-child(13) {
    top: 330px;
    left: 114px;
}
	
	.main_clinic li:nth-child(14) {
    top: 330px;
    left: 162px;
}
	
.main_clinic li:nth-child(15) {
    top: 330px;
    left: 209px;
}
	
	.main_clinic li:nth-child(16) {
    top: 330px;
    right: 22px;
}
	
	.main_clinic li:nth-child(17) {
    top: 330px;
    right: -14px;
}
	
	
@keyframes fadeIn {
    from {
	opacity:0;
    top: 0px;
    left: 0px;
    }
    to {
	opacity:1;
    top: 187px;
    left: 48px;
    }
}
@keyframes fadeIn2 {
    from {
	opacity:0;
    top: 100px;
    left: 338px;
    }
    to {
	opacity:1;
    top: 187px;
    left: 114px;
}
}
@keyframes fadeIn3 {
    from {
	opacity:0;
    top: 0px;
    left: 538px;
    }
    to {
	opacity:1;
    top: 187px;
    left: 174px;
}
}
@keyframes fadeIn4 {
    from {
	opacity:0;
    top: 0px;
    right: 0;
    }
    to {
	opacity:1;
    top: 187px;
    right: 42px;
}
}
@keyframes fadeIn5 {
    from {
	opacity:0;
    top: -50px;
    right: 538px;
    }
    to {
	opacity:1;
    top: 187px;
    right: -17px;
}
}


@keyframes fadeIn6 {
    from {
	opacity:0;
    top: 100px;
    left: 0px;
    }
    to {
	opacity:1;
	top: 260px;
    left: 25px;
}
}
@keyframes fadeIn7 {
    from {
	opacity:0;
    top: 0;
    left: 267px;
    }
    to {
	opacity:1;
    top: 260px;
    left: 90px;
}
}
@keyframes fadeIn8 {
    from {
	opacity:0;
    top: 200px;
    left: 638px;
    }
    to {
	opacity:1;
    top: 260px;
    left: 142px;
}
}
@keyframes fadeIn9 {
    from {
	opacity:0;
    top: 100px;
    left: 0;
    }
    to {
	opacity:1;
    top: 260px;
    left: 204px;
}
}
@keyframes fadeIn10 {
    from {
	opacity:0;
    top: 300px;
    right: 311px;
    }
    to {
	opacity:1;
    top: 260px;
    right: -2px;
}
}
@keyframes fadeIn11 {
    from {
	opacity:0;
    top: 0px;
    right: 0px;
    }
    to {
	opacity:1;
    top: 260px;
    right: -40px;
}
}


@keyframes fadeIn12 {
    from {
	opacity:0;
    top: 100px;
    left: 0px;
    }
    to {
	opacity:1;
    top: 330px;
    left: 48px;
}
}
@keyframes fadeIn13 {
    from {
	opacity:0;
    top: 0;
    left: 310px;
    }
    to {
	opacity:1;
    top: 330px;
    left: 114px;
}
}
@keyframes fadeIn14 {
    from {
	opacity:0;
    top: 300px;
    left: 738px;
    }
    to {
	opacity:1;
    top: 330px;
    left: 162px;
}
}
@keyframes fadeIn15 {
    from {
	opacity:0;
    top: 100px;
    left: 0;
    }
    to {
	opacity:1;
    top: 330px;
    left: 209px;
}
}
@keyframes fadeIn16 {
    from {
	opacity:0;
    top: 300px;
    right: 311px;
    }
    to {
	opacity:1;
    top: 330px;
    right: 22px;
}
}
@keyframes fadeIn17 {
    from {
	opacity:0;
    top: 0px;
    right: 0px;
    }
    to {
	opacity:1;
    top: 330px;
    right: -14px;
}
}
	
#mainvisual h2:before{
		top: 20px;
    left: 308px;
	}
	
	#mainvisual h2:after{
		top: 20px;
		right: 310px;
	}
	
	@keyframes lineh2 {
    from {
    left: 0;
    width: 0;
    }
    to {
    left: 308px;
    width: 900px;
    }
}
@keyframes line2h2 {
    from {
    right: 0;
    width: 0;
    }
    to {
    right: 310px;
    width: 900px;
    }
}

	
	
	
}


/* iphone5 */
@media screen and (device-width: 320px) and (device-height: 568px) and (-webkit-device-pixel-ratio: 2){
	
	#mainvisual {
    height: 76vh;
}
	.main_clinic img {
    width: 34%;
}
	
	
	.main_clinic li:nth-child(1){
		top: 168px;
    left: 46px;
	}
	
	.main_clinic li:nth-child(2) {
    top: 168px;
    left: 97px;
}
	
	.main_clinic li:nth-child(3) {
    top: 168px;
    left: 147px;
}
	
	.main_clinic li:nth-child(4) {
    top: 168px;
    right: 26px;
}
	
.main_clinic li:nth-child(5) {
    top: 168px;
    right: -29px;
}
	
	.main_clinic li:nth-child(6) {
    top: 228px;
    left: 22px;
}
	
	.main_clinic li:nth-child(7) {
    top: 228px;
    left: 74px;
}
	
	.main_clinic li:nth-child(8) {
    top: 228px;
    left: 120px;
}
	
	.main_clinic li:nth-child(9) {
    top: 228px;
    left: 172px;
}
	
	.main_clinic li:nth-child(10) {
    top: 228px;
    right: -17px;
}
	
	.main_clinic li:nth-child(11) {
    top: 228px;
    right: -40px;
}
	
	.main_clinic li:nth-child(12) {
    top: 290px;
    left: 42px;
}
	
	.main_clinic li:nth-child(13) {
    top: 290px;
    left: 90px;
}
	
	.main_clinic li:nth-child(14) {
    top: 290px;
    left: 126px;
}
	
.main_clinic li:nth-child(15) {
    top: 290px;
    left: 167px;
}
	
	.main_clinic li:nth-child(16) {
    top: 290px;
    right: 9px;
}
	
	.main_clinic li:nth-child(17) {
    top: 290px;
    right: -18px;
}
	
	
@keyframes fadeIn {
    from {
	opacity:0;
    top: 0px;
    left: 0px;
    }
    to {
	opacity:1;
    top: 168px;
    left: 46px;
    }
}
@keyframes fadeIn2 {
    from {
	opacity:0;
    top: 100px;
    left: 338px;
    }
    to {
	opacity:1;
    top: 168px;
    left: 97px;
}
}
@keyframes fadeIn3 {
    from {
	opacity:0;
    top: 0px;
    left: 538px;
    }
    to {
	opacity:1;
    top: 168px;
    left: 147px;
}
}
@keyframes fadeIn4 {
    from {
	opacity:0;
    top: 0px;
    right: 0;
    }
    to {
	opacity:1;
    top: 168px;
    right: 26px;
}
}
@keyframes fadeIn5 {
    from {
	opacity:0;
    top: -50px;
    right: 538px;
    }
    to {
	opacity:1;
    top: 168px;
    right: -29px;
}
}


@keyframes fadeIn6 {
    from {
	opacity:0;
    top: 100px;
    left: 0px;
    }
    to {
	opacity:1;
	top: 228px;
    left: 22px;
}
}
@keyframes fadeIn7 {
    from {
	opacity:0;
    top: 0;
    left: 267px;
    }
    to {
	opacity:1;
    top: 228px;
    left: 74px;
}
}
@keyframes fadeIn8 {
    from {
	opacity:0;
    top: 200px;
    left: 638px;
    }
    to {
	opacity:1;
    top: 228px;
    left: 120px;
}
}
@keyframes fadeIn9 {
    from {
	opacity:0;
    top: 100px;
    left: 0;
    }
    to {
	opacity:1;
    top: 228px;
    left: 172px;
}
}
@keyframes fadeIn10 {
    from {
	opacity:0;
    top: 300px;
    right: 311px;
    }
    to {
	opacity:1;
    top: 228px;
    right: -17px;
}
}
@keyframes fadeIn11 {
    from {
	opacity:0;
    top: 0px;
    right: 0px;
    }
    to {
	opacity:1;
    top: 228px;
    right: -40px;
}
}


@keyframes fadeIn12 {
    from {
	opacity:0;
    top: 100px;
    left: 0px;
    }
    to {
	opacity:1;
    top: 290px;
    left: 42px;
}
}
@keyframes fadeIn13 {
    from {
	opacity:0;
    top: 0;
    left: 310px;
    }
    to {
	opacity:1;
    top: 290px;
    left: 90px;
}
}
@keyframes fadeIn14 {
    from {
	opacity:0;
    top: 300px;
    left: 738px;
    }
    to {
	opacity:1;
    top: 290px;
    left: 126px;
}
}
@keyframes fadeIn15 {
    from {
	opacity:0;
    top: 100px;
    left: 0;
    }
    to {
	opacity:1;
    top: 290px;
    left: 167px;
}
}
@keyframes fadeIn16 {
    from {
	opacity:0;
    top: 300px;
    right: 311px;
    }
    to {
	opacity:1;
    top: 290px;
    right: 9px;
}
}
@keyframes fadeIn17 {
    from {
	opacity:0;
    top: 0px;
    right: 0px;
    }
    to {
	opacity:1;
    top: 290px;
    right: -18px;
}
}
	
	
	@keyframes lineh2 {
    from {
    left: 0;
    width: 0;
    }
    to {
    left: 278px;
    width: 900px;
    }
}
@keyframes line2h2 {
    from {
    right: 0;
    width: 0;
    }
    to {
    right: 282px;
    width: 900px;
    }
}
	
	#mainvisual h2:before{
		left: 278px;
	}
	
	#mainvisual h2:after{
		right: 282px;
	}
	
	
	
	
	
	
}
