@charset "utf-8";
/*-------------------------------------------------------------------

	Init

-------------------------------------------------------------------*/
html {
	font-size: 62.5%;
}
body {
	color: #1c1c1c;
	font-size: 13px;
	line-height: 1.7;
	font-family: 'メイリオ', Meiryo, '游ゴシック', 'Yu Gothic', '游ゴシック体', YuGothic, 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'MS Pゴシック', 'MS PGothic', sans-serif;
	-webkit-text-size-adjust: 100%;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}
h1, h2, h3, h4, h5, h6, p, ul, ol, dl, dt, dd, figure {
	margin: 0;
	padding: 0
}
ul li {
	list-style: none;
	margin: 0;
	padding: 0;
}
h1, h2, h3, h4, h5, h6 {
	line-height: 1.3;
}
address {
	font-style: inherit
}
a {
	color: #01a5e4;
	text-decoration: underline;
}
a:hover {
	text-decoration: none;
}
p {
	margin-bottom: 1em;
}
.clearfix::after {
	content: "";
	display: block;
	clear: both;
}
img {
	max-width: 100%;
	height: auto;
	vertical-align: bottom;
}
table {
	width: 100%;
	border-collapse: collapse;
	table-layout: fixed;
}
hr {
	border: none;
	height: 1px;
	background: #1c1c1c;
	margin-bottom: 1em;
}

/*-------------------------------------------------------------------
	PC
-------------------------------------------------------------------*/
@media (min-width: 768px) {
body {
	font-size: 18px;
}
}
/*-------------------------------------------------------------------

	Utility

-------------------------------------------------------------------*/
.u-sp-item {
	display: block;
}
.u-sp-item-inline {
	display: inline;
}
.u-pc-item, .u-pc-item-inline {
	display: none;
}
.u-marker {
	background: #FFFF73;
	font-style: normal;
}
.u-clr {
	clear: both;
}
.u-mb-0em {
	margin-bottom: 0;
}
.u-mb-05em {
	margin-bottom: .5em;
}
.u-mb-1em {
	margin-bottom: 1em;
}
.u-mb-2em {
	margin-bottom: 2em;
}
.u-text-center {
	text-align: center;
}
.u-text-left {
	text-align: left;
}
.u-text-right {
	text-align: right;
}
.u-text-bold {
	font-weight: bold;
}
.u-text-small {
	font-size: .85em;
}
.u-item-left {
	float: left;
}
.u-item-right {
	float: left;
}
.u-item-left.u-item-left-margin {
	margin: 0 1.5em 1em 0;
}
.u-item-right.u-item-right-margin {
	margin: 0 0 1em 1.5em;
}
.u-item-auto {
	margin-left: auto;
	margin-right: auto;
}
.u-item-w-50 {
	width: 50%;
}
.u-ul-basic, .u-ol-basic {
	padding-left: 1.5em;
	line-height: 1.3;
}
.u-ul-basic li {
	list-style-type: disc;
	padding: 0 0 .5em 0;
}
.u-ol-basic li {
	list-style-type: decimal;
	padding: 0 0 .5em 0;
}
.u-button-detail a {
	display: inline-block;
	text-decoration: none;
	color: #FFF;
	line-height: 1.1;
	background: #990000;
	padding: 1em;
	border-radius: 4px;
}
.u-button-detail.basic a {
	background: #1c1c1c;
	font-size: 11px;
}

/*-------------------------------------------------------------------
	PC
-------------------------------------------------------------------*/
@media (min-width: 768px) {
.u-sp-item, .u-sp-item-inline {
	display: none;
}
.u-pc-item {
	display: block;
}
.u-pc-item-inline {
	display: inline;
}
.u-button-detail.basic a {
	font-size: 18px;
}
}
/*-------------------------------------------------------------------

	Header

-------------------------------------------------------------------*/
#header {
	position: fixed;
	width: 100%;
	top: 0;
	left: 0;
	background: rgba(0,0,0,.9);
	padding: 9px 0 0;
	z-index: 500;
}
#header .logo {
	width: 210px;
	margin: 0 auto 2px;
	text-align: center;
}
#header .main-menu::after {
	content: "";
	display: block;
	clear: both;
}
#header .main-menu ul li {
	float: left;
	width: 24.8%;
	margin-right: 0.2666%;
}
#header .main-menu ul li:last-child {
	margin-right: 0;
}
#header .main-menu ul li a {
	display: block;
	padding: .8em 0;
	font-size: 10px;
	line-height: 1;
	text-align: center;
	color: #FFF;
	text-decoration: none;
	border-bottom: 2px solid #e0d39c;
}

