html, html a, body {
  -webkit-font-smoothing: antialiased;
}

html {
  font-size: 16px;
  -webkit-tap-highlight-color: transparent;
}

body {
  font-size: 1rem;
  color: #40220f;
  line-height: 1.6;
  font-family: "Zen Kaku Gothic New", sans-serif;
}


h2, h3, h4, h5, h6 {
  font-weight: 400;
  line-height: 1.2;
  color: #40220f;
  margin-top: 0;
  margin-bottom: .5rem;
  font-family: "Zen Kaku Gothic New", sans-serif;
}


h2,
h3,
h4,
h5,
h6 {
  margin-bottom: 0.75rem;
}


h2 a,
h3 a,
h4 a,
h5 a,
h6 a {
  color: #40220f;
  transition-duration: 200ms;
  transition-property: all;
  transition-timing-function: cubic-bezier(0.7, 1, 0.7, 1);
}


h2 a:focus,
h2 a:hover,
h3 a:focus,
h3 a:hover,
h4 a:focus,
h4 a:hover,
h5 a:focus,
h5 a:hover,
h6 a:focus,
h6 a:hover {
  color: #40220f;
  transition-duration: 200ms;
  transition-property: all;
  transition-timing-function: cubic-bezier(0.7, 1, 0.7, 1);
}

h2 {
  font-size: 2rem;
}

h3 {
  font-size: 1.75rem;
}

h4 {
  font-size: 1.5rem;
}

h5 {
  font-size: 1.25rem;
}

h6 {
  font-size: 1rem;
}

em,
li {
  font-size: 1rem;
  font-weight: 500;
  color: #40220f;
}

em > a,
li > a {
  color: #40220f;
}

em > a:hover,
li > a:hover {
  color: #40220f;
}

small {
  color: #40220f;
}

label {
  font-size: 0.8125rem;
  font-weight: 700;
  color: #40220f;
  margin-bottom: .25rem;
}

i {
  line-height: 1;
}

/* Paragraph */
p {
  font-size: 1rem;
  color: #40220f;
  line-height: 2;
	letter-spacing: 1px;
  margin-top: 0;
  margin-bottom: 1rem;
  font-family: "Zen Kaku Gothic New", sans-serif;
	font-weight: 500;
}

/* Links */
a {
  color: #40220f;
  text-decoration: none;
}
a:hover {
  opacity: 0.5;
	transition: 0.5s;
}

a:focus, a:hover {
  color: #292F2F;
  text-decoration: none;
}

a:focus {
  outline: none;
}

::selection {
  color: #fff;
  background: #9CBDBE;
  text-shadow: none;
}

::-webkit-selection {
  color: #fff;
  background: #9CBDBE;
  text-shadow: none;
}

:active,
:focus {
  outline: none;
}

img {
	max-width: 100%;
	height: auto;
	margin:0;
	padding:0;
	border: none;
    vertical-align: bottom;
}

.flbox{
  display: -ms-flexbox;
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  -ms-flex-wrap: wrap;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
}

.flend{
	align-self: flex-end;
}

.flend2{
	justify-content: flex-end;
}

.flcenter{
  align-self: center;
}

.flcenter2{
  justify-content: center;
}

.fontg{font-family: "Zen Kaku Gothic New", sans-serif!important;}
.fontg2{font-family: "Zen Maru Gothic", serif!important;}
.fontg3{font-family: "Oooh Baby", cursive!important;}
.marker{
  background: linear-gradient(transparent 60%, rgba(255,231,73,0.60) 60%);
}

/* imgchange */
.pc { display: block !important;
margin:0 auto;}
.sp { display: none !important; }
 
/* spimgchange */
@media only screen and (max-width: 576px) {
    .pc { display: none !important; }
    .sp { display: block !important; }
}

/* imgchange */
.pc2 { display: block !important;
margin:0 auto;}
.sp2 { display: none !important; }
 
/* spimgchange */
@media only screen and (max-width: 768px) {
    .pc2 { display: none !important; }
    .sp2 { display: block !important; }
}


header{
	padding: 0;
	width: 100%;
    position: fixed;
    z-index: 10000;
	transition: all 0.6s;
}

