@charset "UTF-8";
/* CSS Document */

@font-face {
    font-family: 'Noto Sans JP';
    font-style: normal;
    font-weight: normal;
    src: local("Noto Sans CJK JP Regular"),
    url('./font/NotoSans_Regular.woff2') format('woff2'),
    url('./font/NotoSans_regular.woff') format('woff'),
    url('./font/NotoSans_regular.otf') format('opentype');
}
@font-face {
    font-family: 'Noto Sans JP';
    font-style: normal;
    font-weight: bold;
    src: local("Noto Sans CJK JP Bold"),
    url('./font/NotoSans_Bold.woff2') format('woff2'),
    url('./font/NotoSans_bold.woff') format('woff'),
    url('./font/NotoSans_bold.otf') format('opentype');
}
@font-face {
    font-family: "YakuHanJP";
    font-style: normal;
    font-weight: normal;
    src: url("./font/YakuHanJP-Regular.woff2") format("woff2"),
    url("./font/YakuHanJP-Regular.woff") format("woff");
}
@font-face {
    font-family: "YakuHanJP";
    font-style: normal;
    font-weight: bold;
    src: url("./font/YakuHanJP-Bold.woff2") format("woff2"),
    url("./font/YakuHanJP-Bold.woff") format("woff");
}

/* ---------------------------------*/
@media screen and (max-width: 559px) {
	body {
	font-family: 'YakuHanJP','Noto Sans JP',"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "游ゴシック", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	color: rgba(59,64,67,1.00);
	text-size-adjust: 100%;
	position: relative;
	z-index: 1;
	}

	.wrapper {
		position: absolute;
		top: -8px;
		left: -8px;
		max-width: 559px;
		width: 100vw;
	}
}



.f--min {
	font-family: YakuHanMP, 游明朝, "Yu Mincho", 游明朝体, YuMincho, "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", HiraMinProN-W3, HGS明朝E, "ＭＳ Ｐ明朝", "MS PMincho", serif;
	color: rgba(59,64,67,1.00);
}

a {
	text-decoration: none;
	color:rgba(120,120,120,1.00);
	transition: color 0.3s;
}

a:hover {
	color: white;
}


.bar-sn-nv .current {
	color:#c40069;
}