/*-------------------------------------------------------------------
	Header TB,PC
-------------------------------------------------------------------*/
@media (min-width: 768px) {
#header {
	position: absolute;
	background: none;
	padding: 0;
}
#header::after {
	content: "";
	display: block;
	clear: both;
}
#header .logo {
	width: 360px;
	margin: 15px 0 0 15px;
	text-align: left;
}
#header .main-menu {
	position: fixed;
	width: auto;
	top: 20px;
	right: 20px;
}
#header .main-menu ul li {
	width: auto;
	margin-right: 4px;
}
#header .main-menu ul li a {
	padding: 1em;
	font-size: 12px;
	border-bottom: none;
	background: rgba(0,0,0,1);
	border-radius: 4px;
}
}

/*-------------------------------------------------------------------
	Header PC
-------------------------------------------------------------------*/
@media (min-width: 992px) {
#header .logo {
	width: 431px;
}
#header .main-menu ul li a {
	font-size: 14px;
}
}
/*-------------------------------------------------------------------

	Mv

-------------------------------------------------------------------*/
#mv .inner {
	padding: 55px 0 0 13px;
	width: 100%;
	height: 100vh;
	box-sizing: border-box;
	overflow: hidden;
}
#mv .inner#mv1 {
	background: url(../img/sp_mv1.jpg) no-repeat center center;
	background-size: cover;
}
#mv .inner#mv2 {
	background: url(../img/sp_mv2.jpg) no-repeat center center;
	background-size: cover;
}
#mv .main-text {
	position: relative;
	top: 50%;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
}
#mv .main-text.white {
	color: #FFF;
}
#mv .main-text.black {
	color: #1c1c1c;
}
#mv .main-text span {
	display: block;
}
#mv .main-text .en {
	margin-bottom: 10px;
	text-shadow: 0 0 6px rgba(0,0,0,.3);
	font-family: "Times New Roman", Times, "serif";
	font-size: 55px;
	line-height: 1;
	font-weight: normal;
}
#mv .main-text .jp {
	margin-left: 4px;
	text-shadow: 0 0 6px rgba(0,0,0,.5);
	font-size: 16px;
	line-height: 1.3;
	font-weight: normal;
}
/*slick*/
.slick-dotted.slick-slider {
	margin-bottom: 0;
}
.slick-dots {
	bottom: 15px;
}
.slick-dots li {
	width: 24px;
	height: 24px;
	margin: 0 10px;
}
.slick-dots li button {
	width: 24px;
	height: 24px;
	padding: 0;
}
.slick-dots li button:before {
	width: 20px;
	height: 20px;
	content: '';
	opacity: 1;
	background: #666;
	border: 2px solid #FFF;
	border-radius: 13px;
}
.slick-dots li.slick-active button:before {
	opacity: 1;
	background: #d04d5a;
}