header.hbg{
	background: rgba(254,248,231,0.9);
}


header .logo,header .logobig{position: absolute;}
header .logo{
	transition: all 0.6s;
	opacity: 0;
	width: 300px;
}
header .logobig{
	transition: all 0.6s;
	margin: 20px 0 0;
	width: 400px;
}

header.hbg .logo{
	width: 300px;
	opacity: 1;
}
header.hbg .logobig{
	opacity: 0;
}

header h1{
	margin:0 0 2px!important;
	width: 100%!important;
	text-align: left!important;
	font-size: 10px;
}
header .col-sm-2,header .col-sm-1{
  display: -ms-flexbox;
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  -ms-flex-wrap: wrap;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
}

@media only screen and (max-width:991px) {
header .logobig{
	margin: 60px 0 0;
	width: 400px;
}
header.hbg .logo{
	width: 280px;
}
}

@media only screen and (max-width:567px) {
header .col-sm-2,header .bg-color-insta{
  display: none;
}
header .logo{width: 80%;}
header .logobig{
	margin: 10px 0 0;
	width: 70%;
}
header.hbg .logo{width: 80%;}
}

.slider {
	position: relative;
	max-width: 100%;
	margin:0 auto;
	padding:0;
	background: linear-gradient(0deg, rgba(255,249,232,0.5) 0%, rgba(255,249,232,0.5) calc(0% + 60px), rgba(255,249,232,0) calc(0% + 60px)), url("../img/top/slidebg.png");
	background-position:bottom,bottom 60px center;
	background-repeat:repeat,repeat-x;
	background-size:auto,200px;
}
@media only screen and (max-width:567px) {
.slider {
	position: relative;
	max-width: 100%;
	margin:0 auto;
	padding:0;
	background: linear-gradient(0deg, rgba(255,249,232,0.5) 0%, rgba(255,249,232,0.5) calc(0% + 60px), rgba(255,249,232,0) calc(0% + 60px)), url("../img/top/slidebg.png");
	background-position:bottom,bottom 60px center;
	background-repeat:repeat,repeat-x;
	background-size:auto,50px;
}
}

.mainbg{
	position: relative;
	background:rgba(255,249,232,0.5);
}

.mainbg::before{
	content: "";
	position: fixed;
	top: 0;
	width: 100vw;
	height: 100vh;
	z-index: -1;
	background: url("../img/top/bodybg.jpg");
	background-repeat: repeat;
}

.main{
	position: relative;
	background:url("../img/top/messbg.png");
	background-position:top 40% right 10%;
	background-repeat: no-repeat;
	background-size:350px;
	z-index: 3;
}

.main .container::before{
	content: "Clinic Concept";
	position: absolute;
	left: 60px;
	top: 260px;
	font-family: "Oooh Baby", cursive!important;
	color: #eb6100;
	opacity: 0.3;
	font-size: 150px;
	transform:rotate(-25deg);
	transform-origin: 0 0;   
}

.mainbg .container::after{
	content: "";
	position: absolute;
	left:-160px;
	bottom: -240px;
	width: 390px;
	height: 520px;
	background: url("../img/top/mainbg.png");
	background-repeat: no-repeat;
	background-size: contain;
	z-index: 2;
}

@media only screen and (max-width:1600px) {
.main{
	background:url("../img/top/messbg.png");
	background-position:top 240px right 60px;
	background-repeat: no-repeat;
	background-size:300px
}
}

@media only screen and (max-width:991px) {
.main{
	background:url("../img/top/messbg.png");
	background-position:top 100px right 20px;
	background-repeat: no-repeat;
	background-size:280px
}
.main .container::before{
	white-space: pre-wrap;
	content: "Clinic\A　Concept";
	line-height: 1;
	left: -60px;
	top: 240px;
	opacity: 0.3;
	font-size: 100px;
	transform:rotate(-25deg);
}
.mainbg .container::after{
	content: "";
	position: absolute;
	left:-100px;
	bottom: -180px;
	width: 300px;
	height: 400px;
	background: url("../img/top/mainbg.png");
	background-repeat: no-repeat;
	background-size: contain;
	z-index: 2;
}
}

