@charset "UTF-8";
/*
    Template: swell
    Theme Name: SWELL CHILD
    Theme URI: https://swell-theme.com/
    Description: SWELLの子テーマ
    Version: 1.0.0
    Author: LOOS WEB STUDIO
    Author URI: https://loos-web-studio.com/

    License: GNU General Public License
    License URI: http://www.gnu.org/licenses/gpl.html
*/

@charset "UTF-8";
/*
Theme Name: BE CLINIC
Description: BE CLINIC
Version: 2022.10
Author: YH
*/

/* ------------------------------------------
   Reset
------------------------------------------ */
html, body, div, span,
h1, p,
a, img, s, var, i, ul, li, form, footer, header,
menu, nav, section,
time {
  margin: 0;
  padding: 0;
  border: 0;
  font-style: normal;
  font-weight: normal;
  font-size: 100%;
  vertical-align: baseline; }

* {
  outline: none; }

body {
  line-height: 1; }

h1 {
  font-weight: normal; }

 ul {
  list-style: none; }

/* tables still need 'cellspacing="0"' in the markup */

a:focus {
  outline: none; }

a img {
  border: none; }

input {
  border-radius: 0; }

@media screen and (max-width: 767px) {
  input {
    -webkit-appearance: none;
  }
}

/* ------------------------------------------
   Utility Class
------------------------------------------ */
/*** clearfix ***/
.clearfix:after {
  content: ".";
  display: block;
  clear: both;
  height: 0;
  visibility: hidden; }

/* Style
-------------------------------------------------------------- */
html {
  height: 100%;
  font-size: 10px; }

body {
  height: 100%;
  font-size: 1.5rem;
  line-height: 2.0em;
  color: #505050;
  -webkit-text-size-adjust: none;
  min-width: 960px;
  font-family: 'Sawarabi Gothic', sans-serif;
  transition: opacity 0.6s ease;
  /* font-feature-settings: "palt"; */
}
body.show {
  opacity: 1;
}
header p,footer p {
  color: inherit;
  font-size: inherit;
  line-height: 2em; }

/* a, a img {
  text-decoration: none;
  font-weight: 500;
  color: #505050;
  transition: color 0.3s ease, background 0.3s ease, opacity 0.3s ease;
  } */

header a:hover,footer a:hover  {
  opacity: 0.75; }

header span,footer span {
	font-size: inherit;
	font-weight: inherit;
	color: inherit;
}
header img,footer img {
  display: block;
  max-width: 100%;
  height: auto; }

header h1,footer h1 {
  line-height: inherit; }

.non_pc {
  display: none !important; }

.f_en {
    font-family: 'DM Sans', sans-serif; 
	letter-spacing: 0.1em;
}

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

	Common

=========================================================================================== */
.main {
  z-index: 100;
  margin: 0 auto;
  position: relative;
  transition: opacity 0.3s ease;
  z-index: 100;
  padding: 90px 0 0 0;
}
#index .main {
}

/* Header *******************************/
header {
  top: 0;
  position: fixed;
  width: 100%;
  height: 90px;
  z-index: 10000;
  min-width: 960px;
  left: 50%;
  transform: translate(-50%, 0);
  background: #fff;
}
header > .inner {
	height: 100%;
	padding: 0 70px;
	display: flex;
	justify-content: space-between;
	align-items: center;
}
header .bg {
	position: absolute;
	top: -100px;
	left: 50%;
	height: 100px;	
	background: #fff;
	width: 100%;
	min-width: 960px;
	transform: translate(-50%, 0);
    transition: top 0.3s ease;
    z-index: 20;
}
header.show .bg,
#inner header .bg {
	top: 0;
}
header.open .bg,
#inner header.open .bg {
	top: -100px;
}

header h1 {position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);}
header h1 a {
  display: block;
  padding: 10px;
  width: 32px;
}
header .link {
	display: flex;
	align-items: center;
}
header .link a {
    display: flex;
    padding: 7px 0;
    justify-content: center;
    flex-direction: column;
    align-items: center;
    width: 68px;
    box-sizing: border-box;
	background: url(./images/icon_line2_b.png) no-repeat center 7px;
	background-size: 35px 35px;
}
.pc_view header .link a.bt_line {
	background-image: url(./images/icon_line2_b.png);
}
.pc_view header .link a.bt_reservation {
	background-image: url(./images/icon_reservation2_b.png);
}
.pc_view header .link a.bt_instagram {
	background-image: url(./images/icon_instagram_b.png);
}
.pc_view header .link a.bt_map {
	background-image: url(./images/icon_map2_b.png);
}
.pc_view header .link a.bt_search {
	width: 52px;
	background-image: url(./images/icon_search_b.png);
}
header .link a img {
	width: 35px;
}
header .link a:hover {
    opacity: 1;
}
.pc_view header .link a:hover {
	color: #bcd4dc;
}
.pc_view header .link a:hover img {
    opacity: 0;
}
header .link a span {
	font-size: 11px;
	margin-top: 2px;
	line-height: 1em;
}
header .link .search {
	position: relative;
	margin-right: 20px;
	position: absolute;
	right: 60px;
	bottom: -54px;
}
header .link .search {
	display: none;
}
header .search form {
	display: flex;
}
header .search input[type=search] {
    border: none;
    border-radius: 0;
    padding: 6px 12px;
    font-size: 14px;
    box-sizing: border-box;
    display: block;
    width: 220px;
    line-height: 24px;
    border-radius: 5px 0 0 5px;
    margin: 0;
}
header .search input[type=search]::-webkit-input-placeholder {
    font-family: 'Montserrat', sans-serif;
    color: #323232;
    font-weight: 500;
    letter-spacing: 0.1em;
    font-size: 12px;
}
header .search input[type=search]:-ms-input-placeholder {
    font-family: 'Montserrat', sans-serif;
    color: #323232;
    font-weight: 500;
    letter-spacing: 0.1em;
    font-size: 12px;
}
header .search input[type=search]::placeholder {
    font-family: 'Montserrat', sans-serif;
    color: #323232;
    font-weight: 500;
    letter-spacing: 0.1em;
    font-size: 12px;
}
header .search input[type=submit] {border: none;background: url(./images/icon_search2.png) no-repeat center center;background-size: 25px 25px;background-color: #6c9fc0;height: 36px;text-indent: -9999px;border-radius: 0 5px 5px 0;width: 36px;cursor: pointer;}
header .bt_menu {
	position: relative;
	display: block;
	width: 80px;
	height: 80px;
	margin: 0;
	font-size: 12px;
	text-align: center;
	box-sizing: border-box;
	padding-top: 0;
	z-index: 1000;
	overflow: hidden;
	padding-top: 39px;
}
header .bt_menu::before,
header .bt_menu::after {
	display: block;
	position: absolute;
	content: "";
	width: 36px;
	height: 1px;
	background: #000;
	top: 20px;
	left: 22px;
	transition: all 0.3s ease;
}
header .bt_menu::after {
    top: 37px;
}
header.open .bt_menu::before {
	background: #fff;
	transform: rotate(135deg);
	left: 22px;
	top: 30px;
}
header.open .bt_menu::after {
	background: #fff;
	transform: rotate(-135deg);
	left: 22px;
	top: 30px;
}
header .bt_menu span {
    transition: color 0.3s ease;
}
header.open .bt_menu span {
	display: block;
	color: #68bad3;
	position: relative;
}
header .bt_menu span::before {
    color: #fff;
    content: "CLOSE";
    display: block;
    position: absolute;
    left: 0;
    width: 100%;
    transition: opacity 0.3s ease;
    opacity: 0;
}
header.open .bt_menu span::before {
	opacity: 1;
}
header .gmenu {
	display: none;
	position: absolute;
	top: 0;
	left: 0;
	width: 540px;
	z-index: 999;
	padding-bottom: 50px;
}
header .gmenu::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	background: url(	https://beclinic.jp/wp/wp-content/themes/beclinic.jp/images/bg_menu.png) left top;
	background-size: cover;
	width: 680px;
	height: 680px;
	pointer-events: none;
}
header .gmenu nav {
	display: block;
	padding: 120px 0 0 100px;
	position: relative;
}
header .gmenu ul {display: flex;flex-direction: column;align-items: start;}
header .gmenu ul li + li {margin-top: 6px;}
header .gmenu ul li a {
	color: #fff;
	font-size: 12px;
	display: flex;
	align-items: center;
	letter-spacing: 0.1em;
}
header .gmenu ul li a.comingsoon {
	pointer-events: none;
	opacity: 0.4;
}
header .gmenu ul li a span {
	font-size: 18px;
	display: block;
	width: 190px;
	letter-spacing: 0.2em;
}
header .gmenu ul li a span + span {
	font-size: 12px;
	letter-spacing: 0.1em;
}
.pc_view header .gmenu .search {
	display: none;
}
/* Footer *******************************/
.footer {
	position: relative;
	z-index: 100;
	background: #68bed7;
}
footer .linkbox {
	display: flex;
	background: #eee;
}
footer .linkbox .box {
	background: #797f80;
	width: calc(100% / 4);
	height: 290px;
	color: #fff;
	box-sizing: border-box;
	padding-top: 60px;
	transition: all ease 1s;
	opacity: 0;
	position: relative;
}
footer .linkbox.active .box {
	opacity: 1;
}
footer .linkbox .box:nth-child(2) {
	transition-delay: 0.1s;
}
footer .linkbox .box:nth-child(3) {
	transition-delay: 0.2s;
}
footer .linkbox .box:nth-child(4) {
	transition-delay: 0.3s;
}
footer .linkbox .box.reservation,
footer .linkbox .box.contact {
	background: #5f666c;
}
footer .linkbox .box .title {
	font-size: 13px;
	letter-spacing: 0.2em;
	padding: 10px 0 0 20px;
	width: 220px;
	margin: 0px auto;
}
footer .linkbox .box.contact .title {
	width: 190px;
	margin: 0px auto;
}
footer .linkbox .box.line .title {
	padding: 10px 0 0 0px;
	width: 240px;	
}
footer .linkbox .box .title img {
	width: 60px;
	float: left;
	margin-right: 20px;
}
footer .linkbox .box.line .title img {
	margin-right: 10px;
}
footer .linkbox .box .title span {display: block;line-height: 1.5em;font-size: 15px;margin-top: 6px;}
footer .linkbox .box .fbox {min-width: 215px;display: flex;width: 63%;margin: 30px auto 0 auto;}
footer .linkbox .box .fbox a {color: #fff;width: 100%;text-align: center;font-size: 11px;letter-spacing: 0.2em;text-indent: 0.2em;border: 1px solid #fff;padding: 7px 0;position: relative;}
footer .linkbox .box .fbox a::before {
	content: "";
	position: absolute;
	right: 16px;
	top: 50%;
	width: 6px;
	height: 6px;
	border-top: 1px solid #fff;
	border-right: 1px solid #fff;
	transform: rotate(45deg) translate(0, -50%);
}
footer .linkbox .box .fbox a + a {
	border-left: none;
}
footer .linkbox .box.comingsoon .title,
footer .linkbox .box.comingsoon .fbox {
	opacity: 0.5;
	pointer-events: none;
}
footer > .inner {
	width: 1000px;
	margin: 0 auto;
	color: #fff;
	padding: 50px 0 25px 0;
	background: #68bad3;
}
footer > .inner .logo {display: block;width: 158px;margin: 0 auto;
					  
	transition: all ease 1s;
	opacity: 0;
	position: relative;
   top: 20px;
}
footer > .inner.active .logo {
	opacity: 1;
   top: 0px;
}
footer > .inner.active .logo span {
	text-align: center;
	font-size: 13px;
	display: block;
	color: #fff;
	margin-top: 7px;
}
footer > .inner .fbox {
	display: flex;
	justify-content: space-between;
	margin-top: 55px;
}
footer > .inner .fbox .box {
	width: 500px;
	box-sizing: border-box;
	border-right: 1px solid #fff;
	padding: 10px 40px;
	position: relative;
	transition: all ease 1s;
	opacity: 0;
	position: relative;
   top: 20px;
}
footer > .inner .fbox .box.access {
	transition-delay: 0.2s;
}
footer > .inner.active .fbox .box {
	opacity: 1;
   top: 0px;
}
footer > .inner .fbox .box .title {
	font-size: 13px;
	letter-spacing: 0.2em;
}
footer > .inner .fbox .box .text {
	font-size: 14px;
	letter-spacing: 0.2em;
	line-height: 1.6em;
}
footer > .inner .fbox .box.time {
	border-left: 1px solid #fff;
}
footer > .inner .fbox .box.time img {
	margin: 42px 0 28px 0;
}
footer > .inner .fbox .box.access .text {
	margin-top: 40px;
}
footer > .inner .fbox .box.access .bt_map {
	border-color: #fff;
	position: absolute;
	right: 80px;
	top: 50px;
	padding: 7px;
	width: 76px;
	line-height: 76px;
	background: url(./images/icon_map_b.png) no-repeat center center;
	background-size: 60px 60px;
}
footer > .inner .fbox .box.access .bt_map::before {
	background: #fff;
}
footer > .inner .fbox .box.access .bt_map:hover {
	background-color: #fff;
}
footer > .inner .fbox .box.access .bt_map span {
	position: absolute;
	bottom: -23px;
	width: 120px;
	color: #fff;
	left: 50%;
	transform: translate(-50%, 0);
	line-height: 1em;
	letter-spacing: 0.1em;
}
footer > .inner .fbox .box.access .bt_map:hover img {
	opacity: 0;
}
footer > .inner .bnr {
	display: flex;
	flex-wrap: wrap;
	margin-top: 76px;
}
footer > .inner .bnr a {
	width: 316px;
	margin: 26px 0 0 26px;
	display: block; 
	transition: all ease 1s;
	opacity: 0;
	position: relative;
   top: 20px;
}
footer > .inner .bnr.active a {
	opacity: 1;
   top: 0px;
}
footer > .inner .bnr.active a:nth-child(2) { transition-delay: 0.1s }
footer > .inner .bnr.active a:nth-child(3) { transition-delay: 0.2s }
footer > .inner .bnr.active a:nth-child(4) { transition-delay: 0.3s }
footer > .inner .bnr.active a:nth-child(5) { transition-delay: 0.4s }
footer > .inner .bnr.active a:nth-child(6) { transition-delay: 0.5s }
footer > .inner .bnr a:nth-child(-n+3) {
	margin-top: 0;
}
footer > .inner .bnr a:nth-child(3n-2) {
	margin-left: 0;
}
footer > .inner .link {margin-top: 60px;letter-spacing: 0.1em;}
footer > .inner .link a {font-size: 13px;color: #fff;margin-right: 20px;display: inline-block;}
footer > .inner .link a.comingsoon {
	pointer-events: none;
	opacity: 0.4;
}
footer .copyright {
    background: #fff;
    border-top: 15px solid #bdd5dd;
}
footer .copyright p {
    font-size: 11px;
    padding: 30px 0;
	width: 1000px;
	margin: 0 auto;
}

.bt_more {
	display: block;
	width: 88px;
	line-height: 88px;
	text-align: center;
	border: 1px solid #6cafd0;
	border-radius: 100px;
	position: relative;
	box-sizing: border-box;
	font-size: 15px;
	color: #6cafd0;
	letter-spacing: 0.1em;
	text-indent: 0.1em;
	opacity: 0;
}
.bt_more.active {
	opacity: 1;
}
.bt_more::before {
	height: 1px;
	content: "";
	display: block;
	position: absolute;
	width: 0;
	background: #6cafd0;
	top: 50%;
	left: 100%;
	transition: all ease 0.3s +0.3s;
}
.bt_more.delay0::before {
	transition-delay: 0s;
}
.bt_more.active::before {
	width: 18px;
}
.pc_view .bt_more:hover {
	background: #6cafd0;
	color: #fff;
	opacity: 1;
}
.pc_view .bt_more:hover::before {
	width: 0;
}


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

  Index

=========================================================================================== */
#index .sec {}
#index {}
#index .visual {
  position: relative;
}
#index .visual>.inner {
  width: 1000px;
  margin: 0 auto;
  position: relative;
  height: 600px;
  box-sizing: border-box;
  padding: 50px 0 0 0;
	transition: all ease 0.6s;
	opacity: 1;
}
#index .visual.slide3>.inner {
	opacity: 0;
}
#index .visual .bg {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  transition: border-radius 3s +0.5s;
  border-radius: 0 0 0 0;
}
#index .visual.show .bg {
  border-radius: 0 0 0 100px;
}
#index .visual .bg .slide {
  height: 100%;
  width: 100%;
}
#index .visual .bg .slide .img {
  height: 100%;
  width: 0%;
  position: absolute;
  left: 0;
  top: 0;
  overflow: hidden;
  transition: ease width 1.5s +1.5s;
}
#index .visual.show .bg .slide.slick-active .img {
  width: 100%;
  transition: ease width 1.5s;
}
#index .visual .bg .slide .img div {
  background: url(./images/index/img_visual.jpg) no-repeat center center #d3e2eb;
  background-size: cover;
  height: 100%;
  transform: scale(1.05);
	position: relative;
	left: 2%;
}
#index .visual.show .bg .slide .img div {
  transition: ease left 10s +2s;

}
#index .visual .bg .slide.slick-active .img div {
	left: -2%;
  transition: ease left 10s -2s;
}
#index .visual .bg .slide1 .img {
  background-color: #d3e2eb;
}
#index .visual .bg .slide1 .img div {
  background-image: url(./images/index/img_visual.jpg);
  background-size: auto 100%;
	transform: scale(1);
}
#index .visual .bg .slide2 .img div {
  background-image: url(./images/index/img_visual2.jpg);
}
#index .visual .bg .slide3 .img div {
  background-image: url(./images/index/img_visual3.jpg);
}
#index .visual .bg .slide3 img {
	position: absolute;
	width: 995px;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	margin-top: -13px;
}
#index .visual img.logo {
  width: 345px;
  margin-top: 90px;
	left: 20px;
	position: relative;
	opacity: 0;
	transition: 1s ease all +0.5s;
}
#index .visual.show img.logo {
	left: 0;
	opacity: 1;
}
.slick-dots {
  bottom: 30px;
  z-index: 200;
  left: 50%;
  width: auto;
  margin-left: -458px;
  display: flex;
}
.slick-dots li {
  width: auto;
  height: 11px;
  margin: 0 2px;
  display: flex;
  align-items: center;
}