/*-------------------------------------------------------------------
	Mv TB,PC
-------------------------------------------------------------------*/
@media (min-width: 768px) {
#mv .inner {
	padding: 70px 0 0 56px;
}
#mv .inner#mv1 {
	background: url(../img/pc_mv1.jpg) no-repeat center center;
	background-size: cover;
}
#mv .inner#mv2 {
	background: url(../img/pc_mv2.jpg) no-repeat center center;
	background-size: cover;
}
#mv .main-text .en {
	margin-bottom: 20px;
	font-size: 110px;
	line-height: 1;
}
#mv .main-text .jp {
	font-size: 28px;
}
/*slick*/
.slick-dots {
	bottom: 33px;
}
}
/*-------------------------------------------------------------------

	Contents

-------------------------------------------------------------------*/
.inner-contents {
	padding: 0 4%;
	position: relative;
	line-height: 1.6;
}
.inner-contents::after {
	content: "";
	display: block;
	clear: both;
}
.inner-contents .inner-contents_item {
	position: relative;
	top: 50%;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
	width: 54.0579%;
	margin-left: 2.4637%;
	margin-top: 15px;
}
.inner-contents .inner-contents_item.item-left {
	float: left;
}
.inner-contents .inner-contents_item.item-right {
	float: right;
}
.inner-contents i.en {
	position: relative;
	display: block;
	margin-bottom: 1em;
	color: #b09a77;
	font-size: 15px;
	font-style: normal;
	line-height: 1.3;
	font-family: "Times New Roman", Times, "serif";
}
.inner-contents i.en span.line-top, .inner-contents i.en span.line-bottom {
	position: relative;
	display: block;
	height: 1px;
	background: #1c1c1c;
}
.inner-contents i.en span.line-top {
	width: 22px;
	-webkit-transform-origin: bottom right;
	transform-origin: bottom right;
	-webkit-transform: rotate(45deg) translateX(-10px) translateY(10px);
	transform: rotate(45deg) translateX(-10px) translateY(10px);
}
.inner-contents i.en span.line-bottom {
	width: 7px;
	-webkit-transform-origin: top left;
	transform-origin: top right;
	-webkit-transform: rotate(45deg) translateX(20px) translateY(-15px);
	transform: rotate(45deg) translateX(20px) translateY(-15px);
}
.inner-contents h2 {
	margin-bottom: .5em;
	font-size: 17px;
}
.inner-contents_item > :last-child {
	margin-bottom: 0;
}

@media (min-width: 768px) {
.inner-contents .inner-contents_item {
	width: 56.444%;
	margin-left: 0;
	margin-top: 32px;
}
.inner-contents i.en {
	margin-bottom: 1.2em;
	font-size: 30px;
}
.inner-contents i.en span.line-top, .inner-contents i.en span.line-bottom {
	height: 2px;
}
.inner-contents i.en span.line-top {
	width: 44px;
	-webkit-transform: rotate(45deg) translateX(-16px) translateY(24px);
	transform: rotate(45deg) translateX(-16px) translateY(24px);
}
.inner-contents i.en span.line-bottom {
	width: 14px;
	-webkit-transform: rotate(45deg) translateX(42px) translateY(-26px);
	transform: rotate(45deg) translateX(42px) translateY(-26px);
}
.inner-contents h2 {
	margin-bottom: .5em;
	font-size: 28px;
}
}

@media (min-width: 992px) {
.inner-contents {
	width: 900px;
	margin: 0 auto;
	padding: 0;
}
}
/*-------------------------------------------------------------------

	Intoro

-------------------------------------------------------------------*/
#intro {
	background: #f7f7f9 url(../img/sp_intro_back.jpg) no-repeat center 0;
	background-size: 100% auto;
}
#intro h2 {
	padding-top: 53.6%;
	position: relative;
	font-size: 17px;
}
#intro h2 span {
	position: absolute;
	display: block;
	top: 50%;
	left: 45.8666%;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
}
#intro .intro-nav ul {
	display: -webkit-flex;
	display: -ms-flex;
	display: flex;
	-ms-justify-content: space-between;
	-webkit-justify-content: space-between;
	justify-content: space-between;
	-ms-flex-wrap: wrap;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
}
#intro .intro-nav ul li {
	width: 49.3333%;
	margin: 0 0 .8% 0;
	background: rgba(255,255,255,.8);
}
#intro .intro-nav ul li a {
	display: block;
	border-top: 1px solid #c8b8a0;
	padding: 10px 20px 10px 10px;
	font-size: 12px;
	line-height: 1.3;
	color: inherit;
	text-decoration: none;
	background: url(../img/arrow_brown.png) no-repeat 97% center;
	background-size: 7px;
}
#intro .intro-nav ul li a i {
	display: block;
	margin-bottom: .5em;
	font-style: normal;
	color: #b09a77;
	font-size: 11px;
	font-family: "Times New Roman", Times, "serif";
}

@media (min-width: 768px) {
.inner-contents-intro {
	margin-left: 4%;
	margin-right: 4%;
}
}

