@charset "UTF-8";

/* Mobile (Portrait) 
------------------------------------------*/ 
@media only screen and (max-width: 767px) { 
.com_btn1_list .com_btn1{
	margin-bottom: 1%;
}
}



/* クリニック概要
---------------------------------------------------------*/
.cli_bg2{background: #f1f0ee;}
#outline .bg{
	background: url(../images/about_bg@2x.png) no-repeat top right;
	background-size: 59% auto;
}
.cli_table,
.cli_table tr{
	width: 100%;
}
.cli_table th{
	width: 22%;
	border-bottom: 1px solid #756159;
	font-size:min(140%,2vw);
	letter-spacing: 0.15em;
	line-height: 1.5em;
}
.cli_table td{
	width: 78%;
	border-bottom: 1px solid #ccc;
	padding:2.5rem 6.5%;
	box-sizing: border-box;
}

#history .com_box1{
	position: relative;
	width: 103%;
	margin-left: -1.5%;
	background: #fff;
}
#history .com_box1::before{
	position: absolute;
	display: block;
	content: "";
	background: url(../images/abs2@2x.png) no-repeat top left;
	background-size: 100% auto;
	width: 45%;
	height: 700px;
	top: -500px;
	left: -27%;
	aspect-ratio: 650 / 700;
}

.cli_list{
	max-width: 1210px;
	margin: 0 auto;
}
.cli_list .year{
	width: 16.8%;
	font-size:min(280%,3.8vw);
	letter-spacing: 0.1em;
	line-height: 1em;
}
.cli_list .maru{
	position: relative;
	width: 5.2%;
	padding-bottom: 8em;
}
.cli_list .maru span{
	display: block;
	background: #a79564;
	background-size: 100% auto;
	width: 1.1em;
	height: 1.1em;
	border-radius: 50%;
	margin-top: .7em;
}
.cli_list .maru::before{
	position: absolute;
	display: block;
	content: "";
	background: #a79564;
	background-size: 100% auto;
	width: 1px;
	height: 100%;
	top: .7em;
	left: .5em;
}
.cli_list li:last-child .maru::after{
	position: absolute;
	display: block;
	content: "";
	background:url(../images/abs1.svg) no-repeat bottom left;
	background-size: 100% auto;
	width: 1em;
	height: 5em;
	bottom: -.7em;
	left: 0.06em;
}
.cli_list .day{
	width: 11.5%;
	font-size:min(120%,2vw);
	letter-spacing: 0.3em;
	line-height: 1.5em;
	word-break: break-all;
	padding-right: 1em;
	box-sizing: border-box;
	padding-top: .32em;
}
.cli_list .txt{
	width: 70.5%;
	padding-top: .35em;
}

/* Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) and (max-width: 959px) { 
.cli_table th{
	letter-spacing: 0.05em;
}
.cli_table td{
	padding:2rem 4%;
}
#history .com_box1::before{
	top: -30vw;
}
.cli_list .maru{
	padding-bottom:3.5em;
}
.cli_list .maru span{
	margin-top: .3em;
}
.cli_list .day{
	letter-spacing:normal;
	padding-top: .1em;
}
.cli_list .txt{
	padding-top: 0;
}
}

/* Mobile (Portrait) 
------------------------------------------*/ 
@media only screen and (max-width: 767px) { 
#outline .bg{
	background-size:70% auto;
}
.cli_table th{
	width: 30%;
	font-size:100%;
	letter-spacing: normal;
}
.cli_table td{
	width: 70%;
	padding: 1.8rem 0 1.8rem 4%;
}

#history .com_box1::before{
	top: -20vw;
}

.cli_list .year{
	width: 16%;
	font-size: 110%;
}
.cli_list .maru{
	width: 7%;
	padding-bottom: 4em;
}
.cli_list .maru span{
	width: .8em;
	height: .8em;
	margin-top: 0;
}
.cli_list .maru::before{
	top: .7em;
	left: .4em;
}
.cli_list li:last-child .maru::after{
	width: .8em;
	bottom: -.7em;
	left: 0.05em;
}
.cli_list .day{
	width: 18.5%;
	font-size: 90%;
	letter-spacing:normal;
	padding-top: 0;
	line-height: 1.1em;
	padding-right: .5em;
}
.cli_list .txt{
	width: 62.5%;
	padding-top: 0;
	margin-top: -.3em;
	line-height: 1.5em;
}
}