/*============================
#about
============================*/

#index .about.sec {
  padding: 120px 0 100px 0;
  position: relative;
}
#index .about.sec .before,
#index .about.sec .after {
  content: "";
  display: block;
  position: absolute;
  width: 800px;
  height: 800px;
  border-radius: 1000px 0 1000px 1000px;
  background: rgb(193, 217, 225);
  background: -moz-linear-gradient(left, rgba(193, 217, 225, 1) 0%, rgba(230, 230, 230, 1) 100%, rgba(230, 230, 230, 1) 100%);
  background: -webkit-linear-gradient(left, rgba(193, 217, 225, 1) 0%, rgba(230, 230, 230, 1) 100%, rgba(230, 230, 230, 1) 100%);
  background: linear-gradient(to right, rgba(193, 217, 225, 1) 0%, rgba(230, 230, 230, 1) 100%, rgba(230, 230, 230, 1) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#c1d9e1', endColorstr='#e6e6e6', GradientType=1);
  right: -315px;
  top: -120px;
  mix-blend-mode: multiply;
  opacity: 1;
	transition: margin 2s cubic-bezier(0, 0, 0.16, 0.99), opacity ease 2s;
	opacity: 0;
}
#index .about.sec .before.active,
#index .about.sec .after.active {
	opacity: 1;	
}
#index .about.sec .after {
  transform: rotate(180deg);
  top: 724px;
  right: auto;
  left: -320px;
}
#index .about.sec>.inner {
  width: 1000px;
  margin: 0 auto;
  position: relative;
  z-index: 100;
}
#index .about.sec p.text {
  text-align: center;
  font-size: 15px;
  margin-top: 30px;
  line-height: 1.8em;
  letter-spacing: 0.1em;
  position: relative;
  top: 20px;
  opacity: 0;
  transition: all ease 1s +0.6s;
}
#index .about.sec.active p.text {
	opacity: 1;
	top: 0;
}
#index .about.sec .fbox {
  display: flex;
  justify-content: space-between;
  margin-top: 60px;
}
#index .about.sec .fbox .box {
  width: 30.5%;
  padding: 38px 0 0 0;
	position: relative;
	top: 20px;
	opacity: 0;
	transition: all ease 1s;
}
#index .about.sec .fbox .box::before {
	content: "";
	background: #505050;
	width: 0%;
	height: 1px;
	display: block;
	left: 0;
	top: 0;
	position: absolute;
	transition: all ease 1s;
}
#index .about.sec .fbox.active .box::before {
	width: 100%;
}
#index .about.sec .fbox .box:nth-child(2),
#index .about.sec .fbox .box:nth-child(2)::before {
	transition-delay: 0.2s;
}
#index .about.sec .fbox .box:nth-child(3),
#index .about.sec .fbox .box:nth-child(3)::before {
	transition-delay: 0.4s;
}
#index .about.sec .fbox.active .box {
	opacity: 1;
	top: 0;
}
#index .about.sec .fbox .box img {
  width: 120px;
  margin: 10px auto 0 auto;
}
#index .about.sec .fbox .box p.title {
  text-align: center;
  font-size: 20px;
  margin-top: 10px;
  letter-spacing: 0.1em;
}
#index .about.sec .fbox .box p.text {
  text-align: justify;
  font-size: 13px;
  /* padding: 0 10px; */
}
#index .about.sec a.bt_more.f_en {
  margin: 70px auto 0 auto;
}

/*============================
#faq
============================*/

.faqlist {
  width: 730px;
}
.faqlist li+li {
  margin-top: 15px;
}
.faqlist li {
  box-shadow: 0 0 7px rgba(0, 0, 0, 0.1);
  border-radius: 12px;
	overflow: hidden;
}
.faqlist li > a {
  position: relative;
  display: block;
  display: flex;
  align-items: center;
  font-size: 13px;
  padding: 20px 135px 20px 25px;
  background: #fff;
}
.faqlist li > a::after {
  content: "ANSWER";
  font-family: 'DM Sans', sans-serif;
  letter-spacing: 0.1em;
  display: block;
  position: absolute;
  right: 56px;
  font-size: 11px;
  top: 50%;
  transform: translate(0, -50%);
}
.faqlist li > a::before {
  content: "";
  position: absolute;
  display: block;
  width: 1px;
  height: 31px;
  background: #464342;
  right: 43px;
  top: 50%;
	transition: all ease 0.3s;
}
.faqlist li > a p {
  line-height: 1.8em;
}
.faqlist li a p.title {
  width: 500px;
}
.faqlist li .body {
	background: #fff;
	padding: 25px 25px;
	display: none;
}
.faqlist li .body p {
  line-height: 1.8em;
  font-size: 13px;
}
.faqlist li .body p a {
	color: #6ab3c5;
}
.pc_view .faqlist li a:hover,
.faqlist li a.open {
	background: #4b9fd4;
	color: #fff;
	opacity: 1;
}
.pc_view .faqlist li a:hover::before,
.faqlist li a.open::before {
	background: #fff;
}
.pc_view .faqlist li a:hover::after,
.faqlist li a.open::after {
	color: #fff;
}

/*============================
#news
============================*/

#index .news.sec {
  padding: 100px 0 70px 0;
  position: relative;
	transition: all ease 1s;
}
#index .news.sec.active {
  background: rgba(221, 221, 221, 0.5);
}
#index .news.sec>.inner {
  width: 1000px;
  margin: 0 auto;
  display: flex;
  align-items: start;
  justify-content: space-between;
}

/*============================
#topic
============================*/

#index .topic.sec {
  padding: 80px 0 70px 0;
  position: relative;
  z-index: 100;
  transition: background ease 1s;
}
#index .topic.sec.active {
  background: #bdd5dd;
}
#index .topic.sec>.inner {
  overflow: hidden;
  max-width: 3000px;
  margin: 0 auto;
  position: relative;
  padding-bottom: 30px;
}
.topicslist {
	display: flex;
	flex-wrap: wrap;
}