@media (min-width: 992px) {
.inner-contents-intro {
	width: 900px;
	margin: 0 auto;
	padding: 0;
}
}

/*-------------------------------------------------------------------
	IntoroTB,PC
-------------------------------------------------------------------*/
@media (min-width: 768px) {
#intro {
	padding: 75px 0 88px;
	background-image: url(../img/pc_intro_back.jpg);
	background-size: auto;
}
#intro h2 {
	padding-top: 0;
	margin-bottom: 97px;
	text-align: center;
	font-size: 34px;
}
#intro h2 span {
	position: static;
	display: inline;
	-webkit-transform: translateY(0);
	transform: translateY(0);
}
#intro .intro-nav {
	width: 64.8888%;
	margin: 0 0 0 auto;
}
#intro .intro-nav ul li {
	width: 46.2328%;
	margin: 0;
	background: none;
}
#intro .intro-nav ul li a {
	padding: 20px 25px 20px 4px;
	font-size: 17px;
	background: url(../img/arrow_brown.png) no-repeat 98% center;
	background-size: 14px;
	-webkit-transition: all 0.4s ease;
	transition: all 0.4s ease;
}
#intro .intro-nav ul li a:hover {
	background-position: 100% center;
	color: #b09a77;
}
#intro .intro-nav ul li:nth-last-child(1), #intro .intro-nav ul li:nth-last-child(2) {
	border-bottom: 1px solid #c8b8a0;
}
#intro .intro-nav ul li a i {
	font-size: 18px;
	margin-bottom: 10px;
}
}
/*-------------------------------------------------------------------

	Expertise

-------------------------------------------------------------------*/
#expertise {
	background: url(../img/sp_expertice_back.jpg) no-repeat right center;
	background-size: cover;
}
#expertise .inner-contents {
	height: 400px;
}

@media (min-width: 768px) {
#expertise {
	background: url(../img/pc_expertice_back.jpg) no-repeat center center;
	background-size: cover;
}
#expertise .inner-contents {
	height: 700px;
}
}
/*-------------------------------------------------------------------

	Revision

-------------------------------------------------------------------*/
#revision {
	background: url(../img/sp_revision_back.jpg) no-repeat center top;
	background-size: cover;
}
#revision .inner-contents {
	height: 450px;
}

@media (min-width: 768px) {
#revision {
	background: url(../img/pc_revision_back.jpg) no-repeat center center;
	background-size: auto;
}
#revision .inner-contents {
	height: 700px;
}
}
/*-------------------------------------------------------------------

	Cost

-------------------------------------------------------------------*/
#cost {
	background: url(../img/sp_cost_back.jpg) no-repeat center center;
	background-size: cover;
}
#cost .inner-contents {
	height: 400px;
}

@media (min-width: 768px) {
#cost {
	background: url(../img/pc_cost_back.jpg) no-repeat center center;
	background-size: cover;
}
#cost .inner-contents {
	height: 700px;
}
}
/*-------------------------------------------------------------------

	Quality

-------------------------------------------------------------------*/
#quality {
	background: #c8b8a0 url(../img/sp_quality_back.jpg) no-repeat center top;
	background-size: cover;
}
#quality .inner-contents {
	height: 400px;
}
#quality .inner-contents i.en span {
	color: #8c7551;
}

@media (min-width: 768px) {
#quality {
	background: #c8b8a0 url(../img/pc_quality_back.jpg) no-repeat center center;
	background-size: auto;
}
#quality .inner-contents {
	height: 700px;
}
}
/*-------------------------------------------------------------------

	One doctor

-------------------------------------------------------------------*/
#one_doctor {
	background: #f9f9f9 url(../img/sp_onedoctor_back.jpg) no-repeat right center;
	background-size: cover;
}
#one_doctor .inner-contents {
	height: 500px;
}