/* -----TOP/背景画像タイル部分----------------------------*/
@media screen and (max-width: 559px) {
	.top {
		position: relative;
		width: 100%;
		height: 100vh;
		overflow: hidden;

	}
	.top-img {
		position: absolute;
		top: 60px;
		right: 0;
		left: 0;
		width: 100%;
		height: auto;
		margin: auto;
	}
	.top-img-up img {
		display: table-cell;
		position: relative;
		width: 100%;
		height: 25vh;
		left: 0;
		right: 0;
		margin-left: auto;
		margin-right: auto;
		object-fit: cover;
		object-position: 20% 65%;
		vertical-align: bottom;
	}
	.top-img-left img {
		display: table-cell;
		float: left;
		width: 50%;
		height: 25vh;
		object-fit: cover;
		object-position:  98% 0;
	}
	.top-img-right img {
		display: table-cell;
		float: left;
		width: 50%;
		height: 25vh;
		object-fit: cover;
		object-position: 73% 0;
	}
	.top-img-up::after {
		content: '';
		background-color: rgba(217,50,131,.5);
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
	}

	/* -----TOP/シルエット花部分----------------------------*/

	.top-bg-flower img {
		position: fixed;
		width: 300px;
		top: 490px;
		right: -80px;
		z-index: -5;
		overflow: hidden;
	}

	/* -----TOP/メイン花画像部分----------------------------*/

	.top-img-flower {
		position: relative;
		width: 100%;
		height: 100%;
		z-index: 80;
	}

	.top-img-flower-in {
		position: absolute;
		left: 0;
		right: 0;
		top: 18%;
		margin: auto;
	}

	.top-img-flower-in img {
		width: auto;
		height: 33vh;
		position: absolute;
		left: 0;
		right: 0;
		margin: auto;

	}

	/* -----TOP/テキスト部分----------------------------*/

	.top-text {
		position: absolute;
		bottom: 8vh;
		left: 0;
		right: 0;
		margin: auto;
		z-index: 90;
		width: 100%;
		word-wrap: break-word;
	}

	.top-text-main {
		color:rgba(33,36,40,1.00);
		font-size: 15vw;
		line-height: 0.9em;
		font-family: "Arial Black", Gadget, "sans-serif";
	}

	.top-text-center {
		width: 85%;
		margin-right: auto;
		margin-left: auto;
	}

	.pont-color {
		color: #c40069;
	}

	.top-text-sub {
		width: 300px;
		margin-top: -35px;
		margin-right: auto;
		margin-left: auto;
		font-size: 16px;
		line-height: 1.5em;
	}

	/* -----TOP/スクロール部分----------------------------*/
	.top-text-scroll {
		position: absolute;
		height: 200px;
		bottom: -110px;
		left: 0;
		right: 0;
		margin-right: auto;
		margin-left: auto;
	}

	.top-text-scroll-in p {
		font-family: 'lato', sans-serif;
		position: absolute;
		top: 15px;
		left: 0;
		right: 0;
		margin-left: auto;
		margin-right: auto;
		text-align: center;
		font-size: 14px;
		font-weight: 400;
		color: rgba(33,36,40,1.00);
		letter-spacing: .25em;
		z-index: 5;
	}

	.top-text-arrow {
		width: 1px;
		height: 40px;
		margin: 50px auto 0;
		background-color: #eee;
		position: relative;
		overflow: hidden;
	}

	.top-text-arrow::before {
		content: '';
		width: 1px;
		height: 40px;
		margin: 50px auto 0;
		background-color: rgba(33,36,40,1.00);
		position: absolute;
		top:  -150px;
		left: 0;
		-webkit-animation: top-text-arrow 2.5s ease 0s infinite normal;
		animation: top-text-arrow 2.5s ease 0s infinite normal;
	}
}

@keyframes top-text-arrow {
	0% {
		-webkit-transform: tranlate3d(-50%, 0, 0);
		transform: translate3d(-50%, 0, 0);
	}

	60% {
		-webkit-transform: tranlate3d(-50%, 100px, 0);
		transform: translate3d(-50%, 100px, 0);
	}

	100% {
		-webkit-transform: tranlate3d(-50%, 100px, 0);
		transform: translate3d(-50%, 100px, 0);
	}
}


/* -----Mission部分----------------------------*/
@media screen and (max-width: 559px) {
	.mission {
		width: 100%;
		height: 100%;
		margin-bottom: 4rem;
		display: flex;
		flex-wrap: wrap;
		overflow: hidden;
		position: relative;
	}

	.mission-img {

		width: 100vw;
		height: 30vh;
		top: 60px;
		order: 1;
	}
	.mission-img-in img {
		width: 100vw;
		height: 30vh;
		object-fit: cover;
		object-position: 45% 50%;
	}
	.mission-img::after {
		content: '';
		background-color: rgba(217,50,131,.5);
		width: 100vw;
		height: 30vh;
		position: absolute;
		left: 0;
		right: 0;
		top: 0;
		bottom: 0;
	}

	.mission-tbx {
		width: 100vw;
		padding-left: 40px;
		order: 2;
	}

	.mission-ttl, .bs-ttl {
		margin-bottom: -0.1rem;
		line-height: 1.2em;
	}

	.st-main,.st-main2 {
		font-size: 30px;
		color:rgba(33,36,40,1.00);
		font-family: "Arial Black", Gadget, "sans-serif";
		margin-right: 0.2rem;

	}
	.st-main span,.sm-red {
		color: #c40069;
	}
	.st-sub {
		font-size: 16px;
		color:rgba(33,36,40,1.00);
	}
	.mission-line, .bs-line {
		margin-bottom: 0.1rem 0 10px;
	}
	.mission-line-b, .bs-line-b {
		height: 2px;
		background-color: #c40069
	}

	.mission-in {
		padding: 0 40px;
		order: 3;
	}


	.mission-sub {
		font-size: 18px;
		word-break: keep-all;
		line-height: 1.2em;
		color:rgba(33,36,40,1.00);
	}

	.mission-p {
		font-size: 12px;
		word-break: break-word;
		line-height: 1.5rem;
		margin: 1rem 0 0;
	}
}