#index .topic.sec .topicslist,
#index .subtopics.sec .appendixlist {
	transition: all ease 1s;
	opacity: 0;
	position: relative;
	top: 20px;
	width: 1000px;
	margin: 60px auto 0 auto;
	left: 0;
}
#index .topic.sec.active .topicslist,
#index .subtopics.sec.active .appendixlist {
	opacity: 1;
	top: 0;
}
.topicslist .box,
.appendixlist .box {
	margin: 50px 0 0 50px;
}
.topicslist .box:nth-child(3n-2),
.appendixlist .box:nth-child(3n-2) {
	margin-left: 0;
}
.topicslist .box:nth-child(-n+3),
.appendixlist .box:nth-child(-n+3) {
	margin-top: 0;
}
.topicslist .box a {
  width: 300px;
  display: block;
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 0 7px rgba(0, 0, 0, 0.1);
  margin: 0 auto;
  padding-bottom: 30px;
	transition: all ease 0.3s;
}
.topicslist .box a:hover {
	opacity: 1;
	transform: scale(1.03);
	background: #4b9fd4;
	color: #fff;
}
.topicslist .box a .info {}
.topicslist .box a .info .img {
  border-radius: 12px 12px 0 0;
  overflow: hidden;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
  padding-top: 76%;
}
.topicslist .box a .info .img img {}
.topicslist .box a .info p.title {
  font-size: 18px;
  padding: 0 20px;
  margin-top: 20px;
  line-height: 1.6em;
}
.topicslist .box a .info .fbox {
  font-size: 11px;
  display: flex;
  color: #4b9fd4;
  padding: 0 20px;
  margin-top: 15px;
	transition: color ease 0.3s;
}
.topicslist .box a:hover .info .fbox {
	color: #fff;
}
.topicslist .box a .info p.text {
  font-size: 13px;
  padding: 0 20px;
  line-height: 1.8em;
  margin: 20px 0 0 0;
  max-height: 3.6em;
  overflow: hidden;
}

/*============================
#menu
============================*/

#index .menu.sec {
  padding: 150px 0 100px 0;
  position: relative;
}
#index .menu.sec .before,
#index .menu.sec .after {
  content: "";
  display: block;
  position: absolute;
  width: 800px;
  height: 800px;
  border-radius: 1000px 0 1000px 1000px;
  background: rgb(193, 217, 225);
  background: -moz-linear-gradient(left, rgba(193, 217, 225, 1) 0%, rgba(230, 230, 230, 1) 100%, rgba(230, 230, 230, 1) 100%);
  background: -webkit-linear-gradient(left, rgba(193, 217, 225, 1) 0%, rgba(230, 230, 230, 1) 100%, rgba(230, 230, 230, 1) 100%);
  background: linear-gradient(to right, rgba(193, 217, 225, 1) 0%, rgba(230, 230, 230, 1) 100%, rgba(230, 230, 230, 1) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#c1d9e1', endColorstr='#e6e6e6', GradientType=1);
  right: -330px;
  top: 666px;
  mix-blend-mode: multiply;
  opacity: 1;
	transition: margin 2s cubic-bezier(0, 0, 0.16, 0.99), opacity ease 2s;
	opacity: 0;
}
#index .menu.sec .before.active,
#index .menu.sec .after.active {
	opacity: 0.5;
}
#index .menu.sec .after {
  transform: rotate(180deg);
  top: -140px;
  right: auto;
  left: -320px;
}
#index .menu.sec>.inner {
  width: 1000px;
  margin: 0 auto;
  position: relative;
  z-index: 100;
}
#index .menu.sec .tab {
  display: flex;
  justify-content: space-between;
  margin-top: 95px;
	opacity: 0;
	transition: all 0.6s ease;
	position: relative;
	top: 20px;
}
#index .menu.sec .tab.active {
  opacity: 1;
	top: 0;
}
#index .menu.sec .tab a {
  display: block;
  background: #fff;
  width: 47%;
  box-shadow: 0 0 15px rgba(0, 0, 0, 0.1);
  border-radius: 12px;
  padding: 41px 0 70px 0;
  display: flex;
  justify-content: center;
  /* pointer-events: none; */
  position: relative;
}
#index.pc_view .menu.sec .tab a:hover {
	background: #6cafd0;
	color: #fff;
	opacity: 1;
}
#index .menu.sec .tab a::before {
  content: "";
  position: absolute;
  display: block;
  width: 8px;
  height: 8px;
  border-radius: 10px;
  background: #6cafd0;
  bottom: 36px;
  left: 50%;
  transform: translate(-50%, 0);
	transition: background 0.3s ease;
}
#index.pc_view .menu.sec .tab a:hover::before {
	background: #fff;
}
#index .menu.sec .tab a::after {
  content: "";
  display: block;
  position: absolute;
  width: 1px;
  height: 64px;
  background: #6cafd0;
  left: 50%;
  bottom: -36px;
  margin-left: -1px;
	transition: opacity 0.3s ease;
	opacity: 1;
	animation: a_border 2s ease infinite;
	-webkit-animation: a_border 2s ease infinite;
}
#index.pc_view .menu.sec .tab a:hover::after {
	opacity: 0;
}

@-moz-keyframes a_border {
	0% { height: 0px; bottom: 36px;}
	50% { height: 64px; bottom: 36px;}
	50% { height: 64px; bottom: -33px;}
	100% { height: 0px; bottom: -33px;}
}

@-webkit-keyframes a_border {
	0% { height: 0px; bottom: 36px;}
	50% { height: 64px; bottom: 36px;}
	50% { height: 64px; bottom: -33px;}
	100% { height: 0px; bottom: -33px;}
}
#index .menu.sec .tab a>span {
  display: block;
  font-size: 20px;
  letter-spacing: 0.2em;
  padding: 10px 20px 10px 90px;
  background: url(./images/index/icon_menu1.png) no-repeat left center;
  background-size: 75px auto;
	transition: background 0.3s ease;
}
#index.pc_view .menu.sec .tab a:hover>span {
  background-image: url(./images/index/icon_menu1_w.png);
}
#index .menu.sec .tab a span span.f_en {
  font-size: 13px;
  color: #6cafd0;
  display: block;
  line-height: 1em;
  letter-spacing: 0.2em;
  margin-top: 8px;
	transition: color 0.3s ease;
}
#index .menu.sec .tab a:hover span span.f_en {
  color: #fff;
}
#index .menu.sec .tab a.bt_problem > span {
  background-image: url(./images/index/icon_menu2.png);
}
#index .menu.sec .tab a.bt_problem:hover>span {
  background-image: url(./images/index/icon_menu2_w.png);
}
#index .menu.sec .tab_inner {
  display: flex;
  margin-top: 50px;
  justify-content: space-between;
}
#index .menu.sec .tab_inner>div {
  width: 47%;
}
#index .menu.sec .tab_inner>div ul {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}
#index .menu.sec .tab_inner>div ul li {
  width: 48.8%;
  margin-top: 2.4%;
	opacity: 0;
	transition: all 0.6s ease;
	position: relative;
	top: 20px;
}
#index .menu.sec .tab_inner>div ul.active li {
  opacity: 1;
	top: 0;
}
#index .menu.sec .tab_inner>div ul.active li:nth-child(3),
#index .menu.sec .tab_inner>div ul.active li:nth-child(4) {
	transition-delay: 0.1s;
}
#index .menu.sec .tab_inner>div ul.active li:nth-child(5),
#index .menu.sec .tab_inner>div ul.active li:nth-child(6) {
	transition-delay: 0.2s;
}
#index .menu.sec .tab_inner>div ul.active li:nth-child(7),
#index .menu.sec .tab_inner>div ul.active li:nth-child(8) {
	transition-delay: 0.3s;
}
#index .menu.sec .tab_inner>div ul.active li:nth-child(9),
#index .menu.sec .tab_inner>div ul.active li:nth-child(10) {
	transition-delay: 0.4s;
}
#index .menu.sec .tab_inner>div ul.active li:nth-child(11),
#index .menu.sec .tab_inner>div ul.active li:nth-child(12) {
	transition-delay: 0.5s;
}
#index .menu.sec .tab_inner>div ul li a {
  display: block;
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 0 7px rgba(0, 0, 0, 0.1);
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 13px;
  height: 90px;
  line-height: 1.5em;
  letter-spacing: 0.2em;
  text-align: center;
  padding: 0 10px;
  box-sizing: border-box;
}
#index.pc_view .menu.sec .tab_inner>div ul li a:hover {
  opacity: 1;
  background: #6cafd0;
  color: #fff;
}

/*============================
#tips
============================*/

#index .tips.sec {
  padding: 120px 0 50px 0;
  position: relative;
  z-index: -1;
}
#index .tips.sec::after {
	content: "";
	width: 100%;
	height: 800px;
	background: #fff;
	background-size: cover;
	display: block;
	position: absolute;
	right: 0;
	top: 40px;
	transition: width ease 2s;
}
#index .tips.sec.active::after {
	width: 0%;
}
#index .tips.sec::before {
  content: "";
  width: 2075px;
  height: 800px;
  background: url(./images/index/img_tips.jpg?v=1) no-repeat center center;
  background-size: cover;
  display: block;
  position: absolute;
  left: 50%;
  top: 40px;
  margin-left: -2010px;
  border-radius: 0 180px 0 0;
}
#index .tips.sec>.inner {
  width: 1000px;
  box-sizing: border-box;
  margin: 0 auto;
  padding: 10px 0 0 500px;
  position: relative;
  z-index: 100;
}
#index .tips.sec p.text {
  color: #000;
  margin-top: 38px;
  letter-spacing: 0.1em;
  line-height: 1.7em;
	top: 20px;
	position: relative;
	opacity: 0;
	transition: ease all 1s +0.6s;
}
#index .tips.sec.active p.text {
	opacity: 1;
	top: 0;
}

/*============================
#clinicinfo
============================*/

#index .clinicinfo.sec {
  padding: 100px 0 100px 0;
}
#index .clinicinfo.sec>.inner {
  width: 1000px;
  margin: 0 auto;
}
#index .clinicinfo.sec .fbox {
  display: flex;
  justify-content: space-between;
  margin-top: 80px;
}
#index .clinicinfo.sec .fbox .box {
  width: 47%;
  transition: all 1s ease;
  position: relative;
	top: 20px;
	opacity: 0;
}
#index .clinicinfo.sec .fbox.active .box {
	top: 0;
	opacity: 1;
}
#index .clinicinfo.sec .fbox .box:nth-child(2) {
	transition-delay: 0.2s;
}
#index .clinicinfo.sec .fbox .box a {
  display: block;
  position: relative;
}
#index .clinicinfo.sec .fbox .box a .img {
  border-radius: 12px;
  overflow: hidden;
}
#index .clinicinfo.sec .fbox .box a .img img {}
#index .clinicinfo.sec .fbox .box a p.title {
  font-size: 20px;
  letter-spacing: 0.2em;
  margin-top: 40px;
}
#index .clinicinfo.sec .fbox .box a p.title span.f_en {
  font-size: 30px;
  display: block;
  color: #6cafd0;
}
#index .clinicinfo.sec .fbox .box a p.bt_more {
  position: absolute;
  right: 18px;
  bottom: 0;
  width: 78px;
  line-height: 78px;
  font-size: 13px;
  opacity: 1;
}

/*============================
#subtopics
============================*/