@media (min-width: 768px) {
#one_doctor {
	background: #f9f9f9 url(../img/pc_onedoctor_back.jpg) no-repeat center center;
	background-size: auto;
}
#one_doctor .inner-contents {
	height: 700px;
}
}
/*-------------------------------------------------------------------

	Scar

-------------------------------------------------------------------*/
#scar {
	background: url(../img/sp_scar_back.jpg) no-repeat center center;
	background-size: cover;
	color: #FFF;
}
#scar .inner-contents {
	height: 400px;
}
#scar .inner-contents i.en span {
	color: #cfbfa6;
}
#scar .inner-contents i.en span.line-top, #scar .inner-contents i.en span.line-bottom {
	background: #cccccc;
}
#scar .inner-contents_scar {
	position: relative;
	top: 50%;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
	width: 40%;
	float: left;
}
#scar .inner-contents_scar figure {
	border: 1px solid #FFF;
	overflow: hidden;
	border-radius: 4px;
}
#scar .inner-contents_scar .caption {
	font-size: 8px;
	margin: 1em 0 0;
}
#scar .inner-contents_scar .caption .red {
	color: #ff9999;
}
#scar .inner-contents_scar .caption .yellow {
	color: #ffff00;
}

@media (min-width: 768px) {
#scar {
	background: #f9f9f9 url(../img/pc_scar_back.jpg) no-repeat center center;
	background-size: cover;
	background-attachment: fixed;
}
#scar .inner-contents {
	height: 700px;
}
#scar .inner-contents_scar {
	width: 35.5555%;
}
#scar .inner-contents_scar .caption {
	font-size: 14px;
}
}
/*-------------------------------------------------------------------

	Performance

-------------------------------------------------------------------*/
#performance {
	background: url(../img/sp_performance_back.jpg) no-repeat center center;
	background-size: cover;
}
#performance .inner-contents {
	height: 500px;
}

@media (min-width: 768px) {
#performance {
	background: url(../img/pc_performance_back.jpg) no-repeat center center;
	background-size: auto;
}
#performance .inner-contents {
	height: 700px;
}
}
/*-------------------------------------------------------------------

	Patient first

-------------------------------------------------------------------*/
#patient_first {
	background: #efefef url(../img/sp_patient_back.jpg) no-repeat center center;
	background-size: cover;
}
#patient_first .inner-contents {
	height: 400px;
}

@media (min-width: 768px) {
#patient_first {
	background: #efefef url(../img/pc_patient_back.jpg) no-repeat center center;
	background-size: auto;
}
#patient_first .inner-contents {
	height: 700px;
}
}
/*-------------------------------------------------------------------

	Doctor

-------------------------------------------------------------------*/
#doctor .inner-contents {
	padding-top: 35px;
	padding-bottom: 20px;
}
#doctor .inner-contents h2 {
	margin-bottom: 1.5em;
	font-family: "Times New Roman", Times, "serif";
	font-weight: normal;
	font-size: 15px;
	text-align: center;
}
#doctor .inner-contents h2 span {
	padding: 0 .2em .2em;
	display: inline-block;
	border-bottom: 2px solid #1c1c1c;
}
#doctor .inner-contents .doctor_name {
	margin-bottom: .5em;
	font-size: 14px;
	font-weight: bold;
	text-align: center;
}
#doctor .inner-contents .doctor_lead {
	font-size: 13px;
	margin-bottom: 2em;
}
#doctor .inner-contents .doctor_profile {
	margin: 0 0 0 -4.3478%;
}
#doctor .inner-contents .doctor_profile::after {
	content: "";
	display: block;
	clear: both;
}
#doctor .inner-contents .doctor_profile .doctor_photo {
	width: 41.6666%;
	position: relative;
	float: left;
}
#doctor .inner-contents .doctor_profile .doctor_photo .sign {
	width: 54.6666%;
	position: absolute;
	bottom: -30px;
	right: 0;
}
#doctor .inner-contents .doctor_profile .doctor_data {
	width: 54.1666%;
	float: right;
	font-size: 9px;
	line-height: 1.5;
}
#doctor .inner-contents .doctor_profile .doctor_data .button-crf {
	width: 51.15%;
	margin-bottom: 1em;
}
#doctor .inner-contents .doctor_profile .doctor_data .box {
	display: inline-block;
	background: #efefef;
	padding: 1em;
	border-radius: 4px;
}
#doctor .inner-contents .doctor_profile .doctor_data dl dt {
	clear: left;
	float: left;
	width: 5em;
}
#doctor .inner-contents .doctor_profile .doctor_data dl dd {
	padding: 0 0 .5em 5em;
}