/* -----ビジネス部分----------------------------*/
	/* ------------タイトル・ナビ部分---------------*/
@media screen and (max-width: 559px) {
	.business {
		width: 100%;
		height: 100%;
		display: flex;
		flex-wrap: wrap;
		overflow: hidden;
	}

	.mgl-10 {
		margin-left: 60px;
	}

	.bs-tbx, .ha-tbx, .me-tbx {
		width: 100vw;
		padding-left: 40px;
		margin-top: 60px;
	}

	.bs-sl,.slick-arrow {
		display: none;
	}

	.bs-sl-con-one {
		width: 100vw;
		position: relative;

	}

	.bs-sl-con-one-img {
		width: 100vw;
		padding: 0rem;
		left: 0;
		right: 0;
		margin-top: 1rem;
	}

	.bs-sl-con-one-title {
		width: 100vw;
		text-align: center;
		margin: 15px 0;
	}
	.st-svg {
		position: relative;
		top: -70px;
		width: 55vw;
		margin-bottom: -160px;
	}

	.bs-sl-one-read {
		width: 100vw;
		margin-bottom: 50px;
	}
	.bs-sl-one-read p {
		padding: 0 40px;
		font-size: 12px;
		line-height: 2.1;
	}

	.bs-sl-con-one-img_recos {
		width: 70vw;
		position: absolute;
		top: 36vw;
		left: 0;
		right: 0;
		margin: auto;
	}
}


/* -----Handling部分----------------------------*/
@media screen and (max-width: 559px) {
	.handling {
		width: 100%;
		height: 100%;
		margin-bottom: 4rem;
		display: flex;
		flex-wrap: wrap;
		overflow: hidden;
	}
}