#index .subtopics.sec {
  padding: 100px 0 100px 0;
  background: #fff;
  transition: background ease 1s;
}
#index .subtopics.sec.active {
  background: #eeeeee;
}
#index .subtopics.sec>.inner {
  width: 1000px;
  margin: 0 auto;
  position: relative;
}
.appendixlist {
  display: flex;
  flex-wrap: wrap;
}
#index .appendixlist {
  margin-top: 70px;
}
.appendixlist .box {
  margin: 50px 0 0 50px;
}
.appendixlist .box:nth-child(-n+3) {
	margin-top: 0;
}
.appendixlist .box:nth-child(3n-2) {
	margin-left: 0;
}
.appendixlist .box a {
  width: 300px;
  display: block;
  margin: 0 auto;
  padding-bottom: 0;
}
.appendixlist .box a .info {}
.appendixlist .box a .info .img {
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 0 7px rgba(0, 0, 0, 0.1);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
  padding-top: 76%;
}
.appendixlist .box a .info .img img {}
.appendixlist .box a .info p.title {
  font-size: 18px;
  margin-top: 13px;
  line-height: 1.5em;
}
.appendixlist .box a .info .fbox {
  font-size: 11px;
  display: flex;
  color: #4b9fd4;
  margin-top: 8px;
}
.appendixlist .box a .info p.text {
  font-size: 13px;
  padding: 0 20px;
  line-height: 1.8em;
  margin: 20px 0 0 0;
  height: 3.6em;
  overflow: hidden;
}
/* ===========================================================================================

  Inner

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

#inner .content > .inner {
	width: 100%;
	margin: 0 auto;
	padding: 60px 0 120px 0;
	max-width: 1000px;
}

#inner.about .visual,
#inner.archive.menu .visual,
#inner.archive.tips .visual {
	background: url(images/about/img_visual.jpg?v=2) no-repeat right top;
	position: relative;
	height: 400px;
	box-sizing: border-box;
	border-radius: 0 0 0 0;
	padding-top: 10px;
	width: auto;
	transition: 3s ease all +0.5s;
}
#inner.about .visual.show,
#inner.archive.menu .visual.show,
#inner.archive.tips .visual.show {
	border-radius: 0 0 0 120px;
}
#inner.archive.menu .visual {
	background-image: url(images/menu/img_visual.jpg?v=1);
	background-position: center center;
}
#inner.archive.tips .visual {
	background-image: url(images/img_tips_visual.jpg?v=1);
}
#inner.about .visual {
	background-size: auto 100%;
	background-position: right -20px top 0;
}
#inner.about .visual.show {
	background-position: right 0px top 0;
}
#inner.archive.menu  .visual {
	background-size: calc(100% + 40px) auto;
	background-position: left calc(50% + 0px) top 50%;
}
@media screen and (max-width: 1200px) {
	#inner.archive.menu  .visual {
		background-size: 1240px auto;
	}
}
#inner.archive.menu  .visual.show {
	background-position: left calc(50% + 20px) top 50%;
}
#inner.archive.tips .visual {
	background-size: auto 100%;
	background-position: right 0px top 0;
}
#inner.archive.tips .visual.show {
	background-position: right -20px top 0;
}
#inner.about .visual::before,
#inner.archive.menu .visual::before,
#inner.archive.tips .visual::before {
	content: "";
	position: absolute;
	display: block;
	right: 0;
	width: 100%;
	height: 100%;
	background: #fff;
	top: 0;
	transition: width ease 1s +0.5s;
}
#inner.about .visual.show::before,
#inner.archive.menu .visual.show::before,
#inner.archive.tips .visual.show::before {
	width: 0%;
}
#inner.archive.tips .visual .tag {
	margin: 45px 0 0 7%;
	font-size: 20px;
	color: #000;
	line-height: 1.5em;
	letter-spacing: 0.2em;
	position: relative;
	left: 20px;
	transition: all ease 1s +0.9s;
	opacity: 0;
}
#inner.archive.tips .visual.show .tag {
	opacity: 1;
	left: 0;
}
#inner.archive.tips .visual .tag::before {
	content: "＃";
}

#inner.privacypolicy .visual,
#inner.contact .visual {
	width: 1000px;
	margin: 110px auto 0 auto;
}

/**********************************************************/
/* Archive Menu */
/**********************************************************/
#inner.archive,
#inner.faq,
#inner.search {	
	background: #ebebeb;
}
#inner.archive .visual,
#inner.faq .visual,
#inner.search .visual {
	background: no-repeat;
	width: 1000px;
	margin: 0 auto;
	height: auto;
	padding: 120px 0 20px 0;
}
/*** Menu submenu ***/
#inner .submenu {
	margin: -96px auto 80px auto;
	position: relative;
	z-index: 100;
}
#inner .submenu .tab {
  display: flex;
  justify-content: space-between;
  margin-top: 0;
}
#inner .submenu .tab a {
  display: block;
  width: 47%;
  box-shadow: 0 0 15px rgba(0, 0, 0, 0.1);
  border-radius: 12px;
  padding: 10px 0;
  display: flex;
  justify-content: center;
  position: relative;
  background: url(./images/index/icon_menu1.png) no-repeat 15px center;
  background-size: 55px auto;
  background-color: #fff;
}
#inner .submenu .tab a.bt_problem {
  background-image: url(./images/index/icon_menu2.png);
}
#inner .submenu .tab a.active,
#inner .submenu .tab a:hover {
  opacity: 1;
  background-color: #6cafd0;
  color: #fff;
  background-image: url(./images/index/icon_menu1_w.png);
}
#inner .submenu .tab a.bt_problem.active,
#inner .submenu .tab a.bt_problem:hover {
  background-image: url(./images/index/icon_menu2_w.png);
}
#inner .submenu .tab a>span {
  display: block;
  font-size: 15px;
  letter-spacing: 0.2em;
  padding: 10px 20px 10px 20px;
  line-height: 1em;
}
#inner .submenu .tab a span span.f_en {
  font-size: 11px;
  color: #6cafd0;
  display: block;
  line-height: 1em;
  letter-spacing: 0.2em;
  margin-top: 6px;
	transition: 0.3s ease color;
}
#inner .submenu .tab a.active span.f_en,
#inner .submenu .tab a:hover span.f_en {
  color: #fff;
}
#inner .submenu ul {
  display: flex;
  justify-content: left;
  flex-wrap: wrap;
  margin-top: 16px;
  gap: 5.6px;
}
#inner .submenu ul li {
  width: 16.2%;
  margin-top: 0;
}
#inner .submenu ul li a {
  display: block;
  background: #fff;
  border-radius: 8px;
  box-shadow: 0 0 7px rgba(0, 0, 0, 0.1);
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 12px;
  height: 44px;
  line-height: 1.2em;
  letter-spacing: 0.1em;
  text-align: center;
  padding: 0 10px;
  box-sizing: border-box;
}
#inner .submenu ul li a.active,
#inner .submenu ul li a:hover {
  opacity: 1;
  background: #6cafd0;
  color: #fff;
}

/*** Menu submenu ***/
#inner .submenu_fixed {
	position: fixed;
	top: 15px;
	z-index: 1000;
	left: 0;
	width: 100%;
	height: 0;
	transition: 0.3s ease top;
}
#inner .submenu_fixed.show {
	top: 105px;
}
#inner .submenu_fixed > .inner {
  display: flex;
  justify-content: space-between;
  margin: 0 auto;
  width: 945px;
  align-items: start;
}
#inner .submenu_fixed .box {
  display: block;
  width: 48.5%;
  box-shadow: 0 0 15px rgba(0, 0, 0, 0.1);
  background-color: #fff;
  border-radius: 8px;
	transition: 0.3s ease background;
}
#inner .submenu_fixed .box > a {
  padding: 16px 0;
  display: flex;
  justify-content: center;
  position: relative;
  background: url(./images/index/icon_menu1.png) no-repeat 20px center;
  background-size: 40px auto;
  font-size: 13px;
  letter-spacing: 0.1em;
}
#inner .submenu_fixed .box > a.bt_problem {
  background-image: url(./images/index/icon_menu2.png);
}
#inner .submenu_fixed .box.active {
  opacity: 1;
  background-color: #6cafd0;
}
#inner .submenu_fixed .box.active > a {
  color: #fff;
  background-image: url(./images/index/icon_menu1_w.png);
}
#inner .submenu_fixed .box.active > a.bt_problem {
  background-image: url(./images/index/icon_menu2_w.png);
}
#inner .submenu_fixed .box.active ul li a {
	color: #fff;
  background: linear-gradient(#fff, #fff) 0 90%/0 1px no-repeat;
  text-decoration: none;
}
#inner .submenu_fixed .box.active ul li a:hover {
  background-size: 100% 1px !important;
	opacity: 1;
}
#inner .submenu_fixed .box > a::before {
	top: 50%;
	right: 24px;
	border: solid transparent;
	content: "";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
	border-color: rgba(80, 80, 80, 0);
	border-top-color: #505050;
	border-width: 8px;
	margin-left: -8px;
	margin-top: -3px;
	transition: 0.3s ease all;
}
#inner .submenu_fixed .box.active > a::before {
	border-top-color: #fff;
}
#inner .submenu_fixed .list {
	display: none;
}
#inner .submenu_fixed ul {
	display: flex;
	flex-wrap: wrap;
	padding: 20px 30px 30px 30px;
	justify-content: space-between;
}
#inner .submenu_fixed ul li {width: 48%;}
#inner .submenu_fixed ul li a {font-size: 13px;line-height: 1.5em;padding: 8px 0;display: inline-block;}

#inner.archive.tips .content {
	
}
#inner.archive.menu .content {
}
#inner.archive.menu .content .menulist {
	
}
#inner.archive.menu .content .menulist .box {padding-top: 120px;margin-top: -120px;}
#inner.archive.menu .content .menulist .box + .box {
	margin-top: -70px;
}
#inner.archive.menu .content .menulist .box .b_main {
	background: none !important;
	width: calc(100% - 330px);
}
#inner.archive.menu .content .menulist .box > .inner {
	display: flex;
	justify-content: space-between;
	background: #fff;
	border-radius: 20px;
	padding: 80px 50px;
}
#inner.archive.menu .content .menulist .box .linkbox {
	display: flex;
	margin-top: 50px;
}
#inner.archive.menu .content .menulist .box .linkbox > div {
	width: 50%;
}
#inner.archive.menu .content .menulist .box .linkbox a {
	display: flex;
	justify-content: center;
	background: #5f666c;
	position: relative;
}
#inner.archive.menu .content .menulist .box .linkbox a::before {
	content: "";
	width: 8px;
	height: 8px;
	border-top: 1px solid #fff;
	border-right: 1px solid #fff;
	transform: translate(-50%, -50%) rotate(45deg);
	top: 50%;
	right: 20px;
	position: absolute;
}
#inner.archive.menu .content .menulist .box .linkbox .line a {
	background: #797f80;
}
#inner.archive.menu .content .menulist .box .linkbox .title {
	color: #fff;
	font-size: 11px;
	line-height: 1em;
	letter-spacing: 0.2em;
	padding: 28px 20px 28px 70px;
	background: url(images/icon_reservation.png) no-repeat left center;
	background-size: 60px;
}
#inner.archive.menu .content .menulist .box .linkbox .line .title {
	background-image: url(images/icon_line.png);
}
#inner.archive.menu .content .menulist .box .linkbox .title span {display: block;font-size: 13px;margin-bottom: 8px;}

#inner.archive.news .content,
#inner.faq .content {margin-top: -138px;}
#inner.archive.news .content > .inner,
#inner.faq .content > .inner {padding-left: 270px;box-sizing: border-box;padding-bottom: 200px;}


/**********************************************************/
/* Contact */
/**********************************************************/
#inner.contact {
	background: #e6e6e6;	
}
#inner.contact .content form {
	position: relative;
	z-index: 100;
	font-size: 13px;
}

/**********************************************************/
/* Pivacy Policy */
/**********************************************************/
#inner.privacypolicy {
	background: #e6e6e6;	
}
#inner.privacypolicy .content p {
	font-size: 13px;
	line-height: 2.2em;
	margin-top: 20px;
	letter-spacing: 0;
}



