@charset "utf-8";
/* CSS Document */
html {
  font-size: 10px;
}
body {
  font-family: zen-kaku-gothic-new, sans-serif;
  color: #333;
  margin: 0 auto;
	max-width: 1920px;
}
a {
  text-decoration: none;
}
li {
  list-style: none;
}
img {
  max-width: 100%;
}
.sp-only {
	display: none;
}
.flex {
	display: flex;
}
.row {
	flex-direction: row-reverse;
}
.wrap {
	flex-wrap: wrap;
}
.ffft {
	font-family: "Futura PT Medium", "Futura PT Bold", "Futura PT Light";
}
.ffzm {
	font-family: zen-old-mincho, sans-serif;
}
.ffci {
	font-family: Cinzel, "Cinzel Black", "Cinzel Medium", "Cinzel SemiBold";
}
.fftg {
	font-family:"FOT-TsukuARdGothic Std", sans-serif;
}
.fwb {
	font-weight: 600;
}
.white {
	color: #fff;
}

.sp-only {
	display: none;
}


.cut {
	display: none;
}
.red
{
    color: #BD0A0D;
}

/*header*/
#header {
	width: 100%;
	padding: 1rem 0;
	box-sizing: border-box;
	background: rgba(255,255,255,0.6);
	position: absolute;
	top:0;
	left: 0;
	z-index: 2;
}
#header .inner {
	width: 95%;
	margin: auto;
	justify-content: space-between;
	align-items: center;
}
.head-logo {
	width: 380px;
}
.head-r {
	gap:3rem;
	align-items: center;
}
.head-map a {
	display: block;
	font-size: 50px;
	color: #3D8F4F;
}
.tel-bnr {
	width: 350px;
	background: #A3D1A3;
	padding: 2rem 0;
}
.tel-bnr a {
	display: block;
	font-size: 36px;
	text-align: center;
}
.tel-bnr a span {
	font-size: 20px;
	margin-right: 1rem;
}


/*mainvisual*/
.mainvisual {
	height: 100vh;
	background-position: center;
	background-size: cover;
	position: relative;
}
.catch-copy {
	width: 380px;
	height: 100%;
	background: #fff;
	padding-top: 12rem;
	z-index: 1;
	box-sizing: border-box;
}
.catch-copy .cc-inner {
	flex-direction: column;
	align-items: center;
	gap: 3rem;
}
.catch-copy .cc-inner h2 {
	writing-mode: vertical-rl;
	line-height: 2;
	font-size: 26px;
	font-weight: 500;
}
.catch-copy .cc-inner h2 span {
	color: #3D8F4F;
}
.catch-copy .cc-inner .cc-logo {
	width: 220px;
}
.mv-icon {
	gap:3rem;
	align-items: center;
	position: absolute;
	bottom:2rem;
	right: 3rem;
}
.mv-icon img {
	width: 250px;
}


@media screen and (max-width:1280px) {
	.catch-copy {
		width: 320px;
	}
	.catch-copy .cc-inner h2 {
		font-size: 24px;
	}
	.catch-copy .cc-inner .cc-logo {
		width: 150px;
	}
	.mv-icon img {
		width: 200px;
	}
}




/*head-nav*/
.head-nav {
	width: 1200px;
	margin: auto;
	border-bottom: 1px solid #3D8F4F;
	padding: 1rem 0;
}
.head-nav nav {
	width: 90%;
	margin: auto;
}
.head-nav nav ul {
	justify-content: space-between;
}

.head-nav.fixed{
	position: fixed;/*fixedを設定して固定*/
  z-index: 999;/*最前面へ*/
  top:0;/*位置指定*/
  left:0;/*位置指定*/
	padding: 0.8rem 0;
	width: 100%;
	background: rgba(255,255,255,0.7);
}


/*2階層目以降は横並びにしない*/
nav ul ul{
	display: block;
}
/*下の階層のulや矢印の基点にするためliにrelativeを指定*/
nav ul li{
	position: relative;
	text-align: center;
	font-size: 18px;
	font-weight: 500;
	color: #777;
	line-height: 2.5;
}

nav ul li a {
	display: block;
	text-align: center;
	font-size: 18px;
	font-weight: 500;
	color: #777;
	line-height: 2.5;
}

/*== 2・3階層目の共通設定 */

