@charset "utf-8";

/*==================================================
生活習慣病ページのみのcss
====================================================*/
.title_nayami{font-size:28px;font-weight:bold;font-family:sans-serif;text-align:center;}
.title_nayami2{font-size:22px;font-weight:bold;font-family:sans-serif;text-align:center;}
@media only screen and (max-width: 799px){
	.title_nayami{font-size:22px;}
	.title_nayami2{font-size:18px;}
}

/*予約ボタン
------------------------------------------------------------------*/
#btn_animation .btn {
  display: block;
  position: relative;
  width: 400px;
  height: 90px;
  line-height: 90px;
  font-size: 28px;
  text-decoration: none;
  background-image: radial-gradient(circle, rgba(42, 179, 252, 1), rgba(58, 99, 255, 1));
  color: #fbfbfb;
  text-shadow:#696969 1px 1px;
  text-align: center;
  overflow: hidden;
  margin:0 auto;
}

#btn_animation .btn:hover {
    text-decoration: none;
    color: #fbfbfb;
}

#btn_animation .btn::before {
    position: absolute;
    content: '';
    display: inline-block;
    top: -180px;
    left: 0;
    width: 30px;
    height: 100%;
    background-color: #fbfbfb;
    animation: btn_animation 2.5s ease-in-out infinite;
}

@-webkit-keyframes btn_animation {
    0% { -webkit-transform: scale(0) rotate(45deg); opacity: 0; }
    80% { -webkit-transform: scale(0) rotate(45deg); opacity: 0.5; }
    81% { -webkit-transform: scale(4) rotate(45deg); opacity: 1; }
    100% { -webkit-transform: scale(50) rotate(45deg); opacity: 0; }
}

@media only screen and (max-width: 799px){
	#btn_animation .btn {
	  width: 300px;
	　max-width:100%;
	  height: 68px;
  	  line-height: 68px;
	  font-size: 18px;
	  font-weight:bold;
	}
}

/*----------------------------------------------------------
丸白抜き数字
----------------------------------------------------------*/
.h1_wrapper {
  display: flex;margin-bottom:10px;
  border-bottom:solid 1px #4169e1;
}
.h1_circle_number {
  width: 32px;
  height: 32px;
  margin-right: 15px;
  margin-bottom: 5px;
  padding-top: -10px;
  background-color: #4169e1;
  border-radius: 50%;
  text-align: center;
  box-sizing: border-box;
  font-size: 20px;
  line-height:1.4;
  font-weight: bold;
  color:#fff;
}
.h1_wrapper p{font-size:22px;color:#4169e1;font-weight:bold;line-height:1.5;}
@media only screen and (max-width: 799px){
	.h1_circle_number {
	  width: 28px;
	  height: 28px;
	  font-size: 16px;
	  line-height:1.7;
	}
	.h1_wrapper p{font-size:20px;line-height:1.5;}
}

/*----------------------------------------------------------
高尿酸血症で使用
----------------------------------------------------------*/
	.boxtsufu-nayami{display:flex;align-items:flex-end;gap:0 50px;}
	.boxtsufu-nayami-p{}
	.boxtsufu-nayami-img{width:200px;}
	.boxtsufu-nayami-img img{width:100%;}
@media screen and (max-width:799px) {
	.boxtsufu-nayami{gap:30px 0;flex-direction:column;align-items:flex-start;}
	.boxtsufu-nayami-img{width:100%;text-align:center;}
	.boxtsufu-nayami-img img{width:200px;max-width:100%;}
}


/*----------------------------------------------------------
睡眠時無呼吸症候群で使用
----------------------------------------------------------*/
.box-nagare {
	padding:10px 10px 10px 20px;
    background: #f8f8ff;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.22);
}
.box-nagare-inner{display:flex;gap:0 20px;margin-top:10px;}
.box-nagare-inner-p{width:calc(100% - 200px);}
.box-nagare-inner-img{width:200px;}
.box-nagare-inner-img img{width:100%;}
@media only screen and (max-width: 799px){
	.box-nagare {
		padding:10px 5px 10px 5px;}
	.box-nagare-inner-p{width:calc(100% - 150px);}
	.box-nagare-inner-img{width:150px;}

}

/*----------------------------------------------------------
栄養相談で使用
----------------------------------------------------------*/
	.box-nayami-eiyo{display:flex;align-items:flex-end;gap:0 20px;}
	.box-nayami-eiyo-p{}
	.box-nayami-eiyo-img{width:300px;}
	.box-nayami-eiyo-img img{width:100%;}
@media screen and (max-width:799px) {
	.box-nayami-eiyo{gap:30px 0;flex-direction:column;align-items:flex-start;}
	.box-nayami-eiyo-img{width:100%;text-align:center;}
	.box-nayami-eiyo-img img{width:300px;max-width:100%;}
}