@media (min-width: 768px) {
#doctor .inner-contents {
	padding-top: 70px;
	padding-bottom: 44px;
}
#doctor .inner-contents h2 {
	font-size: 30px;
}
#doctor .inner-contents h2 span {
	border-bottom-width: 3px;
}
#doctor .inner-contents .doctor_name {
	font-size: 20px;
}
#doctor .inner-contents .doctor_lead {
	font-size: 20px;
}
#doctor .inner-contents .doctor_profile {
	margin: 0;
}
#doctor .inner-contents .doctor_profile .doctor_photo {
	width: 34.2222%;
}
#doctor .inner-contents .doctor_profile .doctor_photo .sign {
	width: 39.6103%;
}
#doctor .inner-contents .doctor_profile .doctor_data {
	width: 60.2222%;
	font-size: 16px;
}
#doctor .inner-contents .doctor_profile .doctor_data .button-crf {
	width: auto;
}
#doctor .inner-contents .doctor_profile .doctor_data .pc-small {
	font-size: 14px;
}
}
/*-------------------------------------------------------------------

	Contact

-------------------------------------------------------------------*/
.contact {
	background: #1c1c1c;
	color: #FFF;
}
.contact nav::after {
	content: "";
	display: block;
	clear: both;
}
.contact nav {
	padding: 15px 10px 10px;
	box-sizing: border-box;
}
.contact nav h3 {
	margin-bottom: 1em;
	text-align: center;
	font-size: 12px;
}
.contact nav ul li {
	float: left;
	width: 31.8309%;
	margin-right: 2.2535%;
}
.contact nav ul li:last-child {
	margin-right: 0;
}
.contact nav ul li a, .contact nav ul li span {
	display: block;
}
.contact nav ul li.tel, .contact nav ul li.reservation, .contact nav ul li.consultation {
	border-radius: 4px;
	overflow: hidden;
	text-align: center;
}
.contact nav ul li.tel {
	background: #FFF;
}
.contact nav ul li.reservation {
	background: #9a2224;
}
.contact nav ul li.consultation {
	background: #907a56;
}

@media (min-width: 768px) {
.contact nav {
	padding: 5% 4%;
	box-sizing: border-box;
}
.contact nav h3 {
	font-size: 22px;
}
.contact nav ul li {
	width: 32.4444%;
	margin-right: 1.3333%;
}
}

@media (min-width: 992px) {
.contact nav {
	width: 900px;
	margin: 0 auto;
	padding: 65px 0 60px;
}
}
/*-------------------------------------------------------------------

	Footer

-------------------------------------------------------------------*/
#footer {
	padding: 6px 0 32px;
	background: #1c1c1c;
	color: #FFF;
	text-align: center;
	font-size: 9px;
}
#footer .pagetop {
	width: 22px;
	margin: 0 auto 1em;
}