/*下の階層を持っているulの指定*/
nav li.has-child ul{
    /*絶対配置で位置を指定*/
	position: absolute;
	left:50%;
	top:10rem;
	transform: translateX(-50%);
	z-index: 4;
    /*形状を指定*/
	background:#E3F2D9;
	width:180px;
    /*はじめは非表示*/
	visibility: hidden;
	opacity: 0;
    /*アニメーション設定*/
	transition: all .3s;
}
.has-child ul li a{
	padding: 1rem 0;
	font-size:13px;
	text-align: center;
}
/*hoverしたら表示*/
nav li.has-child:hover > ul,
nav li.has-child ul li:hover > ul,
nav li.has-child:active > ul,
nav li.has-child ul li:active > ul{
  visibility: visible;
  opacity: 1;
}

/*ナビゲーションaタグの形状*/
nav li.has-child ul li a{
	display: block;
	color: #333;
	border-bottom:solid 1px rgba(255,255,255,0.6);
}

nav li.has-child ul li:last-child a{
	border-bottom:none;
}

nav li.has-child ul li a:hover,
nav li.has-child ul li a:active{
	background:#A3D1A3;
}


@media screen and (max-width:1280px) {
	.head-nav {
		width: 1000px;
	}
}



/*info-calendar*/
#info-calendar {
	width: 1200px;
	margin: 5rem auto;
	background: url("../img/bg-ic.png");
	background-size: cover;
	padding: 3rem 0;
}
#info-calendar .inner {
	width: 95%;
	margin: auto;
	justify-content: space-between;
	align-items: flex-start;
}
.ic-info,
.ic-calendar {
	width: 45%;
}
.ttl-ic {
	width: 95%;
	margin: auto;
	background: #3D8F4F;
	padding: 2rem 0;
}
.ttl-ic p {
	font-size: 24px;
	text-align: center;
}
.ttl-ic p span {
	font-size: 16px;
	margin-left: 1rem;
}
.ttl-ic p i {
	font-size: 28px;
	margin-right: 1rem;
}

.info-wrapper {
	width: 95%;
	margin: 3rem auto 0 auto;
    overflow-y: scroll;
    height: 310px;
}
.info-wrapper dl {
	flex-direction: column;
	font-size: 17px;
	font-weight: 500;
}
.info-wrapper dl dt {
	color: #3D8F4F;
	width: 30%;
}
.info-wrapper dl dd {
	color: #777;
	width: 100%;
    margin-bottom: 1rem;
}

.calendar {
	width: 95%;
	margin: 3rem auto 0 auto;
}
.calendar-body table {
	width: 100%;
}
.calendar-body table th,
.calendar-body table td {
	text-align: center;
	font-size: 16px;
	font-weight: 400;
	border: 1px solid #EAEFEF;
	background: #fff;
	width: calc(100%/7);
}
.calendar-body table th {
	padding: 1rem 0;
	background: #777777;
	color: #fff;
}
.calendar-body table td {
	padding: 1rem 0;
}
.calendar-body table th.sun {
	background: #F8EAEB;
}
.calendar-body table th.sat {
	background: #EAF6F8;
}
.calendar-body table td.off {
	background: #F8EAEB;
}
.calendar-memo {
	font-size: 14px;
	font-weight: 500;
	margin-top: 1rem;
}


/*first*/
#first {
	padding: 10rem 0;
	background: url("../img/bg-first.png");
	background-size: cover;
}
#first .inner {
	width: 1000px;
	margin: auto;
	background: #FEFCF3;
	padding: 5rem 0;
	position: relative;
}
#first .inner::before {
	content: "";
	width: 150px;
	height: 60px;
	background: url("../img/deco03.png");
	background-size: cover;
	position: absolute;
	top:-4rem;
	left: 50%;
	transform: translateX(-50%);
}
#first .inner::after {
	content: "";
	width: 200px;
	height: 175px;
	background: url("../img/deco01.png");
	background-size: cover;
	position: absolute;
	top:0;
	left: 0;
}
.ttl-first {
	text-align: center;
	font-size: 36px;
	color: #3D8F4F;
	letter-spacing: 3px;
}
.ttl-first span {
	font-size: 48px;
}
.ttl-first02 {
	text-align: center;
	font-size: 24px;
	color: #777;
	font-weight: 500;
}
.ttl-first02 img {
	width: 36px;
	margin-right: 1rem;
	margin-top: -1rem;
}
.first-inner {
	width: 80%;
	margin: 3rem auto;
}
.first-txt {
	font-size: 17px;
	text-align: center;
	line-height: 2;
}
.first-txt span {
	color: #3D8F4F;
	font-weight: 500;
}
#first .inner .tel-bnr {
	margin: auto;
}
.page-link {
	background: #fff;
	margin: 3rem auto 0 auto;
	width: 350px;
	padding: 2rem 0;
	box-shadow: 2px 2px 5px #ccc;
} 
.page-link a {
	display: block;
	text-align: center;
	font-weight: 500;
	font-size: 22px;
	color: #777;
}


