@charset "UTF-8";


.pulmonology{
	& h3{
		color: #3d828e;
		font-weight: 500;
		text-align: center;
		font-size: 30px;
		margin: 90px auto 45px;
			@media (max-width: 768px) {
				font-size: 24px;
				margin: 45px auto 25px;
			}
	}
	
	& p{ font-size: 16px;
			@media (max-width: 768px) {
				font-size: 14px;
			}	
	}
	.text_strong{ color: #3d828e; }
	
	.aisatsu{
		display: flex;
		@media (max-width: 500px) {
			display: block;
		}
		
		.photo{ width: 40%; 
		@media (max-width: 500px) {
			width: 100%;
			& img{ display: block; margin: 30px auto;}
		}
		
		}
		.hukidashi{
			  width: 60%;
			  position: relative;
			  display: inline-block;
			  margin: 0 0 0 15px;
			  padding: 20px;
			  min-width: 120px;
			  max-width: 100%;
			  color: #555;
			  font-size: 16px;
			  background: #FFF;
			  border: solid 3px #555;
			  box-sizing: border-box;
			  
			  & p + p{ margin-top: 10px;}

			@media (max-width: 500px) {
				width: 100%;
				margin: 0;
				padding: 15px;
			}

		}
		.hukidashi:before {
		  content: "";
		  position: absolute;
		  top: 50%;
		  left: -24px;
		  margin-top: -12px;
		  border: 12px solid transparent;
		  border-right: 12px solid #FFF;
		  z-index: 2;
		}

		.hukidashi:after {
		  content: "";
		  position: absolute;
		  top: 50%;
		  left: -30px;
		  margin-top: -14px;
		  border: 14px solid transparent;
		  border-right: 14px solid #555;
		  z-index: 1;
		}		


		@media (max-width: 500px) {
				.hukidashi:before {
				  content: "";
				  position: absolute;
				  top: -24px;
				  left: 50%;
				  margin-left: -15px;
				  border: 12px solid transparent;
				  border-bottom: 12px solid #FFF;
				  z-index: 2;
				  margin-top: 0 ;
				}

				.hukidashi:after {
				  content: "";
				  position: absolute;
				  top: -30px;
				  left: 50%;
				  margin-left: -17px;
				  border: 14px solid transparent;
				  border-bottom: 14px solid #555;
				  z-index: 1;
				  margin-top: 0 ;
				}
		}

	}
	
	
	
	& h4{
		font-weight: 500;
		text-align: center;
		font-size: 24px;
		margin: 60px auto 30px;
			@media (max-width: 768px) {
				font-size: 18px;
				margin: 30px auto 15px;
			}
	}
	
	.intro{
		& ul{
			display: flex;
			flex-wrap: wrap;
			justify-content: space-between;
			margin: 30px auto 30px;
			}
		& li{
			width: 48%;
			font-size: 16px;
			background-color: #eee;
			list-style: none;
			padding: 10px 20px 10px 40px;
			margin: 0 0 15px 0;
			position: relative;
			font-weight: 700;
			@media (max-width: 768px) {
				width: 100%;
				font-size: 15px;
				padding: 10px 20px 10px 20px;
			}
		}
		& li:before{
			content: "";
			position: absolute;
			background-color: #3d828e;
			height: 6px;
			width: 30px;
			top: 50%;
			left: 0;
			margin-top: -3px;
			@media (max-width: 768px) {
				width: 15px;			
			}

		}
	}
	
	.col{
			display: flex;
			flex-wrap: wrap;
			justify-content: space-between;
			margin: 0px auto 60px;
		.row{
			width: 48%;
			@media (max-width: 768px) {
				width: 100%;
			}
		}

		.bg_blue{
			background-color: #e8f5fa;
			}
		.bg_green{
			background-color: #e4f1ee;		
		}
		.bg{
			padding: 30px 30px 15px 30px;
			font-size: 16px;
			border-radius: 15px;
			position: relative;
			min-height: 230px;
			@media (max-width: 768px) {
				font-size: 14px;
				padding: 20px 20px 10px 20px;
			}
			& ul{ list-style: none;}
			& li{ list-style: none;}
			& span{
				display: block;
				text-align: right;
			}
		}
	}
	.soudan{
		font-size: 18px;
		text-align: center;
		margin: 30px auto 100px;
			@media (max-width: 768px) {
				font-size: 16px;
				margin: 15px auto 50px;
			}
	}
	.syoukai{ text-align: center;}
	
	.case{
		& h5{
			background-color: #3d828e;
			font-size: 18px;
			color: #ffffff;
			padding:10px 30px;
			margin:75px auto 75px;
			@media (max-width: 768px) {
				font-size: 16px;
				padding:5px 10px;
				margin:30px auto 30px;
			}
		}
		& h6{
			color: #3d828e;
			font-size: 18px;
			margin: 60px auto 30px;
			@media (max-width: 768px) {
				font-size: 16px;
				margin:30px auto 15px;
			}
		}
		& p{
			font-size: 14px;
			line-height: 2;
		}
		
		.photo_set{
			display: flex;
			flex-wrap: wrap;
			margin: 45px auto 15px;
			@media (max-width: 768px) {
				display: block;
			}

			& span{
				font-size: 14px;
				display: block;				
			}
			& div:first-child{
				margin:0 30px 0 0;
				@media (max-width: 768px) {
					margin: 0 0 15px;
				}

			}
		}
		.photo_set02{
			& div{
				@media (max-width: 980px) {
						width: 48%;									
				}
				@media (max-width: 768px) {
						width: auto;
				}
			}
			& div:first-child{
				margin: 0 90px 0 0;
				position: relative;
				@media (max-width: 980px) {
					margin:0 15px 0 0;
				}
				@media (max-width: 768px) {
					margin: 0 0 15px;
				}
			}
			& div:first-child:after{
				position: absolute;
				content: "";
				display: block;
				width: 70px;
				height: 50px;
				top: 50%;
				right: -80px;
				margin-top: -25px;
				background: #3d828e;
				clip-path: polygon(0 31%, 63.2% 31%, 63.2% 0, 100% 50%, 63.2% 100%, 63.2% 69%, 0 69%);
				@media (max-width: 980px) {
					right: -40px;
				}
				@media (max-width: 768px) {
					display: none;
				}

			}
		}
		.photo_text_set{
			display: flex;
			flex-wrap: wrap;
			align-items: center;
			margin: 45px auto 15px;
			& div:first-child{
				margin:0 30px 0 0;
			}
		}
		
		
		.movie{
			width: 600px;
			height: auto;
//			background-color: #ddd;
			margin: 30px 0;
			& video{
                max-width: 100%;
			}
				@media (max-width: 768px) {
					width: 100%;
                    height: auto;
				}

		}
		
	}
}

.case_btn{
	background-color: #3d828e;
	color: #fff;
	font-size: 18px;
	text-decoration: none;
	padding: 10px 20px;
	margin: 30px auto;
	display: block;
	width: 100%;
	max-width: 300px;
	text-align: center;
	border-radius: 5px;
	position: relative;
}

.case_btn:hover{
	background-color: #e4f1ee;
}

.case_btn::after {
  content: '';
  position: absolute;
  top: 0;
  bottom: 0;
  right: 27px;
  width: 0;
  height: 0;
  margin: auto;
  border-top: 6px solid transparent;
  border-right: 0 solid transparent;
  border-left: 9px solid #fff;
  border-bottom: 6px solid transparent;
  box-sizing: border-box;
}