@media (min-width: 768px) {
#footer {
	padding: 10px 0 66px;
	font-size: 14px;
}
#footer .pagetop {
	width: 42px;
}
}
/*-------------------------------------------------------------------

	Animation

-------------------------------------------------------------------*/
.a-hidden {
	opacity: 0;
	visibility: hidden;
}
/*---------------basic fade---------------*/
/*fast*/
.a-fade-in {
	-webkit-animation-name: fade-in;
	-webkit-animation-duration: .5s;
	-webkit-animation-timing-function: ease-in;
	-webkit-animation-iteration-count: 1;
	animation-name: fade-in;
	animation-duration: .5s;
	animation-timing-function: ease-in;
	animation-iteration-count: 1;
}
@-webkit-keyframes fade-in {
 0% {
 opacity:0;
 visibility: hidden;
}
 100% {
 opacity:1;
 visibility: visible;
}
}
@keyframes fade-in {
 0% {
 opacity:0;
 visibility: hidden;
}
 100% {
 opacity:1;
 visibility: visible;
}
}
/*slow*/
.a-fade-in-slow {
	-webkit-animation-name: fade-in-slow;
	-webkit-animation-duration: 1s;
	-webkit-animation-timing-function: ease-in;
	-webkit-animation-iteration-count: 1;
	animation-name: fade-in-slow;
	animation-duration: 1s;
	animation-timing-function: ease-in;
	animation-iteration-count: 1;
}
@-webkit-keyframes fade-in-slow {
 0% {
 opacity:0;
 visibility: hidden;
}
 100% {
 opacity:1;
 visibility: visible;
}
}
@keyframes fade-in-slow {
 0% {
 opacity:0;
 visibility: hidden;
}
 100% {
 opacity:1;
 visibility: visible;
}
}
/*---------------mv fade---------------*/
.a-mv-fade-in {
	-webkit-animation-name: mv-fade;
	animation-name: mv-fade;
	-webkit-animation-duration: .6s;
	animation-duration: .6s;
	-webkit-animation-timing-function: ease-in;
	animation-timing-function: ease-in;
	-webkit-animation-iteration-count: 1;
	animation-iteration-count: 1;
}
@-webkit-keyframes mv-fade {
 0% {
 opacity:0;
 visibility: hidden;
 -webkit-transform:translateX(10px);
 transform:translateX(10px);
 letter-spacing: 2px;
}
 100% {
 opacity:1;
 visibility: visible;
 -webkit-transform:translateX(0px);
 transform:translateX(0px);
 letter-spacing: 0px;
}
}
@keyframes mv-fade {
 0% {
 opacity:0;
 visibility: hidden;
 -webkit-transform:translateX(10px);
 transform:translateX(10px);
 letter-spacing: 2px;
}
 100% {
 opacity:1;
 visibility: visible;
 -webkit-transform:translateX(0px);
 transform:translateX(0px);
 letter-spacing: 0px;
}
}
/*---------------intro---------------*/
.a-introtitle-fade-in {
	-webkit-animation-name: introtitle-fade-in;
	animation-name: introtitle-fade-in;
	-webkit-animation-duration: .5s;
	animation-duration: .5s;
	-webkit-animation-timing-function: ease-in;
	animation-timing-function: ease-in;
	-webkit-animation-iteration-count: 1;
	animation-iteration-count: 1;
}
@-webkit-keyframes introtitle-fade-in {
 0% {
 opacity:0;
 visibility: hidden;
 letter-spacing: -3px;
}
 100% {
 opacity:1;
 visibility: visible;
 letter-spacing: 0px;
}
}
@keyframes introtitle-fade-in {
 0% {
 opacity:0;
 visibility: hidden;
 letter-spacing: -3px;
}
 100% {
 opacity:1;
 visibility: visible;
 letter-spacing: 0px;
}
}
/*---------------contents common animation---------------*/
/*linetop*/
.a-linetop-fade-in, .a-linebottom-fade-in {
	-webkit-animation-duration: .5s;
	animation-duration: .5s;
	-webkit-animation-timing-function: ease-in;
	animation-timing-function: ease-in;
	-webkit-animation-iteration-count: 1;
	animation-iteration-count: 1;
}
.a-linetop-fade-in {
	-webkit-animation-name: linetop-fade;
	animation-name: linetop-fade;
}
@-webkit-keyframes linetop-fade {
 0% {
 opacity:0;
 visibility: hidden;
 top:-50px;
 left:-50px;
}
 100% {
 opacity:1;
 visibility: visible;
 top:0px;
 left:0px;
}
}
@keyframes linetop-fade {
 0% {
 opacity:0;
 visibility: hidden;
 top:-50px;
 left:-50px;
}
 100% {
 opacity:1;
 visibility: visible;
 top:0px;
 left:0px;
}
}
/*linebottom*/
.a-linebottom-fade-in {
	-webkit-animation-name: linebottom-fade;
	animation-name: linebottom-fade;
}
@-webkit-keyframes linebottom-fade {
 0% {
 opacity:0;
 visibility: hidden;
 top:50px;
 left:50px;
}
 100% {
 opacity:1;
 visibility: visible;
 top:0px;
 left:0px;
}
}
@keyframes linebottom-fade {
 0% {
 opacity:0;
 visibility: hidden;
 top:50px;
 left:50px;
}
 100% {
 opacity:1;
 visibility: visible;
 top:0px;
 left:0px;
}
}