/*clinic-info*/
#clinic-info {
	padding: 10rem 0;
	background: linear-gradient(180deg, #F3FEFA 0%, #F3FEFA 50%, #A3D1A3 50%, #A3D1A3 100%);
	position: relative;
}
#clinic-info::before {
	content: "";
	width: 210px;
	height: 200px;
	background: url("../img/deco04.png");
	background-size: cover;
	position: absolute;
	bottom: 3rem;
	right: 3rem;
}
.sec-ttl {
	width: 430px;
	margin: auto;
}
#clinic-info .container {
	width: 1200px;
	margin: 5rem auto 0 auto;
	background: #fff;
	padding: 5rem 0;
	position: relative;
}
#clinic-info .container::before {
	content: "";
	width: 250px;
	height: 210px;
	background: url("../img/deco02.png");
	background-size: cover;
	position: absolute;
	top:-4rem;
	left: -4rem;
}
#clinic-info .container .inner {
	width: 95%;
	margin: auto;
	justify-content: space-between;
	align-items: center;
}
#clinic-info .container .inner .left,
#clinic-info .container .inner .right {
	width: 46%;
}
.ci-logo {
	width: 50%;
	margin: auto;
}
.ci-logo2 {
	width: 80%;
	margin: auto;
	margin: 1rem auto 2rem auto;
}
.ci-adress {
	width: 80%;
	margin: auto;
	font-size: 18px;
	color: #777;
	line-height: 1.5;
}
.ci-timetable {
	width: 100%;
	margin: 3rem auto;
}
.ci-timetable p {
	font-size: 14px;
}
#clinic-info .container .inner .left .tel-bnr {
	margin: auto;
}
.ci-map {
	width: 100%;
}
.ci-map iframe {
	width: 100%;
}
.ci-icon {
	width: 90%;
	margin: 2rem auto 3rem auto;
	gap:2rem;
	justify-content: center;
}
.ci-icon img {
	width: 200px;
}
.page-link02 {
	width: 350px;
	margin: auto;
	padding: 2rem 0;
	background: #3D8F4F;
}
.page-link02 a {
	display: block;
	font-size: 20px;
	font-weight: 500;
	text-align: center;
}


/*feature*/
#feature .feature-top {
	padding: 10rem 0 5rem 0;
	position: relative;
}
#feature .feature-top::before {
	content: "";
	width: 100%;
	height: 70%;
	background: url("../img/bg-feature.jpg");
	background-size: cover;
	background-position: center;
	position: absolute;
	top:0;
	left: 0;
	z-index: -1;
}
#feature .feature-top::after {
	content: "";
	width: 100%;
	height: 30%;
	background: #fff;
	position: absolute;
	bottom:0;
	left: 0;
	z-index: -1;
}

.feature-top .container {
	width: 1200px;
	margin: 8rem auto;
	background: #fff;
	padding: 5rem 0;
	box-shadow: 2px 2px 5px #ccc;
	position: relative;
}
.feature-top .container::before {
	content: "";
	width: 250px;
	height: 260px;
	background: url("../img/deco05.png");
	background-size: cover;
	background-position: center;
	position: absolute;
	top:0;
	left: 0;
}
.feature-top .container::after {
	content: "";
	width: 180px;
	height: 250px;
	background: url("../img/deco06.png");
	background-size: cover;
	background-position: center;
	position: absolute;
	bottom:0;
	right: 0;
}
.feature-c-ttl {
	font-size: 24px;
	font-weight: 500;
	text-align: center;
	color: #3D8F4F;
}
.f-top-list {
	width: 700px;
	margin: 5rem auto;
	background: #F3FEFA;
	padding: 2rem 0;
	border-radius: 2rem;
}
.f-top-list ul {
	width: 90%;
	margin: auto;
	justify-content: space-between;
}
.f-top-list ul li {
	width: 48%;
	font-size: 16px;
	margin-bottom: 1.5rem;
}
.f-top-list ul li i {
	color: #3D8F4F;;
	font-size: 18px;
	margin-right: 1rem;
}
.f-top-txt {
	font-size: 18px;
	font-weight: 500;
	text-align: center;
	line-height: 2;
}