@media only screen and (max-width:567px) {
.main{
	background:url("../img/top/messbgsp.png");
	background-position:top 33% right 0;
	background-repeat: no-repeat;
	background-size:100%;
}
.main .container::before{
	white-space: pre-wrap;
	content: "Clinic\A　Concept";
	left: -40px;
	top: 260px;
	font-size: 100px;
	transform:rotate(-30deg);
	transform-origin: 0 0; 
	line-height: 1;
}
.mainbg .container::after{
	left:-160px;
	bottom: -300px;
	width: 330px;
	height: 440px;
}
}

.menu{
	position: relative;
	text-align: center;
}
.menu::after{
	content: "";
	position: absolute;
	top:-110px;
	right: 0;
	left: 0;
	margin: auto;
	width: 120px;
	height: 120px;
	background-image: url("../img/top/menucake.png");
	background-size: contain;
}

.menuli{
	display: flex;
	flex-direction: column;
	padding: 0;
	margin: 0;
	list-style: none;
	text-align: center;
}
.menuli li{
	font-weight: 600;
	margin: 0 0 20px;
	letter-spacing: 0.1em;
	font-family: "Zen Maru Gothic", serif;
}
.menuli li i{
	color:#c9a063;
}
@media only screen and (max-width:991px) {
.menu::after{
	top:-80px;
	width: 90px;
	height: 90px;
}
.menuli{
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: space-between;
	}
.menuli li{margin: 0 0 10px;}
}

.readme{
	position: relative;
	overflow: hidden;
	z-index: 2;
}
.readme p{
	position: relative;
	z-index: 2;
}

.readme .container{
	position: relative;
	background-color: rgba(208,229,176,0.5);
}
.readme .container::before,.readme .container::after{
	content: "";
	position: absolute;
	top: 0;
	width: 100%;
	height: 100%;
	background-image: url("../img/top/readmebg.png");
	background-repeat: repeat;
}
.readme .container::before{left: 100%;}
.readme .container::after{right: 100%;}

.readme .container h3{
	position: relative;
	z-index: 1;
}
.readme .container h3::before{
	content: "Read me";
	position: absolute;
	left: 160px;
	top: -140px;
	font-family: "Oooh Baby", cursive!important;
	color: #fff;
	font-weight: 500;
	opacity: 0.3;
	font-size: 150px;
	line-height: 1;
	z-index: -1;
}

.readmeb{
	width: 340px;
	position: absolute;
	bottom: 0;
	right: calc(100% / 3 - 170px);
	text-align: center;
	border-radius: 20px 20px 0 0;
	z-index: 2;
	box-shadow: 4px -4px 16px -6px rgba(0,0,0,0.4);
}

@media only screen and (max-width:991px){
.readme .container h3::before{
	content: "Read me";
	position: absolute;
	left: 120px;
	top: -80px;
	font-family: "Oooh Baby", cursive!important;
	color: #fff;
	font-weight: 500;
	opacity: 0.3;
	font-size: 140px;
	line-height: 0.7;
	z-index: -1;
}
}

@media only screen and (max-width:576px){
.readme .container::before,.readme .container::after{
	top: 0;
	width: 20%;
	height: 100%;
	background-image: url("../img/top/readmebg.png");
	background-repeat: repeat;
	background-size: 20px;
	opacity: 0.5;
}
.readme .container::before{left: 0;}
.readme .container::after{right: 0;}
.readme .container h3::before{
	content: "Read\AMe";
	text-indent: 10%;
	left: 90px;
	top: -180px;
	font-size: 100px;
	text-align: left;
	line-height: 0.8;
	opacity: 1;
}
.readmeb{
	width: 300px;
	bottom: 260px;
	right: calc(100% / 2 - 150px);
	border-radius: 50px;
	box-shadow: 4px 4px 16px -6px rgba(0,0,0,0.4);
}

.readme .js__fullwidth-img{border-radius: 50% 50% 0 0;}
	
}

.serv{
	position: relative;
	z-index: 1;
}
.serv::after{
	content: "";
	position: absolute;
	top: -80px;
	right: 120px;
	background-image: url("../img/top/servbg.png");
	background-repeat: no-repeat;
	background-size: contain;
	width: 700px;
	height: 500px;
	z-index: -1;
}