/**********************************************************/
/* About */
/**********************************************************/
#inner.about {
	
}
#inner.about .intro {
	padding: 100px 0;
}
#inner.about .intro > .inner {
	width: 1000px;
	margin: 0 auto;
	position: relative;
}
#inner.about .intro .before,
#inner.about .intro .after {
  content: "";
  display: block;
  position: absolute;
  width: 800px;
  height: 800px;
  border-radius: 1000px 0 1000px 1000px;
  background: rgb(193, 217, 225);
  background: -moz-linear-gradient(left, rgba(193, 217, 225, 1) 0%, rgba(230, 230, 230, 1) 100%, rgba(230, 230, 230, 1) 100%);
  background: -webkit-linear-gradient(left, rgba(193, 217, 225, 1) 0%, rgba(230, 230, 230, 1) 100%, rgba(230, 230, 230, 1) 100%);
  background: linear-gradient(to right, rgba(193, 217, 225, 1) 0%, rgba(230, 230, 230, 1) 100%, rgba(230, 230, 230, 1) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#c1d9e1', endColorstr='#e6e6e6', GradientType=1);
  right: -310px;
  top: 574px;
  mix-blend-mode: multiply;
  opacity: 1;
  z-index: -1;
  opacity: 1;
	transition: margin 2s cubic-bezier(0, 0, 0.16, 0.99), opacity ease 2s;
	opacity: 0;
}
#inner.about .intro .before.active,
#inner.about .intro .after.active {
	opacity: 1;	
}
#inner.about .intro .after {
  transform: rotate(180deg);
  top: 1240px;
  opacity: 0.3;
  right: auto;
  left: -320px;
}
#inner.about .intro > .inner > .text {
	text-align: center;
	font-size: 15px;
	margin-top: 35px;
	letter-spacing: 0.1em;
	line-height: 1.8em;
	opacity: 0;
	transition: all ease 1s +0.6s;
	top: 20px;
	position: relative;
}
#inner.about .intro.active > .inner > .text {
	opacity: 1;
	top: 0;
}
#inner.about .intro .about {
	margin-top: 75px;
}
#inner.about .intro .about .box {
  display: flex;
  align-items: start;
  justify-content: space-between;
	opacity: 0;
	transition: all ease 1s;
	top: 20px;
	position: relative;
}
#inner.about .intro .about .box.active {
	opacity: 1;
	top: 0;
}
#inner.about .intro .about .box + .box {
	margin-top: 74px;
}
#inner.about .intro .about .box .info {
	width: 460px;
	padding-top: 25px;
	position: relative;
}
#inner.about .intro .about .box .info::before {
	background: #505050;
	content: "";
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: 0%;
	height: 1px;
	transition: all ease 1s;
}
#inner.about .intro .about .box.active .info::before {
	width: 100%;
}
#inner.about .intro .about .box .info .header {
	display: flex;
	align-items: center;
}
#inner.about .intro .about .box .info .header img {
  width: 120px;
  margin-right: 10px;
}
#inner.about .intro .about .box .info .header p.title {
  font-size: 20px;
  letter-spacing: 0.1em;
}
#inner.about .intro .about .box .info p.text {
  text-align: justify;
  font-size: 13px;
  margin-top: 20px;
	line-height: 1.8em;
}
#inner.about .intro .about .box .img {
	width: 430px;
	border-radius: 20px;
	opacity: 0;
	transition: all ease 1s +0.4s;
	position: relative;
}
#inner.about .intro .about .box.active .img {
	opacity: 1;
}
#inner.about .message {
	background: #e6e6e6;
	padding: 110px 0;
}
#inner.about .message > .inner {
	width: 1000px;
	margin: 0 auto;
	position: relative;
}
#inner.about .message .text {
	font-size: 13px;
	letter-spacing: 0.05em;
	margin-top: 35px;
	line-height: 1.8em;
  position: relative;
	top: 20px;
	opacity: 0;
	transition: all ease 1s +0.6s;
}
#inner.about .message.active .text {
	opacity: 1;
	top: 0;
}
#inner.about .message .img {
	border-radius: 20px;
	width: 490px;
	position: absolute;
	right: 0;
	top: 0;
	opacity: 0;
	transition: all ease 1s +0.4s;
}
#inner.about .message.active .img {
	opacity: 1;
}
#inner.about .facility {
	padding: 110px 0;
}
#inner.about .facility > .inner {
	width: 1000px;
	margin: 0 auto;
	position: relative;
}
#inner.about .facility .text {
	font-size: 13px;
	letter-spacing: 0.05em;
	margin-top: 35px;
	line-height: 1.8em;
	width: 470px;
  position: relative;
	top: 20px;
	opacity: 0;
	transition: all ease 1s +0.4s;
}
#inner.about .facility.active .text {
	opacity: 1;
	top: 0;
}
#inner.about .facility .img {
		display: flex;
		flex-wrap: wrap;
		margin-top: 70px;
		align-items: start;
		margin-bottom: -100px;
}
#inner.about .facility .img img {
}

/**********************************************************/
/* Single */
/**********************************************************/
/*** /Cat Colors ***/

/**********************************************************/
/* 404 */
/**********************************************************/