.feature-bottom {
	padding-bottom: 10rem;
	background: linear-gradient(180deg, #fff 0%, #fff 20%, #F3FEFA 80%, #F3FEFA 100%);
	position: relative;
}
.feature-bottom::before {
	content: "";
	width: 1000px;
	height: 125px;
	background: url("../img/deco07.png");
	background-size: cover;
	position: absolute;
	bottom:5rem;
	left: 50%;
	transform: translateX(-50%);
}
.feature-bottom .inner {
	width: 90%;
	margin: auto;
}
.feature-bottom .inner ul {
	justify-content: space-between;
	align-items: flex-start;
}
.feature-bottom .inner ul li {
	width: 30%;
}
.feature-no {
	margin: 2rem auto;
	font-size: 28px;
	text-align: center;
	color: #3D8F4F;
}
.feature-no span {
	font-size: 36px;
	margin-left: 1rem;
}
.feature-txt {
	font-size: 18px;
	text-align: center;
	line-height: 2;
}


/*medical-info*/
#medical-info {
	padding: 10rem 0;
	background: url("../img/bg-medical-info.png");
	background-size: cover;
	position: relative;
	margin-bottom: 5rem;
}
#medical-info::before {
	content: "";
	width: 210px;
	height: 200px;
	background: url("../img/deco08.png");
	background-size: cover;
	position: absolute;
	top:3rem;
	right: 3rem;
}
#medical-info::after {
	content: "";
	width: 210px;
	height: 200px;
	background: url("../img/deco08.png");
	background-size: cover;
	position: absolute;
	bottom:3rem;
	left: 3rem;
}
#medical-info .inner {
	width: 1100px;
	margin: 5rem auto;
}
#medical-info .inner ul {
	justify-content: space-between;
	align-items: flex-start;
}
#medical-info .inner ul li {
	width: 28%;
}
.medical-icon {
	width: 90%;
	margin: auto;
}
.medical-icon img {
	width: 100%;
}
#medical-info .inner ul li p {
	margin: 2rem auto;
	font-size: 16px;
	text-align: center;
	line-height: 2;
}
.medical-link {
	width: 80%;
	margin: auto;
	background: #3D8F4F;
	padding: 1rem 0;
}
.medical-link a {
	display: block;
	text-align: center;
	font-size: 18px;
	font-weight: 500;
}


/*footer*/
#footer .inner {
	justify-content: space-between;
}
#footer .inner .foot-map,
#footer .inner .foot-right {
	width: 50%;
}
#footer .inner .foot-map iframe {
	width: 100%;
}
#footer .inner .foot-right {
	padding: 10rem 0 5rem 0;
	background: linear-gradient(#F0FEE7,#C6FBA1);
}
.foot-logo {
	width: 450px;
	margin: auto;
}
.foot-adress {
	margin: 3rem auto;
	text-align: center;
	font-size: 22px;
	font-weight: 500;
	color: #777;
}
.foot-adress i {
	font-size: 26px;
	color: #3D8F4F;
	margin-right: 1rem;
}
.foot-right .tel-bnr {
	margin: 3rem auto;
}
.foot-timetable {
	width: 65%;
	margin: auto;
}
.foot-timetable img {
	width: 100%;
}
.foot-timetable p {
	font-size: 14px;
	margin-top: 1rem;
}
.foot-point {
	width: 50%;
	margin: 3rem auto 0 auto;
	justify-content: space-between;
	align-items: center;
}
.foot-point .item {
	gap:2rem;
	align-items: center;
}
.foot-point .item img {
	width: 60px;
}
.foot-point .item p {
	font-size: 17px;
	font-weight: 500;
	color: #777;
}
#footer .copy p {
	text-align: center;
	font-size: 12px;
	padding: 1rem 0;
}