/* -----Massage部分----------------------------*/
@media screen and (max-width: 559px) {
	.message {
		width: 100%;
		height: 100%;
		display: flex;
		flex-wrap: wrap;
		overflow: hidden;
	}

	.me-con {
		width: 100vw;
		height: 100%;
		position: relative;
	}

	.me-img-in {

		width: 100vw;
		height: 50vw;
		object-fit: cover;
		object-position: 0 34%;

		margin-top: 1rem;

	}


	.me-text {
		padding: 0 40px;
		margin-top: 20px;
		margin-bottom: 50px;
	}
	.me-sub {
		font-size: 17px;
		line-height: 1.9;
		color:rgba(33,36,40,1.00);
	}
	.me-p {
		font-size: 12px;
		line-height: 2.1;
		margin: 1rem 0 0;
	}
	.me-name {
		font-size: 14px;
	}

	.me-sign {
		width: 50vw;
		display: block;
		margin:1rem 0 0 auto;
	}

}
/* -----Company部分----------------------------*/
@media screen and (max-width: 559px) {
	.company {
		width: 100%;
		height: 100%;
		display: flex;
		flex-wrap: wrap;
		overflow: hidden;
	}

	.co-list {
		width: 100vw;
		padding: 20px 40px;
	}

	.co-list-one {
		position: relative;
		margin: 25px 0;
	}
	.co-list-one a{
		color: #0F8491;
	}

	.co-list-one-ln {
		width: 100%;
		height: 1px;
		position: absolute;
		top: 0;
		left: 0;
		background-color: #C1C0C0;
	}

	.co-list-one-dt {
		color:#c40069;
		font-size: 14px;
		padding-top: 1.7rem
	}

	.co-list-one-dd {
		font-size: 12px;
		line-height: 1.5;
		margin-left: 0;
	}
}
/* -----Access部分----------------------------*/
@media screen and (max-width: 559px) {
	.access {
		width: 100%;
		height: 100%;
		display: flex;
		flex-wrap: wrap;
		overflow: hidden;
	}

	.ac-sl {
		width: 100vw;
		height: 100%;
	}

	.ac-al-stage-one {
		margin: 30px 0;
	}

	.ac-al-stage-im {
		width: 100%;
		height: 150px;
		background-color: #3B4043;
	}
	.ac-al-stage-im img {
		height: 100%;
		width: 37vw;
		float: left;
	}
	.ac-al-stage-im-tx-in {
		color: white;
		height: 100%;
		display:inline-block;
		vertical-align: middle;
		margin: 10px;
	}
	.ac-name {
		font-size: 1.0rem;
		font-weight: bold;
	}
	.ac-ad {
		font-size: 0.7rem;
		word-wrap: break-word;
	}

	.ac-al-stage-map {
		margin: 0 auto;
		position: relative;
		width: 100%;
		padding-top: 56.25%;
	}
	.ac-al-stage-map iframe {
		position: absolute;
		top: 0;
		left: 0;
		width: 100% !important;
		height: 100% !important;
	}
}
/* -----Contact部分----------------------------*/
@media screen and (max-width: 559px) {
	.contact {
		width: 100vw;
		height: 700px;
		margin-top: -30px;
		position: relative;
		overflow: hidden;
	}

	.con-bg img {
		background-size: cover;
	}

	.con-sl {
		position: absolute;
		top: 30px;
		left: 0;
		right: 0;
		margin: auto;
		color: white;
		padding: 0 25px;
		display: flex;
		flex-direction: column;
	}

	.con-sl p {
		display: block;
	}

	.con-ttl {
		text-align: center;
		margin: 30px 0 10px;
		order: 1;

	}

	.con-office-tex {
		order: 2;
		font-size: 0.75rem;
		line-height: 1.5;
		text-align: center;
		word-break: keep-all;
		display: block;
		margin-bottom: 10px;
	}

	.con-sl-con {
		order: 3;
	}

	.contact-main {
		font-size: 2rem;
		color: white;
		font-family: "Arial Black", Gadget, "sans-serif";
		margin-right: 1rem;
		left: 0;
		right: 0;
		margin: auto;
		display: block;
	}
	.contact-main span, .con-office-ti {
		color: #c40069;
	}

	.contact-sub {
		color: white;
		font-size: 0.8rem;
		line-height: 1.5;
		text-align: center;
		word-break: keep-all;
		display: block;
	}



	.con-sl-stage {

	}

	.con-sl-stage-one {
		width: 80vw;
		margin: 15px auto;
		padding: 3px 0;
		border: 1px solid #c40069;
		text-align: center;
	}

	.con-office {
		text-align: center;
		vertical-align: middle;
	}
	.con-office p {
		line-height: 0.5rem;
		font-size: 0.9rem;
	}
	.copy-contact {
		display: inline-block;
		margin: 25px auto;
	}
}