.servt{
	position: relative;
}
.servt::before{
	content: "Service";
	position: absolute;
	left: 0;
	top: -180px;
	font-family: "Oooh Baby", cursive!important;
	color: #eb6100;
	font-weight: 500;
	opacity: 0.3;
	font-size: 150px;
	z-index: -1;
}

.horizontal_scroll {
  height: var(--sticky-container-height);
  box-sizing: border-box;
  min-height: 100vh;
}
.horizontal_scroll .sticky {
  position: sticky;
  top: 0;
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}
.horizontal_scroll .scroller {
  display: flex;
  overflow: auto;
}
.horizontal_scroll .scroller.nobar {
  overflow: hidden;
}
.horizontal_scroll .scroller > * {
  flex-basis: 1000px;
  flex-shrink: 0;
	align-items: flex-end;
}
.horizontal_scroll .scroller > *:not(:first-child) {
  margin-left: 1%;
}
@media only screen and (max-width:991px) {
.horizontal_scroll .scroller > * {
  flex-basis: 700px;
  flex-shrink: 0;
	align-items: flex-end;
}
.serv::after{
	content: "";
	position: absolute;
	top: 200px;
	right: 0;
	background-image: url("../img/top/servbg.png");
	background-repeat: no-repeat;
	background-size: contain;
	width: 400px;
	height: 500px;
	z-index: -1;
}
}
@media only screen and (max-width:576px) {
.serv::after{
	display: none;
}
.servt::before{
	font-size: 120px;
	top: -120px;
	left: -30px;
}
.horizontal_scroll .scroller > * {
  flex-basis: 100%;
  flex-shrink: 0;
	align-items: flex-start;
	align-content:flex-start;
}
}

.clinic{
	padding: 80px 120px 0;
	position: relative;
}
.clinic::after,.clinic::before{
	content: "";
	position: absolute;
	height: 4px;
	border-radius: 2px;
	background-color: #fff;
}
.clinic::after{
	top: 50px;
	left: 120px;
	width: 200px;
}
.clinic::before{
	top: 30px;
	left: 288px;
	width: 40px;
	transform:rotate(30deg);
	transform-origin: 0 0;   
}

.clinicst{
	padding: 180px 0 0;
	position: relative;
	border-top: dotted 5px #fff;
	z-index: 1;
}
.clinicst::after{
	content: "Facility";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	margin: auto;
	font-family: "Oooh Baby", cursive!important;
	color: #fff;
	font-weight: 500;
	opacity: 0.3;
	font-size: 150px;
	text-align: center;
	z-index: -1;
}
@media only screen and (max-width:567px) {
.clinic{
	padding: 40px 20px 0;
	position: relative;
}
.clinic::after,.clinic::before{
	content: "";
	position: absolute;
	height: 4px;
	border-radius: 2px;
	background-color: #fff;
}
.clinic::after{
	top: 20px;
	left: calc(50% - 60px);
	width: 120px;
}
.clinic::before{
	top: 5px;
	left: calc(50% + 34px);
	width: 30px;
	transform:rotate(30deg);
	transform-origin: 0 0;   
}
.clinicst{
	padding: 160px 0 0;
	position: relative;
	border-top: dotted 5px #fff;
	z-index: 1;
}
.clinicst::after{
	font-size: 120px;
}
.clinicst::before{
	content: "";
	position: absolute;
	top: -780px;
	right: -20px;
	background-image: url("../img/top/servbgsp.png");
	background-repeat: no-repeat;
	background-size: contain;
	width: 280px;
	height: 320px;
	z-index: -1;
}
}

.point,.point2{
	position: relative;
}
.point{padding: 0 0 0 120px;}
.point2{padding: 0 120px 0 0;}

.point::after,.point2::after{
	content: "";
	position: absolute;
	top:-40px;
	width: 60vw;
	height: calc(100% + 140px);
	background-color: rgba(255,249,232,0.6);
	z-index: -1;
}
.point::after{left: 0;border-radius: 0 40px 40px 0;}
.point2::after{right: 0;border-radius: 40px 0 0 40px;}