@media screen and (max-width:1280px) {
	.foot-point {
		width: 70%;
	}
}




/*下層*/
/*header*/
#s-header {
	width: 100%;
	padding: 1rem 0;
	box-sizing: border-box;
	background: rgba(255,255,255,0.6);
	position: absolute;
	top:0;
	left: 0;
	z-index: 2;
}
#s-header .inner {
	width: 95%;
	margin: auto;
	justify-content: space-between;
	align-items: center;
}
.head-logo {
	width: 380px;
}


/*mainvisual*/
.s-mainvisual {
	height: 50vh;
	background: url("../img/s-mainvisual.jpg");
	background-position: center;
	background-size: cover;
	position: relative;
}
.page-ttl {
	width: 80%;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translateX(-50%);
}
.page-ttl h2 {
	font-size: 70px;
	text-align: center;
	color: #3D8F4F;
	font-weight: 500;
	letter-spacing: 3px;
	line-height: 0.8;
}
.page-ttl h2 span {
	font-family: zen-kaku-gothic-new, sans-serif;
	color: #777;
	font-size: 36px;
}
.sec-padding {
	padding: 12rem 0;
}
.content-ttl {
	width: 1200px;
	margin: auto;
	background: linear-gradient(45deg, #A3D1A3 0%, #A3D1A3 50%, #BADDB1 50%, #BADDB1 100%);
	padding: 3.2rem 0;
	position: relative;
}
.content-ttl::before {
	content: "";
	width: 200px;
	height: 92px;
	background: url("../img/deco10.png");
	background-size: cover;
	position: absolute;
	top:0;
	left: 0;
}
.content-ttl::after {
	content: "";
	width: 200px;
	height: 92px;
	background: url("../img/deco11.png");
	background-size: cover;
	position: absolute;
	bottom:0;
	right: 0;
}
.content-ttl h4 {
	text-align: center;
	font-size: 32px;
	font-weight: 500;
}
.sec-padding .container {
	padding: 10rem 0 7rem 0;
}
.bg-green {
	background: linear-gradient(#fff,#EAF8E1);
}
.bg-yellow {
	background: linear-gradient(#fff,#F8F7E1);
}
.bg-blue {
	background: linear-gradient(#fff,#B7F9E9);
}
.sc-box {
	width: 1000px;
	background: #fff;
	padding: 5rem 0;
	margin: auto;
	box-shadow: 2px 2px 5px #ccc;
}


/*policy*/
.policy-ttl {
	width: 50%;
	margin: auto;
}
.policy-txt {
	width: 80%;
	margin: 3rem auto 0 auto;
}
.policy-txt p {
	font-size: 17px;
	font-weight: 500;
	line-height: 2;
}


/*doctor*/
.doctor-name {
	justify-content: center;
	gap:3rem;
	align-items: center;
}
.doctor-icon {
	width: 100px;
}
.doctor-name .name {
	width: 380px;
	border-bottom: 2px solid #3D8F4F;
	padding-bottom: 1rem;
}
.doctor-name .name p {
	font-size: 24px;
	font-weight: 500;
	color: #3D8F4F;
}
.doctor-txt {
	width: 80%;
	margin: 3rem auto 0 auto;
}
.doctor-txt p {
	font-size: 17px;
	font-weight: 500;
	line-height: 2;
}
.doc-content {
	width: 80%;
	margin: 5rem auto;
}
.doc-c-ttl {
	border-bottom: 1px solid #E3F2D9;
	padding-bottom: 1rem;
	margin-bottom: 2rem;
}
.doc-c-ttl p {
	font-weight: 500;
	color: #3D8F4F;
	font-size: 20px;
}
.career dl {
	justify-content: space-between;
	align-items: flex-start;
	font-size: 16px;
}
.career dl dt {
	width: 25%;
	margin-bottom: 1rem;
}
.career dl dd {
	width: 75%;
	margin-bottom: 1rem;
}
.affiliation ul li {
	margin-bottom: 1rem;
	font-size: 16px;
}
.forte {
	margin-bottom: 0;
}
.forte ul {
	font-size: 16px;
}
.forte ul li {
	width: 40%;
	margin-bottom: 1rem;
}


/*basic*/
.basic-img {
	width: 700px;
	margin: auto;
}
.basic-bottom {
	width: 1100px;
	margin: 5rem auto 0 auto;
	justify-content: space-between;
	align-items: center;
}
.basic-bottom .left {
	width: 40%;
}
.basic-adress {
	font-size: 22px;
	font-weight: 500;
	color: #777;
}
.basic-bottom .left .tel-bnr {
	margin: 3rem auto 0 auto;
}
.basic-bottom .right {
	width: 55%;
}
.basic-bottom .right p {
	font-size: 15px;
	margin-top: 1rem;
}


/*access*/
.access-map {
	width: 700px;
	margin: auto;
}
.access-map iframe {
	width: 100%;
}

.access-table {
	width: 900px;
	margin: 5rem auto 0 auto;
}
.access-table table {
	width: 100%;
	font-size: 16px;
	font-weight: 500;
}
.access-table table th {
	width: 35%;
	text-align: center;
	background: #E3F2D9;
	border: 1px solid #A3D1A3;
	padding: 2rem 1rem;
	box-sizing: border-box;
}
.access-table table td {
	width: 65%;
	background:  #fff;
	border: 1px solid #A3D1A3;
	padding: 2rem 1rem;
	box-sizing: border-box;
}


/*reserve*/
#reserve .page-link02 {
	margin: 3rem auto 0 auto;
}


/*for-first*/
.sc-index {
	width: 90%;
	margin: 5rem auto 0 auto;
}
.ttl-sc-index {
	border-bottom: #A3D1A3 1px solid;
	padding-bottom: 1rem;
}
.ttl-sc-index p {
	font-size: 24px;
	text-align: center;
	font-weight: 600;
	color: #3D8F4F;
}
.sc-index .inner {
	width: 95%;
	margin: 3rem auto 0 auto;
}
.sc-index-txt {
	font-size: 16px;
	line-height: 2;
}
.sc-index-txt .txt-green {
	color: #3D8F4F;
}
.sc-minibox {
	width: 70%;
	margin: 5rem auto 0 auto;
	background: #F3FEFA;
	padding: 3rem 0;
}
.scmb-ttl {
	text-align: center;
	font-size: 20px;
	font-weight: 500;
}
.scmb-txt {
	font-size: 15px;
	line-height: 2;
	width: 90%;
	margin: 2rem auto 0 auto;
}


/*qa*/
.qa-wrapper {
	width: 1000px;
	margin: 5rem auto;
	flex-direction: column;
}
.accordion-006 {
    width:100%;
    margin-bottom: 7px;
    background-color: #3d8f4f;
}

.accordion-006 summary {
  display: flex;
  justify-content: space-between;
  align-items: center;
  position: relative;
  padding: 1em 2em;
  color: #ffffff;
  font-weight: 500;
	font-size: 17px;
  cursor: pointer;
}

.accordion-006 summary::-webkit-details-marker {
  display: none;
}
.accordion-006 summary::before,
.accordion-006 summary::after {
  width: 3px;
  height: .9em;
  border-radius: 5px;
  background-color: #fff;
  content: '';
}

.accordion-006 summary::before {
  position: absolute;
  right: 2em;
  rotate: 90deg;
}

.accordion-006 summary::after {
  transition: rotate .3s;
}

.accordion-006[open] summary::after {
  rotate: 90deg;
}

.accordion-006 p {
  transform: translateY(-10px);
  opacity: 0;
  margin: 0;
  padding: 2rem;
	background: #fff;
  transition: transform .5s, opacity .5s;
	font-size: 15px;
	line-height: 2;
}

.accordion-006[open] p {
  transform: none;
  opacity: 1;
}

.medical-txt {
	width: 90%;
	margin: 0 auto 3rem auto;
}
.medical-txt p {
	font-size: 16px;
	font-weight: 500;
	line-height: 2;
}

.medical-table {
	width: 90%;
	margin: 3rem auto 0 auto;
}
.medical-table table {
	width: 100%;
	font-size: 16px;
}
.medical-table table th {
	width: 35%;
	text-align: center;
	background: #E3F2D9;
	border: 1px solid #A3D1A3;
	padding: 2rem 1rem;
	box-sizing: border-box;
	font-weight: 500;
}
.medical-table table td {
	width: 65%;
	background:  #fff;
	border: 1px solid #A3D1A3;
	padding: 2rem 1rem;
	box-sizing: border-box;
	overflow-wrap: break-word;
	word-wrap: break-word;
	white-space: normal;
}
.medical-table p {
	font-size: 14px;
	margin-top: 1rem;
	line-height: 1.5;
}


.side-bar {
	position: fixed;
	top:50%;
	right: 0;
	background: #3D8F4F;
	padding: 1rem;
	border-top-left-radius: 1rem;
	border-bottom-left-radius: 1rem;
	z-index: 100;
}
.side-bar a {
	display: block;
	text-orientation: upright;
  writing-mode: vertical-rl;
  text-align: center;
	font-size: 20px;
}






/*---------------------------------------------*/

/*トップリンク*/
/*リンクの形状*/
#page-top a{
	display: flex;
	justify-content:center;
	align-items:center;
	background:#3D8F4F;
	border: 1px solid #fff;
	border-radius: 50%;
	width: 60px;
	height: 60px;
	color: #fff;
	text-align: center;
	text-transform: uppercase; 
	text-decoration: none;
	font-size:0.6rem;
	transition:all 0.3s;
}

/*リンクを右下に固定*/
#page-top {
	position: fixed;
	right: 10px;
	bottom:10px;
	z-index: 2;
    /*はじめは非表示*/
	opacity: 0;
	transform: translateY(100px);
}

/*　上に上がる動き　*/

#page-top.UpMove{
	animation: UpAnime 0.5s forwards;
}
@keyframes UpAnime{
  from {
    opacity: 0;
	transform: translateY(100px);
  }
  to {
    opacity: 1;
	transform: translateY(0);
  }
}