/* -----サイドメニュー部分----------------------------*/
@media screen and (max-width: 559px) {
	header {
		background-color: #212428;
		position: fixed;
		left: 0;
		right: 0;
		top: 0;
		width: 100vw;
		height: 40px;
		z-index: 100;
		padding: 10px;
	}

	/*---ハンバーガーメニュー形・動作---*/
	#nav-drawer {
		position: relative;
		width: 100vw;
		height: 100%;
	}

	.nav-unshown {
		display: none;
	}

	.nav-position {
		position: absolute;
		top: 10px;
		right: 30px;
	}

	label {
		cursor: pointer;
		z-index: 120;
	}

	#nav-open, #nav-open span {
		display: inline-block;
		transition: all .4s;
		box-sizing: border-box;
	}
	#nav-open {
		position: relative;
		width: 35px;
		height: 24px;
	}
	#nav-open span {
		position: absolute;
		width: 100%;
		height: 4px;
		background-color: white;
		border-radius: 4px;
	}
	#nav-open span:nth-of-type(1) {
		top: 0;
	}
	#nav-open span:nth-of-type(2) {
		top: 10px;
	}
	#nav-open span:nth-of-type(3) {
		bottom: 0;
	}

	#nav-open.active span:nth-of-type(1) {
		-webkit-transform: translateY(10px) rotate(-45deg);
		transform: translateY(10px) rotate(-45deg);
	}
	#nav-open.active span:nth-of-type(2) {
		opacity: 0;
	}
	#nav-open.active span:nth-of-type(3) {
		-webkit-transform: translateY(-10px) rotate(45deg);
		transform: translateY(-10px) rotate(45deg);
	}
	/*---ハンバーガーメニュー形・動作/END---*/
	/*---メニュー部分---*/
	#nav-content {
		width: 100%;
		height: 100%;
		color: White;
		font-size: 29px;
		letter-spacing: 0.05em;
		font-family: 'passion', sans-serif;
		background-color: rgba(0,0,0,0.8);
		position: fixed;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		z-index: 101;
		display: flex;
		flex-direction: column;
		justify-content: center;
		padding-left: 10vw;
		transform: translateX(-100%);
		transition: transform .6s cubic-bezier(0.23, 1, 0.32, 1);
	}
	.open #nav-content {
		transform: translateX(0);
	}

	#nav-content a {
		cursor: pointer;
		display: inline-block;
		color: #666;
		text-decoration: none;
		padding: 10px 0;
		transition: color .6s ease;
	}
	#nav-content a:hover {
		color: white;
	}
	#nav-content ul {
		list-style-type: none;
	}

	#nav-content li {
		  transform: translateX(-80%);
		  transition:  transform .5s ease-out;
		  position: relative;
	}

	#nav-content li:after {
				content: "";
				display: block;
				width: 100vw;
				height: 2px;
				background-color: #c40069;
				position: absolute;
				transform: translateX(-130vw);
				transition: transform 1s ease;
			}
	#nav-content ul li:hover:after {
			transform: translateX(-40vw);
			}

	#nav-content ul li:nth-child(2) {
			transition-delay: .1s;
			}
	#nav-content ul li:nth-child(3) {
			transition-delay: .2s;
			}
	#nav-content ul li:nth-child(4) {
			transition-delay: .3s;
			}
	#nav-content ul li:nth-child(5) {
			transition-delay: .4s;
			}
	#nav-content ul li:nth-child(6) {
			transition-delay: .5s;
			}
	#nav-content ul li:nth-child(7) {
			transition-delay: .6s;
			}
	#nav-content ul li:nth-child(8) {
			transition-delay: .7s;
			}


	.open {
		overflow: hidden;
	}

	.open #nav-content li {
		transform: translateX(0);
	}

	.nav-bg {
		opacity: 0;
		position: fixed;
		left: 0;
		right: 0;
		top: 0;
		bottom: 0;
		z-index: 1;
		transition: all 1s ease;
	}
	/*---メニュー部分/END---*/

	.bar-sn-lg-in {
		position: fixed;
		top: 20px;
		left: 10px;
		z-index: 100;
	}
	.bar-sn-lg-in img {
		width: 90px;
	}

	.bar-sn-copy {
		color: #6E6E6E;
		font-size: 11px;
		width: 100%;
		position: absolute;
		bottom: 0;
		left: 0;
		text-align: center;
	}
	.copy-menu {
		display: none;
	}


	.bar-sn-nv li {
		margin-top: 2.5vh;
		width: 100%;
		list-style-type: none;
	}


/* -----ローディング画面部分------------*/

	.loading {
		position: fixed;
		z-index: 100;
		top: 0;
		right: 0;
		bottom: 0;
		left: 0;
		background: #fff;
	}
	.loading__img {
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
	}

}