/**************************************************************/
/**************************************************************/
/** SP ********************************************************/
/**************************************************************/
/**************************************************************/
@media screen and (max-width: 767px) {
	
	/* style
	-------------------------------------------------------------- */
	body {
		min-width: 320px;
		overflow: visible !important;
		letter-spacing: 0;
	}

	body p {
		color: inherit;
		font-size: 14px;
		line-height: 1.8em;
	}
	a:hover {
		opacity: 1;
	}
	.non_pc {
		display: block !important;
	}
	.non_sp {
		display: none !important;
	}

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

		Common

	=========================================================================================== */
	.main {
		width: auto;
		margin: 0 auto;
		position: relative;
		padding-top: 70px;
	}
	
	
	/* Header *******************************/
	header {
	  top: 0;
	  position: fixed;
	  width: 100%;
	  height: 70px;
	  z-index: 10000;
	  min-width: 0;
	  left: 50%;
	  transform: translate(-50%, 0);
	  background: #fff;
	}
	header > .inner {
		height: 100%;
		padding: 0 10px 0 0px;
		display: flex;
		justify-content: space-between;
		align-items: center;
	}
	header .bg {
		position: absolute;
		top: -100px;
		left: 50%;
		height: 100px;	
		background: #fff;
		width: 100%;
		min-width: 960px;
		transform: translate(-50%, 0);
	    transition: top 0.3s ease;
	    z-index: 20;
	}
	header.show .bg,
	#inner header .bg {
		top: 0;
	}
	header.open .bg,
	#inner header.open .bg {
		top: -100px;
	}
	
	header h1 {
	z-index: 1000;
	}
	header h1 a {
	  display: block;
	  width: 26px;
	  padding: 8px;
	}
	header .link {
		display: flex;
		align-items: center;
		position: relative;
		z-index: 1000;
	}
	header .link a {
	    display: flex;
	    padding: 7px 5px;
	    justify-content: center;
	    flex-direction: column;
	    align-items: center;
	    width: auto;
	    box-sizing: border-box;
	    background-position: center 7px;
	    transition: background-image 0.6s ease;
	    background: no-repeat;
	}
	header.open .link a {
		color: #fff;
		background: url(https://beclinic.jp/wp/wp-content/themes/beclinic.jp/images/icon_line2_w.png) no-repeat center 7px;
		background-size: 35px auto;
	}
	header.open .link a.bt_reservation {
		background-image: url(https://beclinic.jp/wp/wp-content/themes/beclinic.jp/images/icon_reservation2_w.png);
	}
	header.open .link a.bt_map {
		background-image: url(./images/icon_map2_w.png);
	}
	header .link a img {
		width: 35px;
	}
	header.open .link a img {
		opacity: 0;
	}
	header .link a:hover {
	    opacity: 1;
	}
	header .link a span {
		font-size: 9px;
		margin-top: 2px;
		line-height: 1em;
		display: none;
	}
	header .link .search {
		display: none;
	}
	header .search input[type=search] {
	    border: none;
	    border-radius: 0;
	    padding: 6px 12px;
	    font-size: 16px;
	    box-sizing: border-box;
	    display: block;
	    width: 245px;
	    line-height: 24px;
	    /* border: 1px solid #505050; */
	    border-radius: 5px 0 0 5px;
	}
	header .search input[type=search]::-webkit-input-placeholder {
	    font-family: 'Montserrat', sans-serif;
	    color: #323232;
	    font-weight: 500;
	    letter-spacing: 0.1em;
	    font-size: 12px;
	}
	header .search input[type=search]:-ms-input-placeholder {
	    font-family: 'Montserrat', sans-serif;
	    color: #323232;
	    font-weight: 500;
	    letter-spacing: 0.1em;
	    font-size: 12px;
	}
	header .search input[type=search]::placeholder {
	    font-family: 'Montserrat', sans-serif;
	    color: #323232;
	    font-weight: 500;
	    letter-spacing: 0.1em;
	    font-size: 12px;
	}
	header .search input[type=submit] {
		/* display: none; */
		background-color: #227d9b;
	}
	header .bt_menu {
		position: relative;
		display: block;
		width: 70px;
		height: 70px;
		margin: 0;
		font-size: 12px;
		text-align: center;
		box-sizing: border-box;
		padding-top: 0;
		z-index: 1000;
		text-indent: -9999px;
		overflow: hidden;
		/* pointer-events: none; */
	}
	header .bt_menu::before,
	header .bt_menu::after {
		display: block;
		position: absolute;
		content: "";
		width: 24px;
		height: 1px;
		background: #000;
		top: 29px;
		left: 22px;
		transition: all 0.3s ease;
	}
	header .bt_menu::after {
	    top: 40px;
	}
	header.open .bt_menu::before {
		background: #fff;
		transform: rotate(135deg);
		left: 22px;
		top: 50px;
	}
	header.open .bt_menu::after {
		background: #fff;
		transform: rotate(-135deg);
		left: 22px;
		top: 50px;
	}
	header .bt_menu span {
	    transition: color 0.3s ease;
	}
	header.open .bt_menu span {
		display: block;
		color: #716f70;
		position: relative;
	}
	header .bt_menu span::before {
	    color: #fff;
	    content: "CLOSE";
	    display: block;
	    position: absolute;
	    left: 0;
	    width: 100%;
	    transition: opacity 0.3s ease;
	    opacity: 0;
	}
	header.open .bt_menu span::before {
		opacity: 1;
	}
	header.open .bt_menu::before {
		background: #fff;
		transform: rotate(135deg);
		left: 22px;
		top: 35px;
	}
	header.open .bt_menu::after {
		background: #fff;
		transform: rotate(-135deg);
		left: 22px;
		top: 35px;
	}
	header .bt_menu span {
	    transition: color 0.3s ease;
	    display: none;
	}
	header.open .bt_menu span {
		display: none;
		color: #716f70;
		position: relative;
	}
	header .bt_menu span::before {
	    color: #fff;
	    content: "CLOSE";
	    display: block;
	    position: absolute;
	    left: 0;
	    width: 100%;
	    transition: opacity 0.3s ease;
	    opacity: 0;
	    display: none;
	}
	header.open .bt_menu span::before {
		opacity: 1;
	}
	header .gmenu {
		display: none;
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: auto;
		z-index: 999;
		background: #68bad3;
		padding-bottom: 0;
	}
	header .gmenu::before {
		content: "";
		width: 140%;
		border-radius: 100%;
		position: absolute;
		left: 50%;
		bottom: 116px;
		background: #68bad3;
		height: 340px;
		transform: translate(-50%, 50%);
		top: auto;
	}
	header .gmenu nav {
		display: block;
		padding: 85px 0 20px 20px;
		margin: 0 auto;
		width: 300px;
		position: relative;
		z-index: 100;
	}
	header .gmenu ul {display: flex;flex-direction: column;align-items: normal;}
	header .gmenu ul li + li {margin-top: 3px;}
	header .gmenu ul li a {
		color: #fff;
		font-size: 11px;
		display: flex;
		align-items: center;
		letter-spacing: 0.1em;
	}
	
	header .gmenu ul li a span {
		font-size: 18px;
		display: block;
		width: 180px;
		letter-spacing: 0.2em;
	}
	header .gmenu ul li a span + span {
		letter-spacing: 0.1em;
		font-size: 11px;
		width: 130px;
	}
	header .gmenu .link {
		display: flex !important;
		justify-content: center;
	}
	header .gmenu .link a img {
		width: 50px;
	}
	header.open .gmenu .link a {
		background: none;
	}
	header.open .gmenu .link a img {
		opacity: 1;
	}
	header .gmenu .search {
		display: flex;
		justify-content: center;
		margin: 0 0 10px 0;
		position: relative;
	}
	header .gmenu .search input[type=text] {
		width: 280px;
		font-size: 16px;
		line-height: 28px;
	}
	
	/* Footer *******************************/
	footer {
		position: relative;
		z-index: 100;
	}
	footer .linkbox {
		display: block;
	}
	footer .linkbox .box {
		background: #797f80;
		width: auto;
		height: auto;
		color: #fff;
		box-sizing: border-box;
		padding: 20px 0 34px 0;
	}
	footer .linkbox .box.contact {
		background: #5f666c;
	}
	footer .linkbox .box .title {
		font-size: 12px;
		letter-spacing: 0.2em;
		padding: 10px 0 0 20px;
		width: 235px;
		margin: 0px auto;
	}
	footer .linkbox .box.contact .title {
		width: 200px;
		margin: 0px auto;
	}
	footer .linkbox .box.line .title {
		padding: 10px 0 0 0px;
		width: 250px;
	}
	footer .linkbox .box .title img {
		width: 60px;
		float: left;
		margin-right: 20px;
	}
	footer .linkbox .box .title span {display: block;line-height: 1.5em;font-size: 16px;margin-top: 6px;}
	footer .linkbox .box .fbox {min-width: 260px;display: flex;width: 82%;margin: 20px auto 0 auto;}
	footer .linkbox .box .fbox a {color: #fff;width: 100%;text-align: center;font-size: 11px;letter-spacing: 0.2em;text-indent: 0.2em;border: 1px solid #fff;padding: 7px 0;position: relative;}
	footer .linkbox .box .fbox a::before {
		content: "";
		position: absolute;
		right: 16px;
		top: 50%;
		width: 6px;
		height: 6px;
		border-top: 1px solid #fff;
		border-right: 1px solid #fff;
		transform: rotate(45deg) translate(0, -50%);
	}
	footer .linkbox .box .fbox a + a {
		border-left: none;
	}
	footer > .inner {
		width: 84%;
		margin: 0 auto;
		color: #fff;
		padding: 44px 0 25px 0;
	}
	footer > .inner .logo {display: block;width: 115px;margin: 0 auto;}
	footer > .inner.active .logo span {
		text-align: center;
		font-size: 10px;
		display: block;
		color: #fff;
		margin-top: 3px;
	}
	footer > .inner .fbox {
		display: block;
		justify-content: space-between;
		margin-top: 42px;
	}
	footer > .inner .fbox .box {
		width: auto;
		box-sizing: border-box;
		border-right: 1px solid #fff;
		border-left: 1px solid #fff;
		padding: 6px 24px;
		position: relative;
	}
	footer > .inner .fbox .box +.box {
		margin-top: 20px
	}
	footer > .inner .fbox .box .title {
		font-size: 13px;
		letter-spacing: 0.2em;
	}
	footer > .inner .fbox .box .text {
		font-size: 11px;
		letter-spacing: 0.2em;
		line-height: 1.6em;
	}
	footer > .inner .fbox .box.time {
		border-left: 1px solid #fff;
	}
	footer > .inner .fbox .box.time img {
		margin: 20px 0 15px 0;
	}
	footer > .inner .fbox .box.access .text {
		margin-top: 10px;
	}
	footer > .inner .fbox .box.access .bt_map {
		border-color: #fff;
		position: absolute;
		right: 30px;
		top: 33px;
		padding: 4px;
		width: 50px;
		line-height: 50px;
		font-size: 10px;
	}
	footer > .inner .fbox .box.access .bt_map::before {
		background: #fff;
		width: 12px;
		right: -12px;
	}
	footer > .inner .fbox .box.access .bt_map span {
		position: absolute;
		bottom: -17px;
		width: 120px;
		color: #fff;
		left: 50%;
		transform: translate(-50%, 0);
		line-height: 1em;
		letter-spacing: 0.1em;
	}
	footer > .inner .bnr {
		display: block;
		flex-wrap: wrap;
		margin-top: 36px;
	}
	footer > .inner .bnr a {
		width: auto;
		margin: 20px 0 0 0;
	}
	footer > .inner .bnr a:nth-child(-n+3) {
		margin-top: 20px;
	}
	footer > .inner .bnr a:nth-child(1) {
		margin-top: 0;
	}
	footer > .inner .link {margin-top: 30px;}
	footer > .inner .link a {font-size: 12px;color: #fff;margin-right: 20px;display: inline-block;}
	footer .copyright {
	    background: #fff;
	    border-top: 15px solid #bdd5dd;
	}
	footer .copyright p {
	    font-size: 10px;
	    padding: 16px 0;
	    width: 84%;
	    margin: 0 auto;
	}
	
	.bt_more {
		display: block;
		width: 70px;
		line-height: 70px;
		text-align: center;
		border: 1px solid #6cafd0;
		border-radius: 100px;
		position: relative;
		box-sizing: border-box;
		font-size: 13px;
		color: #6cafd0;
		letter-spacing: 0.1em;
		text-indent: 0.1em;
	}
	.bt_more::before {
		height: 1px;
		content: "";
		display: block;
		position: absolute;
		width: 18px;
		background: #6cafd0;
		top: 50%;
		right: -18px;
	}


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

		Index

	=========================================================================================== */
	#index .sec {}
	#index {}
	#index .visual {
		position: relative;
	}
	#index .visual>.inner {
		width: auto;
		margin: 0 auto;
		position: relative;
		height: auto;
		box-sizing: border-box;
		padding: 150px 0 200px 0;
	}
	#index .visual .bg {
		position: absolute;
		left: 0;
		top: 0;
		width: 100%;
		height: 100%;
	}
	#index .visual.show .bg {
	  border-radius: 0 0 0 80px;
	}
	#index .visual .bg .slide {
		height: 100%;
		width: 100%;
	}
	#index .visual .bg .slide .img div {
		left: 4%;
		transform: scale(1.1)
	}
	#index .visual .bg .slide.slick-active .img div {
		left: -4%;
	}
	#index .visual .bg .slide1 .img div {
	  background-image: url(./images/index/img_visual_sp.jpg);
	  background-size: cover;
	}
	#index .visual .bg .slide2 .img div {
	  background-image: url(./images/index/img_visual2_sp.jpg);
	}
	#index .visual .bg .slide3 .img div {
	  background-image: url(./images/index/img_visual3_sp.jpg);
	}
	#index .visual .bg .slide3 img {
		position: absolute;
		width: 330px;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
		margin-top: -20px;
	}
	#index .visual img.logo {
		width: 345px;
		margin-top: 90px;
		display: none;
	}
	.slick-dots {
		bottom: 30px;
		z-index: 200;
		left: 50%;
		width: auto;
		margin-left: -458px;
		display: flex;
	}
	.slick-dots li {
		width: auto;
		height: 11px;
		margin: 0 2px;
		display: flex;
		align-items: center;
	}

	/*============================
	#about
	============================*/

	#index .about.sec {
		padding: 120px 0 50px 0;
		position: relative;
	}
	#index .about.sec .before,
	#index .about.sec .after {
		width: 410px;
		height: 410px;
		top: -70px;
		right: -170px;
	}
	#index .about.sec .after {
		transform: rotate(180deg);
		top: 883px;
		width: 440px;
		height: 440px;
		left: -190px;
		right: auto;
	}
	#index .about.sec>.inner {
		width: 90%;
		margin: 0 auto;
		position: relative;
		z-index: 100;
	}
	#index .about.sec p.text {
		text-align: center;
		font-size: 13px;
		margin-top: 35px;
		line-height: 2em;
		letter-spacing: 0.1em;
	}
	#index .about.sec .fbox {
		display: block;
		margin: 60px auto 0 auto;
		width: 92%;
	}
	#index .about.sec .fbox .box {
		width: auto;
		/* border-top: 1px solid #505050; */
		padding: 42px 0 40px 0;
		position: relative;
	}
	#index .about.sec .fbox .box img {
		position: absolute;
		width: 72px;
		margin: 0;
		right: -14px;
		top: 30px;
	}
	#index .about.sec .fbox .box p.title {
		text-align: left;
		font-size: 15px;
		margin-top: -2px;
		letter-spacing: 0.05em;
		padding-left: 50px;
	}
	#index .about.sec .fbox .box p.text {
		text-align: justify;
		font-size: 12px;
		/* padding: 0 10px; */
		margin-top: 25px;
		line-height: 1.8em;
	}
	#index .about.sec a.bt_more.f_en {
		margin: -10px auto 0 auto;
	}
	
	/*============================
	#faq
	============================*/
	.faqlist {
		width: auto;
	}
	.faqlist li+li {
		margin-top: 15px;
		border-radius: 8px;
	}
	.faqlist li > a {
		position: relative;
		background: #fff;
		display: block;
		display: flex;
		align-items: center;
		font-size: 12px;
		padding: 18px 50px 18px 20px;
		flex-wrap: wrap;
	}
	.faqlist li > a::after {
		display: none;
	}
	.faqlist li > a::before {
		height: 37px;
		right: 20px;
		top: auto;
		bottom: 0;
	}
	.faqlist li > a p {
		line-height: 1.8em;
		font-size: 13px;
	}
	.faqlist li > a p.title {
		width: 100%;
	}
	.faqlist li .body {
			padding: 20px;
	}
	.faqlist li .body p {
			font-size: 13px;
	}
	

	/*============================
	#news
	============================*/

	#index .news.sec {
		background: rgba(221, 221, 221, 0.5);
		padding: 50px 0 40px 0;
		position: relative;
	}
	#index .news.sec>.inner {
		width: 84%;
		margin: 0 auto;
		display: block;
	}

	/*============================
	#topic
	============================*/

	#index .topic.sec {
		padding: 50px 0;
		background: #bdd5dd;
		position: relative;
		z-index: 100;
	}
	#index .topic.sec>.inner {
		width: 84%;
		margin: 0 auto;
		position: relative;
		overflow: visible;
	}
	.topicslist,
	#index .topic.sec .topicslist {
		overflow: visible;
		width: auto;
		position: relative;
		left: auto;
		margin-top: 30px;
		display: block;
	}
	.topicslist .box {
		margin: 0;		
	}
	.topicslist .box + .box {
	  margin-top: 30px;
	}
	#index .topicslist .box {
		display: none;
	}
	#index .topicslist .box:nth-child(-n+3) {
		display: block;
	}
	.topicslist .box a {
		width: 300px;
		display: block;
		background: #fff;
		border-radius: 8px;
		box-shadow: 0 0 7px rgba(0, 0, 0, 0.1);
		margin: 0 auto;
		padding-bottom: 20px;
	}
	.topicslist .box a .info {}
	.topicslist .box a .info .img {
		border-radius: 8px 8px 0 0;
		overflow: hidden;
	}
	.topicslist .box a .info .img img {}
	.topicslist .box a .info p.title {
		font-size: 16px;
		padding: 0 20px;
		margin-top: 16px;
	}
	.topicslist .box a .info .fbox {
		font-size: 10px;
		display: flex;
		color: #4b9fd4;
		padding: 0 20px;
		margin-top: 9px;
	}
	.topicslist .box a .info p.text {
		font-size: 12px;
		padding: 0 20px;
		line-height: 1.8em;
		margin: 10px 0 0 0;
		max-height: 3.6em;
		overflow: hidden;
	}

	/*============================
	#tips
	============================*/


	/*============================
	#menu
	============================*/

	#index .menu.sec {
		padding: 50px 0 70px 0;
		position: relative;
	}
	#index .menu.sec .before, #index .menu.sec .after {
		width: 410px;
		height: 410px;
		top: 666px;
		left: 0;
	}
	#index .menu.sec .before {
		display: none;
	}
	#index .menu.sec .after {
		top: 70px;
		opacity: 0.5;
		left: -160px;
	}
	#index .menu.sec>.inner {
		width: 84%;
		margin: 0 auto;
		position: relative;
		z-index: 100;
	}
	#index .menu.sec .tab.non_pc {
		display: flex !important;
		justify-content: space-between;
		margin-top: 0;
	}
	#index .menu.sec .tab a {
		display: block;
		background: #fff;
		width: 47%;
		box-shadow: 0 0 15px rgba(0, 0, 0, 0.1);
		border-radius: 8px;
		padding: 18px 0 22px 0;
		display: flex;
		justify-content: center;
		pointer-events: auto;
		position: relative;
	}
	#index .menu.sec .tab a::before {
		content: "";
		position: absolute;
		display: block;
		width: 6px;
		height: 6px;
		border-radius: 10px;
		background: #6cafd0;
		bottom: 10px;
		left: 50%;
		transform: translate(-50%, 0);
	}
	#index .menu.sec .tab a.active::before {
		background: #fff;
	}
	#index .menu.sec .tab a::after {
		content: "";
		display: block;
		position: absolute;
		width: 1px;
		height: 42px;
		background: #6cafd0;
		left: 50%;
		bottom: -36px;
		margin-left: -1px;
		animation: a_border_sp 2s ease infinite;
		-webkit-animation: a_border_sp 2s ease infinite;
		opacity: 0;
	  transition: opacity 0.3s ease;
	}
	#index .menu.sec .tab a.active::after {
		opacity: 1;
	}
	
	@-moz-keyframes a_border_sp {
		0% { height: 0px; bottom: 36px;}
		50% { height: 42px; bottom: 36px;}
		50% { height: 42px; bottom: -33px;}
		100% { height: 0px; bottom: -33px;}
	}
	
	@-webkit-keyframes a_border_sp {
		0% { height: 0px; bottom: 6px;}
		50% { height: 42px; bottom: 6px;}
		50% { height: 42px; bottom: -33px;}
		100% { height: 0px; bottom: -33px;}
	}
	#index .menu.sec .tab a>span {
		display: block;
		font-size: 13px;
		letter-spacing: 0.05em;
		padding: 50px 0 0px 0;
		background: url(./images/index/icon_menu1.png) no-repeat center top;
		background-size: 50px auto;
		text-align: center;
	}
	#index .menu.sec .tab a span span.f_en {
		font-size: 10px;
		color: #6cafd0;
		display: block;
		line-height: 1.2em;
		letter-spacing: 0.2em;
		margin-top: 3px;
	}
	#index .menu.sec .tab a.bt_problem > span {
		background-image: url(./images/index/icon_menu2.png);
	}
	#index .menu.sec .tab a.active {
		background-color: #6cafd0;
	}
	#index .menu.sec .tab a.active > span {
		color: #fff;
		background-image: url(./images/index/icon_menu1_w.png);
	}
	#index .menu.sec .tab a.bt_problem.active > span {
		color: #fff;
		background-image: url(./images/index/icon_menu2_w.png);
	}
	#index .menu.sec .tab a.active > span span {
		color: #fff;
	}
	#index .menu.sec .tab_inner {
		display: block;
		margin-top: 45px;
		justify-content: space-between;
	}
	#index .menu.sec .tab_inner>div {
		width: auto;
		display: none;
	}
	#index .menu.sec .tab_inner >div.active {
		display: block;
	}
	#index .menu.sec .tab_inner>div ul {
		display: block;
		flex-wrap: wrap;
	}
	#index .menu.sec .tab_inner>div ul li {
		width: auto;
		margin-top: 0;
	}
	#index .menu.sec .tab_inner>div ul li + li {
		margin-top: 6px;
	}
	#index .menu.sec .tab_inner>div ul li a {
		display: block;
		background: #fff;
		border-radius: 6px;
		box-shadow: 0 0 7px rgba(0, 0, 0, 0.1);
		display: flex;
		justify-content: left;
		font-size: 14px;
		height: auto;
		line-height: 1.5em;
		letter-spacing: 0.2em;
		text-align: left;
		padding: 12px 25px;
	}
	/*============================
	#tips
	============================*/

	#index .tips.sec {
		padding: 40px 0 20px 0;
		position: relative;
		margin-top: -100px;
		padding-top: 140px;
	}
	#index .tips.sec::after {
		content: "";
		width: 100%;
		height: 370px;
		background: #fff;
		background-size: cover;
		display: block;
		position: absolute;
		right: 0;
		top: 100px;
		transition: width ease 1s;
	}
	#index .tips.sec.active::after {
		width: 0%;
	}
	#index .tips.sec::before {
		content: "";
		width: 100%;
		height: 370px;
		background: url(./images/index/img_tips_sp.jpg) no-repeat left 0 top 0 #e3f0f2;
		background-size: auto 100%;
		display: block;
		position: absolute;
		left: 0;
		top: 100px;
		margin-left: 0;
		border-radius: 0 105px 0 0;
	}
	#index .tips.sec>.inner {
		width: 84%;
		box-sizing: border-box;
		margin: 0 auto;
		padding: 10px 0 0 0px;
		position: relative;
	}
	#index .tips.sec p.text {
		color: #000;
		margin: 20px 0 0 140px;
		letter-spacing: 0.1em;
		line-height: 1.7em;
		font-size: 11px;
		min-height: 72px;
	}
	#index .tips.sec p.text br {
		display: none;
	}
	
	/*============================
	#clinicinfo
	============================*/

	#index .clinicinfo.sec {
		padding: 100px 0 50px 0;
		margin-top: -50px;
	}
	#index .clinicinfo.sec>.inner {
		width: 84%;
		margin: 0 auto;
	}
	#index .clinicinfo.sec .fbox {
		display: block;
		justify-content: space-between;
		margin-top: 20px;
	}
	#index .clinicinfo.sec .fbox .box {
		width: auto;
	}
	#index .clinicinfo.sec .fbox .box + .box {
		margin-top: 46px;
	}
	#index .clinicinfo.sec .fbox .box a {
		display: block;
		position: relative;
	}
	#index .clinicinfo.sec .fbox .box a .img {
		border-radius: 8px;
		overflow: hidden;
	}
	#index .clinicinfo.sec .fbox .box a .img img {
  margin: -15% 0;
}
	#index .clinicinfo.sec .fbox .box a p.title {
		font-size: 14px;
		letter-spacing: 0.2em;
		margin-top: 22px;
	}
	#index .clinicinfo.sec .fbox .box a p.title span.f_en {
		font-size: 20px;
		display: block;
		color: #6cafd0;
	}
	#index .clinicinfo.sec .fbox .box a p.bt_more {
		position: absolute;
		right: 18px;
		bottom: -8px;
		width: 66px;
		line-height: 66px;
		font-size: 11px;
		transition: 1s ease all;
	}

	/*============================
	#subtopics
	============================*/

	#index .subtopics.sec {
		padding: 50px 0 50px 0;
		background: #eeeeee;
	}
	#index .subtopics.sec>.inner {
		width: 84%;
		margin: 0 auto;
		position: relative;
	}
	.appendixlist {
		display: flex;
		justify-content: space-between;
		margin-top: 0;
		flex-wrap: wrap;
	}
	#index .subtopics.sec .appendixlist {
		overflow: visible;
		width: auto;
		position: relative;
		left: auto;
		margin-top: 30px;
		display: flex;
	}
	.appendixlist .box {
	  margin-top: 30px;
	  width: 47%;
	  margin: 40px 0 0 6%;
	}
	.appendixlist .box:nth-child(-n+3){
		margin-top: 40px;
	}
	.appendixlist .box:nth-child(3n-2){
		margin-left: 6%;
	}
	.appendixlist .box:nth-child(-n+2){
		margin-top: 0;
	}
	.appendixlist .box:nth-child(2n-1){
		margin-left: 0;
	}
	#index .appendixlist .box {
		display: none;
	}
	#index .appendixlist .box:nth-child(-n+4) {
		display: block;
	}
	.appendixlist .box a {
		width: auto;
		display: block;
		margin: 0 auto;
	}
	.appendixlist .box a .info {}
	.appendixlist .box a .info .img {
		border-radius: 8px;
		overflow: hidden;
		box-shadow: 0 0 7px rgba(0, 0, 0, 0.1);
	}
	.appendixlist .box a .info .img img {}
	.appendixlist .box a .info p.title {
		font-size: 13px;
		margin-top: 10px;
		line-height: 1.5em;
	}
	.appendixlist .box a .info .fbox {
		font-size: 11px;
		display: flex;
		color: #4b9fd4;
		margin-top: 8px;
	}
	.appendixlist .box a .info p.text {
		font-size: 13px;
		padding: 0 20px;
		line-height: 1.8em;
		margin: 20px 0 0 0;
		height: 3.6em;
		overflow: hidden;
	}

	/* ===========================================================================================
	
	  Inner
	
	========================================================================================== */
	
	#inner .content > .inner {
		width: 86%;
		margin: 0 auto;
		padding: 40px 0 60px 0;
		max-width: 1000px;
	}
	
	#inner.about .visual,
	#inner.archive.menu .visual {
		background: url(images/about/img_visual_sp.jpg?v=1) no-repeat center center;
		background-size: cover;
		position: relative;
		height: 450px;
		box-sizing: border-box;
		padding-top: 10px;
		width: auto;
	}
	#inner.about .visual.show,
	#inner.archive.menu .visual.show {
		border-radius: 0 0 0 80px;
	}
	#inner.archive.menu .visual {
		background-image: url(images/menu/img_visual_sp.jpg?v=1);
		height: 320px;
		margin: 0;
	}
	#inner.about .visual,
	#inner.archive.menu .visual {
		background-size: calc(100% + 20px) auto;
		background-position: left calc(50% + 20px) top 50%;
	}
	@media screen and (max-width: 1200px) {
		#inner.about  .visual,
		#inner.archive.menu  .visual {
			background-size: calc(100% + 40px) auto;
		}
	}
	#inner.about .visual.show,
	#inner.archive.menu .visual.show {
		background-position: left calc(50%) top 50%;
	}
	
	#inner.privacypolicy .visual,
	#inner.contact .visual {
		width: 84%;
		margin: 70px auto 0 auto;
	}
	
	/**********************************************************/
	/* Archive Menu */
	/**********************************************************/
	#inner.archive {	
		background: #ebebeb;
	}
	#inner.archive .visual,
	#inner.faq .visual,
	#inner.search .visual {
		background: no-repeat;
		width: 84%;
		text-align: center;
		height: auto;
		padding: 0;
		margin: 70px auto 0 auto;
	}
	#inner.archive.tips .visual {
		background: no-repeat;
		width: auto;
		height: auto;
		padding: 50px 0 0 0;
		margin: 0;
		background: url(./images/img_tips_visual.jpg) no-repeat right -30px top;
		background-size: auto 100%;
		background: none;
		border-radius: 0;
	}
	#inner.archive.tips .visual::before {
		display: none;
	}
	#inner.archive.tips .visual .tag {
		margin: 26px 0 0 0;
		font-size: 16px;
		color: #000;
		line-height: 1.5em;
		letter-spacing: 0.2em;
		left: 0 !important;
	}
	/*** Menu submenu ***/
	#inner .submenu {
		margin: -80px auto 40px auto;
		position: relative;
		z-index: 100;
	}
	#inner .submenu .tab {
	  display: flex;
	  justify-content: space-between;
	  margin-top: 0;
	}
	#inner .submenu .tab a {
	  display: block;
	  width: 49%;
	  box-shadow: 0 0 15px rgba(0, 0, 0, 0.1);
	  border-radius: 8px;
	  padding: 10px 0;
	  display: flex;
	  justify-content: center;
	  position: relative;
	  background: url(./images/index/icon_menu1.png) no-repeat center 4px;
	  background-size: 35px auto;
	  background-color: #fff;
	}
	#inner .submenu .tab a.bt_problem {
	  background-image: url(./images/index/icon_menu2.png);
	}
	#inner .submenu .tab a.active,
	#inner .submenu .tab a:hover {
	  opacity: 1;
	  background-color: #6cafd0;
	  color: #fff;
	  background-image: url(./images/index/icon_menu1_w.png);
	}
	#inner .submenu .tab a.bt_problem.active,
	#inner .submenu .tab a.bt_problem:hover {
	  background-image: url(./images/index/icon_menu2_w.png);
	}
	#inner .submenu .tab a>span {
	  display: block;
	  font-size: 11px;
	  letter-spacing: 0.1em;
	  padding: 32px 0 0 0px;
	  line-height: 1em;
	  text-align: center;
	}
	#inner .submenu .tab a span span.f_en {
	  font-size: 7px;
	  color: #6cafd0;
	  display: block;
	  line-height: 1em;
	  letter-spacing: 0.1em;
	  margin-top: 6px;
	  transition: 0.3s ease color;
	}
	#inner .submenu .tab a.active span.f_en,
	#inner .submenu .tab a:hover span.f_en {
	  color: #fff;
	}
	#inner .submenu ul {
	  display: flex;
	  justify-content: left;
	  flex-wrap: wrap;
	  margin-top: 10px;
	  gap: 0;
	  width: 102%;
	  position: relative;
	  left: -1%;
	}
	#inner .submenu ul li {
	  width: 31.3333%;
	  margin: 1%;
	}
	#inner .submenu ul li a {
	  display: block;
	  background: #fff;
	  border-radius: 8px;
	  box-shadow: 0 0 7px rgba(0, 0, 0, 0.1);
	  display: flex;
	  justify-content: center;
	  align-items: center;
	  font-size: 10px;
	  height: 50px;
	  line-height: 1.2em;
	  letter-spacing: 0.1em;
	  text-align: center;
	  padding: 0 8px;
	  box-sizing: border-box;
	}
	#inner .submenu ul li a.active,
	#inner .submenu ul li a:hover {
	  opacity: 1;
	  background: #6cafd0;
	  color: #fff;
	}
	
	/*** Menu submenu ***/
	#inner .submenu_fixed {
		position: fixed;
		top: 5px;
		z-index: 1000;
		left: 0;
		width: 100%;
		height: 0;
		transition: 0.3s ease top;
	}
	#inner .submenu_fixed.show {
		top: 85px;
	}
	#inner .submenu_fixed > .inner {
	  display: flex;
	  justify-content: space-between;
	  margin: 0 auto;
	  width: 92%;
	  align-items: start;
	}
	#inner .submenu_fixed .box {
	  display: block;
	  width: 48.5%;
	  box-shadow: 0 0 15px rgba(0, 0, 0, 0.1);
	  background-color: #fff;
	  border-radius: 8px;
		transition: 0.3s ease background;
	}
	#inner .submenu_fixed .box > a {
	  padding: 6px 0 6px 9px;
	  display: flex;
	  justify-content: center;
	  position: relative;
	  background: url(./images/index/icon_menu1.png) no-repeat 5px center;
	  background-size: 30px auto;
	  font-size: 10px;
	  letter-spacing: 0;
	}
	#inner .submenu_fixed .box > a.bt_problem {
	  background-image: url(./images/index/icon_menu2.png);
	}
	#inner .submenu_fixed .box.active {
	  opacity: 1;
	  background-color: #6cafd0;
	}
	#inner .submenu_fixed .box.active > a {
	  color: #fff;
	  background-image: url(./images/index/icon_menu1_w.png);
	}
	#inner .submenu_fixed .box.active > a.bt_problem {
	  background-image: url(./images/index/icon_menu2_w.png);
	}
	#inner .submenu_fixed .box.active ul li a {
		color: #fff;
	  background: linear-gradient(#fff, #fff) 0 90%/0 1px no-repeat;
	  text-decoration: none;
	}
	#inner .submenu_fixed .box.active ul li a:hover {
	  background-size: 100% 1px !important;
		opacity: 1;
	}
	#inner .submenu_fixed .box > a::before {
		top: 50%;
		right: 10px;
		border: solid transparent;
		content: "";
		height: 0;
		width: 0;
		position: absolute;
		pointer-events: none;
		border-color: rgba(80, 80, 80, 0);
		border-top-color: #505050;
		border-width: 5px;
		margin-left: -5px;
		margin-top: -3px;
		transition: 0.3s ease all;
	}
	#inner .submenu_fixed .box.active > a::before {
		border-top-color: #fff;
	}
	#inner .submenu_fixed .list {
		display: none;
	}
	#inner .submenu_fixed ul {
		display: block;
		padding: 5px 15px 10px 15px;
	}
	#inner .submenu_fixed ul li {width: auto;}
	#inner .submenu_fixed ul li a {font-size: 10px;line-height: 1.5em;padding: 7px 0px;display: block;}
	
	#inner.archive.tips .content {
		
	}
	#inner.archive.menu .content {
	}
	#inner.archive.menu .content .menulist {
		
	}
	#inner.archive.menu .content .menulist .box {padding-top: 120px;margin-top: -120px;}
	#inner.archive.menu .content .menulist .box + .box {
		margin-top: -70px;
	}
	#inner.archive.menu .content .menulist .box .b_main {
		background: none !important;
		width: auto;
	}
	#inner.archive.menu .content .menulist .box > .inner {
		display: block;
		border-radius: 15px;
		padding: 30px 20px 210px 20px;
		position: relative;
	}
	#inner.archive.menu .content .menulist .box .linkbox {
		display: block;
		position: absolute;
		bottom: 40px;
		left: 20px;
		margin-top: 0;
		width: calc(100% - 40px);
	}
	#inner.archive.menu .content .menulist .box .linkbox > div {
		width: auto;
	}
	#inner.archive.menu .content .menulist .box .linkbox a {
		display: flex;
		justify-content: center;
		background: #5f666c;
		position: relative;
	}
	#inner.archive.menu .content .menulist .box .linkbox a::before {
		content: "";
		width: 8px;
		height: 8px;
		border-top: 1px solid #fff;
		border-right: 1px solid #fff;
		transform: translate(-50%, -50%) rotate(45deg);
		top: 50%;
		right: 20px;
		position: absolute;
	}
	#inner.archive.menu .content .menulist .box .linkbox .line a {
		background: #797f80;
	}
	#inner.archive.menu .content .menulist .box .linkbox .title {
		color: #fff;
		font-size: 11px;
		line-height: 1em;
		letter-spacing: 0.2em;
		width: 170px;
		padding: 18px 20px 18px 70px;
		background: url(images/icon_reservation.png) no-repeat left center;
		background-size: 60px;
	}
	#inner.archive.menu .content .menulist .box .linkbox .line .title {
		background-image: url(images/icon_line.png);
	}
	#inner.archive.menu .content .menulist .box .linkbox .title span {display: block;font-size: 13px;margin-bottom: 8px;}
	
	#inner.archive.news .content, 
	#inner.faq .content {margin-top: 0;}
	#inner.archive.news .content > .inner,
	#inner.faq .content > .inner {box-sizing: border-box;padding: 40px 0 60px 0;}
	
	/**********************************************************/
	/* Contact */
	/**********************************************************/
	#inner.contact {
		background: #e6e6e6;	
	}
	#inner.contact .content form {
		position: relative;
		z-index: 100;
		font-size: 13px;
	}
	
	
	/**********************************************************/
	/* Pivacy Policy */
	/**********************************************************/
	#inner.privacypolicy {
		background: #e6e6e6;	
	}
	#inner.privacypolicy .content p {
		font-size: 12px;
		line-height: 2em;
		margin-top: 0px;
		letter-spacing: 0;
	}
	
	
	
	/**********************************************************/
	/* About */
	/**********************************************************/
	#inner.about {
		
	}
	#inner.about .intro {
		padding: 50px 0 70px 0;
	}
	#inner.about .intro > .inner {
		width: 84%;
		margin: 0 auto;
		position: relative;
	}
	#inner.about .intro .before,	
	#inner.about .intro .after {
		width: 410px;
		height: 410px;
		top: 752px;
		right: -204px;
	}
	#inner.about .intro .after {
		transform: rotate(180deg);
		top: 1446px;
		width: 530px;
		height: 440px;
		right: auto;
		left: -271px;
	}
	#inner.about .intro > .inner > .text {
		text-align: left;
		font-size: 13px;
		margin-top: 25px;
		letter-spacing: 0.1em;
		text-align: justify;
		line-height: 1.8em;
	}
	#inner.about .intro .about {
		margin-top: 75px;
	}
	#inner.about .intro .about .box {
	  display: block;
	}
	#inner.about .intro .about .box + .box {
		margin-top: 74px;
	}
	#inner.about .intro .about .box .info {
		width: auto;
		/* border-top: 1px solid #505050; */
		padding-top: 19px;
	}
	#inner.about .intro .about .box .info .header {
		display: flex;
		align-items: center;
		position: relative;
	}
	#inner.about .intro .about .box .info .header img {
	  width: 80px;
	  margin-right: 10px;
	  position: absolute;
	  top: -70px;
	  left: 50%;
	  transform: translate(-50%, 0);
	}
	#inner.about .intro .about .box .info .header p.title {
	  font-size: 17px;
	  letter-spacing: 0.1em;
	}
	#inner.about .intro .about .box .info p.text {
	  text-align: justify;
	  font-size: 12px;
	  margin-top: 17px;
	  line-height: 1.8em;
	}
	#inner.about .intro .about .box .img {
		width: auto;
		margin-top: 20px;
		border-radius: 10px;
	}
	#inner.about .message {
		background: #e6e6e6;
		padding: 60px 0;
	}
	#inner.about .message > .inner {
		width: 84%;
		margin: 0 auto;
		position: relative;
	}
	#inner.about .message .text {
		font-size: 12px;
		letter-spacing: 0.05em;
		margin-top: 22px;
		line-height: 1.8em;
		text-align: justify;
	}
	#inner.about .message .img {
		border-radius: 10px;
		width: 100%;
		position: relative;
		right: auto;
		top: auto;
		margin-top: 30px;
		transition: all ease 1s;
	opacity: 0;
	transition: all ease 1s +0.4s;
		top: 20px;
	}
	#inner.about .message.active .img {
		opacity: 0;
	}
	#inner.about .message .img.active {
		opacity: 1;
		top: 0;
	}
	#inner.about .facility {
		padding: 60px 0;
	}
	#inner.about .facility > .inner {
		width: 84%;
		margin: 0 auto;
		position: relative;
	}
	#inner.about .facility .text {
		font-size: 12px;
		letter-spacing: 0.05em;
		margin-top: 35px;
		line-height: 1.8em;
		width: auto;
	}
	#inner.about .facility .img.non_pc {
			display: flex !important;
			flex-wrap: wrap;
			margin-top: 40px;
			align-items: start;
			margin-bottom: 0;
			justify-content: space-between;
	}
	#inner.about .facility .img img {
	transform: none !important;
	width: 100% !important;
	margin: 20px 0 0 0 !important;
	position: relative;
	opacity: 0;
	transition: all ease 1s;
	top: 20px;
	}
	#inner.about .facility .img img.active {
		top: 0;
		opacity: 1;
	}
	
	/**********************************************************/
	/* Single */
	/**********************************************************/
	/*** /Cat Colors ***/

	/**********************************************************/
	/* 404 */
	/**********************************************************/
}