/*　下に下がる動き　*/

#page-top.DownMove{
	animation: DownAnime 0.5s forwards;
}
@keyframes DownAnime{
  from {
  	opacity: 1;
	transform: translateY(0);
  }
  to {
  	opacity: 1;
	transform: translateY(100px);
  }
}




/*==================================================
ふわっ
===================================*/

/* その場で */
.fadeIn{
animation-name:fadeInAnime;
animation-duration:1.0s;
animation-fill-mode:forwards;
opacity:0;
}

@keyframes fadeInAnime{
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

/* 下から */

.fadeUp{
animation-name:fadeUpAnime;
animation-duration:1.0s;
animation-fill-mode:forwards;
opacity:0;
}

@keyframes fadeUpAnime{
  from {
    opacity: 0;
  transform: translateY(100px);
  }

  to {
    opacity: 1;
  transform: translateY(0);
  }
}

/* 上から */

.fadeDown{
animation-name:fadeDownAnime;
animation-duration:1.0s;
animation-fill-mode:forwards;
opacity:0;
}

@keyframes fadeDownAnime{
  from {
    opacity: 0;
  transform: translateY(-100px);
  }

  to {
    opacity: 1;
  transform: translateY(0);
  }
}

/* 左から */

.fadeLeft{
animation-name:fadeLeftAnime;
animation-duration:1.0s;
animation-fill-mode:forwards;
opacity:0;
}

@keyframes fadeLeftAnime{
  from {
    opacity: 0;
  transform: translateX(-100px);
  }

  to {
    opacity: 1;
  transform: translateX(0);
  }
}

/* 右から */

.fadeRight{
animation-name:fadeRightAnime;
animation-duration:1.0s;
animation-fill-mode:forwards;
opacity:0;
}

@keyframes fadeRightAnime{
  from {
    opacity: 0;
  transform: translateX(100px);
  }

  to {
    opacity: 1;
  transform: translateX(0);
  }
}

/* スクロールをしたら出現する要素にはじめに透過0を指定　*/
 
.fadeInTrigger,
.fadeUpTrigger,
.fadeDownTrigger,
.fadeLeftTrigger,
.fadeRightTrigger{
    opacity: 0;
}


/*==================================================
スタート時は要素自体を透過0にするためのopacity:0;を指定する
===================================*/

.box{
	opacity: 0;
}

/*==================================================
動かしたい動き（今回は” ふわっ” を採用）
===================================*/

.fadeUp {
animation-name:fadeUpAnime;
animation-duration:1.0s;
animation-fill-mode:forwards;
opacity: 0;
}

@keyframes fadeUpAnime{
  from {
    opacity: 0;
	transform: translateY(100px);
  }

  to {
    opacity: 1;
	transform: translateY(0);
  }
}