.pointst{
	position: relative;
}

.pointb,.pointb2{
	display: block;
	width: 60vw;
	position: absolute;
	padding: 20px 0;
	bottom: -100px;
	text-align: center;
	z-index: 1;
	color:#fff;
	font-weight: 600;
	letter-spacing: 0.1em;
}
.pointb{left: 0;}
.pointb2{right: 0;}

.pointb::after,.pointb2::after{
	content: "";
	position: absolute;
	left: 0;
	bottom:0;
	width: 100%;
	height: 100%;
	z-index: -1;
}
.pointb::after{background-color: #F08080;border-radius: 0 0 40px 0;}
.pointb2::after{background-color: #85AAC4;border-radius: 0 0 0 40px;}

.pointimg{border-radius: 500px 0 0 500px;}
.point2img{border-radius: 0 500px 500px 0;}

@media only screen and (max-width:1800px) {
.point{padding: 0 0 0 40px;}
.point2{padding: 0 40px 0 0;}
}

@media only screen and (max-width:991px) {
.point::after,.point2::after{
	width: calc(100% - 20px);
	height: calc(100% + 80px);
}
.point{padding: 0;}
.point2{padding: 0;}
	
.pointimg,.point2img{
	width: calc(100% - 20px);
}
.pointimg{margin:0 0 0 20px;}
.point2img{margin: 0 20px 0 0;}
	
.pointb,.pointb2{
	width: calc(100% - 20px);
	padding: 20px 0;
	bottom: -40px;
	text-align: center;
	z-index: 1;
	color:#fff;
	font-weight: 600;
	letter-spacing: 0.1em;
}
}

.info{
	position: relative;
	margin:0;
	padding:0;
	background: linear-gradient(0deg, rgba(255,249,232,0.5) 0%, rgba(255,249,232,0.5) calc(100% - 100px), rgba(255,249,232,0) calc(100% - 100px)), url("../img/top/slidebg.png");
	background-position:top;
	background-repeat:repeat,repeat-x;
	background-size:auto,200px;
}

@media only screen and (max-width:567px) {
.info{
	background: linear-gradient(0deg, rgba(255,249,232,0.5) 0%, rgba(255,249,232,0.5) calc(100% - 50px), rgba(255,249,232,0) calc(100% - 50px)), url("../img/top/slidebg.png");
	background-position:top;
	background-repeat:repeat,repeat-x;
	background-size:auto,100px;
}
}

.infost{
  text-align: center;
  padding: 0.25em;
  border-top: solid 4px #EE8D49;
  border-bottom: solid 4px #EE8D49;
  background: -webkit-repeating-linear-gradient(-90deg, #FFF2D5, #FFF2D5 6px,#FFF7F6 6px, #FFF7F6 14px);
  background: repeating-linear-gradient(-90deg, #FFF2D5, #FFF2D5 6px,#FFF7F6 6px, #FFF7F6 14px);
  color: #755836;
}

.accst {
	position: relative;
	width: 100%;
	border-radius: 100px;
	padding: 0.5em;
	border: solid 2px #c9a063;
	background-color: #fffef7;
	text-align: center;
}
.accst::after {
	content: "";
	position: absolute;
	top:5px;
	left:5px;
	height: calc(100% - 10px);
	width: calc(100% - 10px);
	border-radius: 100px;
	border: solid 1px #c9a063;
	pointer-events: none;
}

.infiniteslide ul{
	margin: 0;
	padding: 0;
}
.infiniteslide li{
	list-style: none;
	float: left;
	margin: 0;
}

.fmenu{
	margin:0;
	padding:0;
	display: none;
	}

@media only screen and (max-width:576px){
footer {
padding: 0 0 18%;
}
.fmenu {
	display: inline;
	margin:0;
	position: fixed;
    bottom:-110px;
	padding:0;
	z-index: 99999;
	transition: 1s;
}

.fmenu.active{
    bottom:0;
}

#foot1{
	float:left;
	width:50%;
}

#foot2{
	float:left;
	width:50%;
}

#foot3{
	float:left;
	width:17.1875%;
}
}

.back-top{
	position: fixed;
	bottom: -110px;
	right: 40px;
	z-index: 9999;
  -webkit-transition: .8s ease-in-out;
  transition: .8s ease-in-out;
}
.back-top.active{
	bottom: 40px;
}
.back-top a{
	width: 110px;
	display: block;
	color: #fff;
	text-align: center;
	text-decoration: none;
}

.bt-visible{
	opacity: 1!important;
  -webkit-transition: .3s ease-in-out;
  transition: .3s ease-in-out;
}
@media screen and (max-width:991px){
	.back-top a{width:90px;}
}

@media screen and (max-width:576px){
	.back-top{
		position: fixed;
		bottom: -110px;
		right: 0;
		z-index: 9999;
	}
	.back-top.active{bottom: 70px;}
	.back-top a{width:17.1875vw;}
}

table.com,table.comno{
	margin:0 auto;
	width:100%;
    border-collapse:separate;
    border-spacing:4px;
    empty-cells:show;
	font-family: "Zen Maru Gothic", serif;
}
.com th,.comno th{
	letter-spacing: 0.1em!important;
    padding:10px;
    text-align:center;
	color: #40220f;
	font-weight: 600;
}
.com td,.comno td{
	color: #40220f; 
  	padding: 10px;
	font-weight: 500;
}

table.com li{
	font-weight: 500;
	color:#40220f;
	line-height: 1.5;
	margin-bottom: 5px;
}

@media screen and (max-width:480px){
	.com th,.com td{
		width: 100%;
		display: block;
	}
}


.time {
	width: 100%;
	margin: 0 auto 10px;
	font-weight: 600;
	border-radius: 10px;
	overflow: hidden;
}
.time th {
	padding:10px 4px;
	word-break: break-all;
	text-align: center;
	font-weight: 600;
	font-size: 18px!important;
	letter-spacing: .2em;
  color: #40220f;
}
.time td {
	padding:10px 4px;
	word-break: break-all;
	text-align: center;
	font-size: 18px!important;
	border-bottom: 2px solid #EBE6D4;
  color: #40220f;
	font-weight: bold;
}
@media only screen and (max-width: 991px) {
	.time th {
		padding:10px 2px;
		font-size: 16px!important;
		letter-spacing: 0.2;
	}
	.time td {
		padding:10px 2px;
		font-size: 16px!important;
	}
}

.st {
	position: relative;
	font-weight: 600;
	z-index: 1;
}
.st span{
	position: absolute;
	left: 0;
	bottom: calc(100% - 0.2em);
	font-family: "Oooh Baby", cursive!important;
	font-weight: 500;
	color: #eb6100;
	opacity: 0.2;
	font-size: 3em;
	transform-origin: 0 0;
	line-height: 1;
	z-index: -1;
}
@media only screen and (max-width:576px){
.st {
	text-align: center;
}
.st span{
	bottom: inherit;
	top: -0.8em;
	left: 50%;
	transform: translate(-50%,0);
}
}

.st2 {
	position: relative;
	padding: 0.5em;
	width: 100%;
	line-height: 1.5;
	border-top: 2px solid #9c7149;
	border-bottom: 2px solid #9c7149;
	z-index: 1;
	text-align: center;
	font-weight: 500;
}
.st2::after {
	content: "";
	position: absolute;
	top:-8px;
	left: 0;
	padding: 0.5em;
	width: 100%;
	height: calc(100% + 16px);
	line-height: 1.5;
	border-top: 4px solid #9c7149;
	border-bottom: 4px solid #9c7149;
	z-index: 1;
}

.st3{
	position: relative;
}
.st3::after{
	content: "";
	position: absolute;
	width: calc(100% + 6px);
	height: calc(100% + 6px);
	top:0;
	left: 0;
	border-bottom: 2px #a4845b solid;
	border-right: 2px #a4845b solid;
}

.st4{
	position: relative;
    margin-bottom: 0.5rem;
    padding-bottom: .1rem;
    border-bottom: 5px dotted #96C08B;
    font-weight: bold;
	line-height: 2;
}

.sts::first-letter {
	color: #8ac875;
}
.sts-2::first-letter {
    color: #e8a34f;
    font-size: 2rem;
}
.sts-3::first-letter {
	color: #4E869A;
	font-size: 1.7rem;
}



.stw {
  overflow: hidden;
  text-align: center;
	position: relative;
	padding: 1em 0.5em;
	letter-spacing: 0;
}
.stw::before,.stw::after{
     position: absolute;
     left: 0;
     content: '';
     width: 100%;
     height: 7px;
     box-sizing: border-box;
}
.stw::before {
     top: 0;
     border-top: 3px solid #fff;
     border-bottom: 1px solid #fff;
}
.stw::after {
     bottom: 0;
     border-top: 1px solid #fff;
     border-bottom: 3px solid #fff;
}

.stf{
  position: relative;
  padding: .5em;
	margin: 0 0 20px;
  border-radius: 10px;
	line-height: 1.5!important;
}
.stf::after {
  content: '';
  position: absolute;
  top: 100%;
  left: 30px;
  margin: auto;
  width: 0;
  height: 0;
  border: 10px solid transparent;
}

.fcw{background-color: #fff;}
.fcw::after {border-top: 15px solid #fff;}
.fc1{background-color: rgba(235,97,0,1.00);}
.fc1::after {border-top: 15px solid rgba(235,97,0,1.00);}
.fc2{background-color: rgba(151,181,62,1.00);}
.fc2::after {border-top: 15px solid rgba(151,181,62,1.00);}
.fc3{background-color: rgba(236,156,49,1.00);}
.fc3::after {border-top: 15px solid rgba(236,156,49,1.00);}
.fc4{background-color: #956134;}
.fc4::after {border-top: 15px solid #956134;}
.fc5{background-color: #c9a063;}
.fc5::after {border-top: 15px solid #c9a063;}
.fc6{background-color: rgba(255,249,232,1);}
.fc6::after {border-top: 15px solid rgba(255,249,232,1);}

.smainbg{
	position: relative;
}

.smainbg::before{
	content: "";
	position: fixed;
	top: 0;
	width: 100vw;
	height: 100vh;
	z-index: -1;
	background: url("../img/top/bodybg.jpg");
	background-repeat: repeat;
}

.title {
	position: relative;
	max-width: 100%;
	margin:0 auto;
	padding:0;
	background: linear-gradient(180deg, rgba(255,249,232,0) 0%, rgba(255,249,232,0) calc(0% + 220px), rgba(255,249,232,0.5) calc(0% + 220px)), url("../img/top/slidebg.png");
	background-position:bottom,top 170px center;
	background-repeat:repeat,repeat-x;
	background-size:auto,100px;
}
@media only screen and (max-width:991px) {
.title {
	background: linear-gradient(180deg, rgba(255,249,232,0) 0%, rgba(255,249,232,0) calc(0% + 285px), rgba(255,249,232,0.5) calc(0% + 285px)), url("../img/top/slidebg.png");
	background-position:bottom,top 260px center;
	background-repeat:repeat,repeat-x;
	background-size:auto,50px;
}
}
@media only screen and (max-width:567px) {
.title {
	background: linear-gradient(180deg, rgba(255,249,232,0) 0%, rgba(255,249,232,0) calc(0% + 225px), rgba(255,249,232,0.5) calc(0% + 225px)), url("../img/top/slidebg.png");
	background-position:bottom,top 200px center;
	background-repeat:repeat,repeat-x;
	background-size:auto,50px;
}
}

.flow{
	position: relative;
	padding:20px 15px;
	background-color: rgba(255,255,255,1.00);
	margin: 0 0 40px
}
.flow::after {
  position: absolute;
  top: 100%;
  left: calc(50% - 30px);
  content: '';
  width: 0;
  height: 0;
  border: 30px solid transparent;
	border-top: 30px solid #fff;
}

.infobox{
	position: relative;
	top:-20px;
	z-index: 1;
	margin: 0 10px;
	border-radius: 20px;
	background-color: #fff;
	box-shadow: 0px 0px 16px -6px rgba(0,0,0,0.4);
	overflow: hidden;
}

.infoboxt,.infoboxt2,.infoboxt3{
	position: relative;
	z-index: 1;
	text-align: center;
	margin: 0 0 20px;
}
.infoboxt::after,.infoboxt2::after,.infoboxt3::after {
	content: "";
	position: absolute;
	margin: auto;
	bottom:-0.5em;
	left: 0;
	right: 0;
	width: 80px;
	height: 5px;
	background-color: #71C69E;
	border-radius: 10px;
	background-size: contain;
	background-repeat: no-repeat;
	background-position:center;
}

.infoboxt2::after {
	background-color: #D86D6D;
}

.infoboxt3::after {
	background-color: #E29834;
}


#point1in,#point2in,#point3in,#point4in,#point5in{
	background-repeat: no-repeat;
	background-position: top left;
	background-size: 20% auto;
	padding: 40px 20px 0 5%;
	margin: -40px 0 0; 
}
#point1in{background-image:url("../img/staff/po1.png");}
#point2in{background-image:url("../img/staff/po2.png");}
#point3in{background-image:url("../img/staff/po3.png");}

@media screen and (max-width: 768px) {
#point1in,#point2in,#point3in,#point4in,#point5in{
	background-repeat: no-repeat;
	background-position: top left;
	background-size: 20% auto;
	padding: 30px 20px 0 20px;
	margin: -30px 0 0 0; 
}
}
@media screen and (max-width: 480px) {
#point1in,#point2in,#point3in,#point4in,#point5in{
	background-repeat: no-repeat;
	background-position: top left;
	background-size: 35% auto;
	padding: 40px 0 0 0;
	margin: -40px 0 0 -20px; 
}
}

.poinbtn{	

}

.poinbtn a {
    display: block;
	position: relative;
	margin: 0 auto;
	padding: 10px;
	width:75%;
	color: #fff;
    text-align: center;
	text-decoration: none;
	font-size: 16px;
	border: 1px solid #9c7149;
	transition: 0.3s;
	background-color: #9c7149;
}
.poinbtn a::before {
  content: '';
  position: absolute;
  bottom: -7px;
  right: -7px;
  width: 100%;
  height: 1px;
  background-color: #dcd6b1;
  transition: 0.2s ease 0s;
}
.poinbtn a::after {
  content: '';
  position: absolute;
  top: 7px;
  right: -7px;
  width: 1px;
  height: 100%;
  background-color: #dcd6b1;
  transition: 0.2s ease 0.2s;
}
.poinbtn a:hover::before {
  width: 0%;
}
.poinbtn a:hover::after {
  height: 0%;
}
.poinbtn a:hover {
  text-decoration: none;
  background-color: rgba(255,255,255,0.70);
  color: #dcd6b1;
}
.radius-b{
	border-radius:20px;
}



.List-Item-Content {
	position: relative;
  margin-left: auto;
  margin-right: auto;
  align-items: center;
	z-index: 1;
	font-weight: 600;
}

.List-Item-Content .col-2{
	position: relative;
}
.List-Item-Content .col-2::before {
	content: "";
  position: absolute;
  top: 50%!important;
  left: calc(50% - 1px);
  transform: translate(-50%,-50%);
  width: 2px;
  height: 100%;
	z-index: -1;
}
.List-Item-Content.fl1 .col-2::before {background: #a9d62b;}
.List-Item-Content.fl2 .col-2::before {background: #FBD40C;}
.List-Item-Content.fl3 .col-2::before {background: #ffac1a;}
.List-Item-Content.fl4 .col-2::before {background: #ff7bac;}

@media screen and (max-width: 540px) {
  .List-Item-Content {
    flex-wrap: wrap;
  }
}
.List-Item-Content-Number {
	top: 0;
	left: 0;
	right: 0;
	margin: auto;
  border-radius: 50%;
  width: 80px;
  height: 80px;
  line-height: 80px;
  text-align: center;
  color: #fff;
  font-size: 36px;
}
@media screen and (max-width: 480px) {
  .List-Item-Content-Number {
    width: 50px;
    height: 50px;
    line-height: 50px;
    font-size: 28px;
  }
}
.flowimg {
	border-radius: 150px 0 0  150px;
}
@media only screen and (max-width: 1000px) {
.flowimg {
	border-radius: 25px 25px 0 0 ;
}
}