/* Add 240318 */

body#inner.sp_view.tips .content > .inner .info {
	display: none;
}

.l-sidebar{
	display:none;
}

.single-content{
	padding:40px;
	border-radius:20px;
	background:#fff;
}

 .single_inner {
	 display:flex;
    margin: 0 auto;
    padding: 60px 0 120px 0;
    max-width: 1000px;
	 justify-content:space-between;
	 width:1000px;
	position:relative;
	right:50px;
	font-family:"Noto Sans JP", sans-serif;
}
.info{
	width:200px;
}
.single_inner .l-mainContent__inner{
	width:100%;
	max-width:700px;
}
.single_inner .info h2 {
	font-family:"DM Sans", sans-serif;
    font-size: 30px;
    display: block;
    line-height: 1em;
    color: #92c3cf;
    letter-spacing: 0.15em;
    padding: 20px 0;
    width: 130%
390px
;
	font-weight:normal !important;
}

.single_inner .info .label
 {
	 font-family:游明朝, "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, serif;
    font-size: 30px;
    letter-spacing: 0.15em;
    width: 130%;
    color: #000;
	 margin-bottom:20px;
}

.single_inner .info .date,  .single_inner .info .tag {
    font-size: 13px;
    position: relative;
    padding: 18px 0;
	font-weight:300;
	font-family:"DM Sans", sans-serif;
}
.single_inner .info .date::before {
    content: "";
    width: 30px;
    height: 1px;
    background: #505050;
    top: 0;
    left: 0;
    position: absolute;
}
.l-content{
	margin-bottom:0;
	padding-bottom:50px;
	padding-top:50px;
}
.c-postTitle__date{
	display:none;
}
.p-articleMetas{
	display:none;
}
@media(max-width:1000px){
	 .single_inner {
	 display:block;
		 right:0;
}
	.info{
		display:none;
	}
	.single_inner{
		width:100%;
	}
	.single-content{
		max-width:100%;
		padding:40px 20px ;
	}