@charset "UTF-8";


/*
//header 200
//gnavi 300
*/

@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;500&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Cormorant:wght@400;600&family=Noto+Sans+JP:wght@400;500&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Cormorant:wght@400;600&family=Noto+Serif+JP&display=swap');


#loading {
	position: fixed;
	top: 0;
	left: 0;
	z-index: 9999;
}
#loading .loadingcont {
	position: fixed;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	text-align: center;
	font-size: 2rem;
	color: #000;
	z-index: 10;
}
#loading .loadingcont img {
	width: 30%;
}
#loading .loadingbg {
	position: fixed;
	top: 0;
	left: 0;
	width: 100vw;
	height: 100vh;
	transition: all 1s;
	background: #f6f1eb;
}
#loading.loaded .loadingcont,
#loading.loaded .loadingbg {
	opacity: 0;
}
#loading svg {
	position: fixed;
	top: 0;
	right: 0;
	width: 100%;
}
/* #loading.loaded #pathsvg {
	filter: drop-shadow(-20px 0 20px #f6f1eb);
}
#loading.loaded #pathsvg2 {
	filter: drop-shadow(-20px 0 20px #eae2d4);
}
#loading.loaded #pathsvg3 {
	filter: drop-shadow(-20px 0 20px #ceae99) blur(10px);
} */

#loading #path {
	fill: #f6f1eb;
	stroke: none;
	animation-timing-function: linear;
	animation-fill-mode: forwards;
	opacity: .8;
}

#loading #path2 {
	fill: #eae2d4;
	stroke: none;
	animation-timing-function: linear;
	animation-fill-mode: forwards;
	opacity: .8;
}
/*
#loading.loaded #path3 {
	transform-box:fill-box;
	transform-origin: right;
	text-align: right;
	d: path('m100,100H0l.12-22.3-.12-27.03.28-27.91L0,0h100v100Z');
	fill: #ceae99;
	stroke: none;
	animation-name: path3;
	animation-duration: .8s;
	animation-timing-function: linear;
	animation-fill-mode: forwards;
	opacity: .2;
}
@keyframes path3 {
	1% {
		d: path('m100,100H19.76s-1.47-14.95-1.47-22.3-6.59-17.8-6.59-26.7,4.1-21.09,4.1-28.24S6.87,0,6.87,0h93.13v100Z');
	}
	25% {
		d: path('m100,100H28.7s2.05-14.95,2.05-22.3-3.96-17.8-3.96-26.7-4.69-21.09-4.69-28.24S20.35,0,20.35,0h79.65v100Z');
	}
	50% {
		d: path('m100,100h-47.13s6.89-14.95,6.89-22.3-14.94-17.8-14.94-26.7,6.59-21.09,6.59-28.24-1.32-22.76-1.32-22.76h49.91v100Z');
	}
	75% {
		d: path('m100,100h-32.77s-6.01-14.95-6.01-22.3,13.04-17.8,13.04-26.7-7.24-23.87-12.89-28.24C52.58,15.96,56.68,0,56.68,0h43.32v100Z');
	}
	95% {
		d: path('m100,100h-2.73s-4.25-14.95-4.25-22.3-1.17-17.8-1.17-26.7,8.59-23.87,2.93-28.24c-8.79-6.8-4.69-22.76-4.69-22.76h9.91v100Z');
	}
	100% {
	d: path('m106.09,100h-2.82s-.29-14.95-.29-22.3-2.18-17.8-2.18-26.7,1.45-21.09,1.45-28.24.44-22.76.44-22.76h3.4v100Z');
	}
}
*/


html {
	width: 100%;
	height: 100%;
	/* overflow: auto; */
	font-size: 62.5%;
}

body {
	font-family: 'Noto Sans JP','Yu Gothic Medium', '游ゴシック Medium', YuGothic, 'Hiragino Sans','Hiragino Kaku Gothic ProN', '游ゴシック体',"segoe ui",'メイリオ', Meiryo,'ＭＳ Ｐゴシック','MS PGothic', sans-serif;
	font-size: 1.4rem;
	font-weight: lighter;
	line-height: 2;
	position: relative;
	/* overflow: hidden; */
	background: #f6f1eb;
	color: #666;
	padding-top: 95px;
}

html.op, body.op {
	overflow: hidden;
	height: 100%;
}

a {
	color: #666;
	text-decoration: none;
}

a:hover img {
	opacity: .8;
}

img {
	vertical-align: bottom;
}

p {
	padding-bottom: 1em;
	line-height: 2;
}

.ctr {
	text-align: center;
}

.brsp {
	display: none;
}

.brpc {
	display: block;
}

.clearfix::after {
	content: "";
	clear: both;
	display: table;
}

#sideoc {
	position: fixed;
	bottom: 30px;
	right: 40px;
	width: 130px;
	z-index: 299;
}

#btmreq {
	display: none;
}

#cvarea {
	position: fixed;
	right: 0;
	top: 160px;
	z-index: 300;
}

#cvarea a img {	
opacity: .8;	
}	
#cvarea a:hover img {	
opacity: 1;	
}

header#fixhead.trans {
	height: 50px;
	padding: 10px 0;
}

header#fixhead.trans img {
	width: 90px;
}

header {
	background: #f6f1eb;
	border-bottom: 1px solid #c4c4c4;
	position: fixed;
	top: 0;
	width: 100%;
	height: 95px;
	box-sizing: border-box;
	z-index: 200;
	transition: all 0.1s ease-out;
	z-index: 301;
	padding: 32px 0;
	text-align: center;
}

header img {
	width: 110px;
}



/* 
hamburger(ハンバーガーアイコン)
=================================== */

#js-hamburger {
	top: 20px;
}
#js-hamburger.trans {
	top: 0px;
}
.hamburger {
	position: absolute;
	left: 20px;
	top: 20px;
	width: 58px;
	height: 40px;
	cursor: pointer;
	z-index: 300;
	transition: all 0.1s ease-out;
}

.hamburger span {
	position: absolute;
	width: 58px;
	height: 3px;
	left: 0;
	background-color: #333;
	transition: all 0.5s;
}

.hamburger span:first-child {
	top: 16px;
}
.hamburger span:last-child {
	top: 34px;
}

/*ハンバーガーがクリックされたら*/
.open .hamburger span:first-child {
	transform: rotate(-25deg);
	top: 24px;
	width: 38px;
}

.open .hamburger span:last-child {
	transform: rotate(25deg);
	top: 24px;
	width: 38px;
}

/* sp-nav(ナビ)
=================================== */
.sp-nav {
	position: fixed;
	left: -100%;
	top: 0;
	width: 400px;
	height: 100vh;
	background: #f6f1eb;
	transition: all 0.3s;
	transition-delay: 250ms;
	z-index: 200;
	overflow-y: auto; /* メニューが多くなったらスクロールできるように */
}

/*ハンバーガーがクリックされたら右からスライド*/
.open .sp-nav {
	left: 0;
}

.sp-nav ul {
	text-align: left;
	padding: 80px 40px 0;
}
.sp-nav li:first-child {
	border-top: 1px solid #ccc;
}
.sp-nav li {
	border-bottom: 1px solid #ccc;
	font-size: 1.4rem;
}
.sp-nav li a,
.sp-nav li .acmenu {
	display: block;
	padding: 10px 0;
	cursor: pointer;
	position: relative;
	font-family: 'Cormorant', serif;
	font-size: 2rem;
}
.sp-nav li a span,
.sp-nav li .acmenu span {
	font-size: 1.4rem;
	font-family: 'Noto Sans JP', serif;
}
.sp-nav li .acmenu.is-active {
	font-weight: bold;
}
.sp-nav li .acmenu:after {
	content: "";
	border-top: 1px solid #999;
	border-right: 1px solid #999;
	display: inline-block;
	width: 10px;
	height: 10px;
	transform: translateY(-50%) rotate(135deg);
	position: absolute;
	right: 10px;
	top: 50%;
	transition: transform .2s;
}
.sp-nav li.demo a:after {
	border: none;
}
.sp-nav li .acmenu.is-active:after {
	transform: translateY(-50%) rotate(315deg);
}
.sp-nav li ul {
	padding: 0 0 0 20px;
	max-height: 0;
	overflow: hidden;
	transition-duration: 0.4s;
}
.sp-nav li ul li a {
	font-family: 'Noto Sans JP', serif;
	font-size: 1.4rem;
}
.sp-nav li ul.is-open {
	height: auto;
	opacity: 1;
}
.sp-nav li ul li:first-child {
	border-top: 1px dotted #ccc;
}
.sp-nav li ul li {
	border-top: 1px dotted #ccc;
	border-bottom: none;
}
.sp-nav li ul li a:hover {
	color: #999;
}
.sp-nav li ul li a:after {
	border: none;
}



/* 
black-bg(ハンバーガーメニュー解除用bg)
=================================== */
.black-bg {
	position: fixed;
	left: 0;
	top: 0;
	width: 100vw;
	height: 100vh;
	z-index: 5;
	background: #000;
	opacity: 0;
	visibility: hidden;
	transition: all 0.3s;
	cursor: pointer;
	z-index: 100;
}

/*ハンバーガーメニューが開いたら表示*/
.open .black-bg {
	opacity: 0.6;
	visibility: visible;
}



footer {
	background: #f6f1eb;
	position: relative;
	z-index: 5;
}

footer .inner {
	width: 960px;
	margin: 0 auto;
	padding: 50px 0 80px;
	color: #333;
}

footer .company {
	display: flex;
	margin-bottom: 75px;
}

footer .company img {
	width: 110px;
}

footer .company div:nth-child(2) {
	padding: 0 35px;
	line-height: 1.4;
}
footer .company div:last-child {
	line-height: 1.4;
}

footer .footerlist {
	display: flex;
	justify-content: space-between;
	font-size: 1.4rem;
}
footer .footerlist li:first-child {
	border-bottom: 1px solid #333;
	padding-bottom: 6px;
	font-family: 'Cormorant', 'Noto Serif JP', serif;
	font-size: 1.6rem;
}
footer .footerlist div:nth-child(2) ul:last-child {
	margin-top: 40px;
}

footer .footerlist li {
	margin-bottom: 10px;
}
footer .footerlist a {
	font-size: 1.2rem;
}

footer .footerlist div {
	width: 300px;
}

footer .footermenu {
	margin-top: 40px;
	text-align: center;
	font-size: 1.6rem;
}
footer .footermenu a {
	display: inline-block;
	padding: 0 10px;
}

footer .truste {
	text-align: center;
	margin-top: 40px;
}
footer .truste img {
	width: 120px;
}

.copy {
	text-align: center;
	font-size: 1.4rem;
}


#notfound {
	text-align: center;
	padding: 140px 0;
	font-family: 'Cormorant';
}
#notfound img {
	width: 16%;
}
#notfound p {
	font-size: 4rem;
}

#thanks {
	text-align: center;
	padding: 100px 0 200px;
	font-size: 1.8rem;
	line-height: 2;
}

#thanks .thanksdog img {
	width: 16%;
	margin-bottom: 50px;
}





.stone1hr {
	width: 292px;
	margin: 0 auto;
	text-align: center;
}





.mainswiper {
	margin-bottom: 150px;
}



.mainswiper .slide-media {
	position: relative;
	overflow: hidden;
	height: auto;
	aspect-ratio:7/4;
}
.mainswiper .slide-media .vsp {	
display: none;	
}
.mainswiper .slide-media img {
	width: 100%;
	transition: 11s ease-out;
}

.mainswiper .swiper-slide[class*=-active] .slide-media img {
	transition-delay: 0s;
	transform: scale(1.1);
}
/*
.mainswiper .swiper-slide[class*=-active] .slide-title {
	animation: mainswiper-fade 2s ease-out both;
}

@keyframes mainswiper-fade {
	0% {
		opacity: 0;
		filter: blur(300px);
	}
	100% {
		opacity: 1;
		filter: blur(0);
	}
}
*/
.mainswiper .slide {
	position: relative;
}

.mainswiper .slide-title h1 {
	font-size: 1.6rem;
	font-weight: normal;
	color: #333;
}
.mainswiper .slide-title h2 {
	font-size: 4.6rem;
	font-family: 'Cormorant', 'Noto Serif JP', serif;
	font-weight: normal;
	color: #333;
	margin-bottom: 20px;
}
.mainswiper .slide-title h2 span {
	font-size: 5.4rem;
}
.mainswiper .slide-title h3 {
	font-size: 1.4rem;
	font-weight: normal;
	margin-bottom: 40px;
}
.mainswiper .slide-title.wh h1,
.mainswiper .slide-title.wh h2,
.mainswiper .slide-title.wh h3 {
	color: #fff;
}
.mainswiper .slide-title {
	position: absolute;
}
.mainswiper .slide-title.tright {
	right: 10%;
	top: 20%;
	text-align: right;
}
.mainswiper .slide-title.tright a {
	margin-left: auto;
}
.mainswiper .slide-title.tcenter {
	text-align: center;
	top: 20%;
	left: 50%;
	transform: translateX(-50%);
}
.mainswiper .slide-title.tcentert {
	text-align: center;
	top: 5%;
	left: 50%;
	transform: translateX(-50%);
}
.mainswiper .slide-title.tcenter a,
.mainswiper .slide-title.tcentert a {
	margin-left: auto;
	margin-right: auto;
}
.mainswiper .slide-title.tleft {
	left: 10%;
	top: 20%;
	text-align: left;
}
.mainswiper .slide-title.tleft.mt10 {
	top: 10%;
}
.mainswiper .slide-title a {
	text-align: left;
	display: block;
	width: 300px;
	border: 1px solid #999;
	padding: 18px;
	margin-bottom: 20px;
	position: relative;
	transition: transform ease-in-out .3s;
}
/*
.mainswiper .slide-title a:before {
	content: "";
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	z-index: -1;
	background: #666;
	transform-origin: 100% 50%;
	transform: scaleX(0);
	transition: transform ease-in-out .3s;
}
.mainswiper .slide-title a:hover {
	color: #f6f1eb;
}
.mainswiper .slide-title a:hover:before {
	transform-origin: 0% 50%;
	transform: scaleX(1);
}
*/
.mainswiper .slide-title a img {
	width: 16px;
	position: absolute;
	top: 50%;
	right: 5%;
	transform: translateY(-50%);
	filter: brightness(.5);
}
.mainswiper .slide-title.wh a {
	border: 1px solid #fff;
	color: #fff;
}
.mainswiper .slide-title.wh a img {
	filter: brightness(1);
}

.mainswiper .slide-title .expo {
}

.mainswiper .slide-title .expo ul {
	margin-bottom: 40px;
}

.mainswiper .slide-title .expo p {
	line-height: 1.4rem;
}

.swiper-pagination-bullet {
	border-radius: inherit;
	margin: 0 5px !important;
	width: 40px !important;
	height: 2px !important;
	opacity: 0.2;
}
.swiper-pagination-bullet-active {
	opacity: 1;
}
.mainswiper .blend {
	text-shadow: 0px 0px 8px rgba(0, 0, 0, .75);
}




#lib_sevencloud {
	position: relative;
}
/*#lib_sevencloud #ninecloudmovpc {
	display: block;
}
#lib_sevencloud #ninecloudmovsp {
	display: none;
}*/

#lib_sevencloud .bline {
	position: absolute;
	width: 100%;
	height: 130px;
	top: 100px;
	background: #fcfbf9;
	z-index: -1;
}

#lib_sevencloud .head {
	display: flex;
	justify-content: space-between;
	max-width: 1200px;
	margin: 0 auto;
}

#lib_sevencloud .head #movpos {
	position: absolute;
	top: 0;
	left: 0;
	clip-path: url(#sevenclip);
	width: auto;
	height: 488px;
}

#lib_sevencloud .head div:first-child {
	flex: 1;
	margin-left: calc(50% - 50vw);
	width: 100%;
}

#lib_sevencloud .head div:first-child svg {
	width: 792px;
}
#lib_sevencloud .head div:last-child {
	width: 45%;
	padding: 105px 40px 0 20px;
}

#lib_sevencloud .head h2 {
	font-family: 'Cormorant';
	font-size: 6.5rem;
	font-weight: normal;
	color: #333;
	padding-bottom: 20px;
}

#lib_sevencloud .head h3 {
	font-size: 1.8rem;
	font-weight: bold;
	margin-bottom: 30px;
	position: relative;
}

#lib_sevencloud .head h3:before {
	content: "";
	position: absolute;
	width: 100%;
	height: 100%;
	background: #666;
}

#lib_sevencloud .head h3.anim.animshow:before {
	animation: bgLRextendAnime .8s cubic-bezier(.25,.1,.25,1) 0s forwards;
}



#lib_sevencloud .head h3+p {
	margin-left: 50px;
}

#lib_sevencloud .sevenlist {
	/* height: 1100px; */
	position: relative;
}
#lib_sevencloud .sevenlist .circleanime {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width:600px;
	height:600px;
	border-radius: 50%;
	transition: all .3s;
}
#lib_sevencloud .sevenlist .circleanime::after,
#lib_sevencloud .sevenlist .circleanime::before {
	content: '';
	position: absolute;
	left: -25%;
	top: -25%;
	border: 2px solid #333;
	width: 150%;
	height: 150%;
	border-radius: 50%;
	opacity: 1;
	animation: circleanime 6s linear infinite;
}
#lib_sevencloud .sevenlist .circleanime::before {
		animation-delay:.5s; 
}
/*波形のアニメーション*/
@keyframes circleanime{
	0%{
		transform: scale(0);
	}
	50%{
		transform: scale(0);
	}
	100%{
		transform: scale(1.2);
		opacity: 0;
	}
}


#lib_sevencloud .sevenlist .centername {
	position: absolute;
	text-align: center;
	font-family: 'Cormorant';
	font-size: 2.4rem;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}
#lib_sevencloud .sevenlist .centername strong {
	color: #f6f1eb;
	background: #666;
	padding: 2px;
	line-height: 1.6;
}
#lib_sevencloud ul {
	position: relative;
	width: 1140px;
	margin: 50px auto;
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
}

#lib_sevencloud li {
	width: 300px;
	text-align: center;
	margin-bottom: 40px;
	padding: 0 40px;
}

#lib_sevencloud li a {
	display: block;
	text-decoration: none;
	color: #666;
	position: relative;
}

#lib_sevencloud li a h2 {
	font-family: 'Cormorant';
	font-size: 2.4rem;
	color: #333;
}
#lib_sevencloud li a h2 span {
	color: #f1f2e4;
	font-size: 1.6rem;
	line-height: .8;
	margin-right: 4px;
	background: #576f98;
	display: inline-block;
	padding: 4px 12px 0 2px;
}
#lib_sevencloud li:nth-child(2) a h2 span {
	color: #f1f2e4;
	font-size: 1.6rem;
	line-height: .8;
	margin-right: 4px;
	background: #51705f;
	display: inline-block;
	padding: 4px 12px 0 2px;
}
#lib_sevencloud li a p {
line-height: 1.8;
}
#lib_sevencloud li a h3 {
	font-size: 1.4rem;
	margin-bottom: 10px;
}

#lib_sevencloud li:nth-child(1) {
	width: 400px;
	margin-left: 50px;
	padding: 0 40px;
	margin-bottom: 60px;
}
#lib_sevencloud li:nth-child(2) {
	width: 400px;
	margin-right: 50px;
	padding: 0 40px;
	margin-bottom: 60px;
}
#lib_sevencloud li:nth-child(6),
#lib_sevencloud li:nth-child(7),
#lib_sevencloud li:nth-child(8),
#lib_sevencloud li:nth-child(9) {
	width: 250px;
	padding: 0 20px;
}

#lib_sevencloud li a .hoverbg {
	position: absolute;
	z-index: -1;
	transform: scale(0, 0);
	transition: transform cubic-bezier(0,.8,0,1.25) .7s;
}
#lib_sevencloud li a:hover .hoverbg {
	transform: scale(1, 1);
}

#lib_sevencloud li a .hoverbg svg {
	width: 170px;
	stroke-width: 0;
}
#lib_sevencloud li:nth-child(1) a .hoverbg {
	top: 0;
	right: 0;
}
#lib_sevencloud li:nth-child(1) a .hoverbg svg {
	fill: #dde2ea;
}
#lib_sevencloud li:nth-child(2) a .hoverbg {
	top: 120px;
	left: 0;
}
#lib_sevencloud li:nth-child(2) a .hoverbg svg {
	fill: #dce2df;
}
#lib_sevencloud li:nth-child(3) a .hoverbg {
	top: 0;
	left: 0;
}
#lib_sevencloud li:nth-child(3) a .hoverbg svg {
	fill: #f8dbce;
}
#lib_sevencloud li:nth-child(4) a .hoverbg {
	top: 140px;
	right: -40px;
}
#lib_sevencloud li:nth-child(4) a .hoverbg svg {
	fill: #d8e4ed;
}
#lib_sevencloud li:nth-child(5) a .hoverbg {
	top: 140px;
	right: -30px;
}
#lib_sevencloud li:nth-child(5) a .hoverbg svg {
	fill: #f0ddf0;
}
#lib_sevencloud li:nth-child(6) a .hoverbg {
	top: 0;
	right: 0;
}
#lib_sevencloud li:nth-child(6) a .hoverbg svg {
	fill: #e8efeb;
}
#lib_sevencloud li:nth-child(7) a .hoverbg {
	top: 120px;
	left: 0;
}
#lib_sevencloud li:nth-child(7) a .hoverbg svg {
	fill: #f4c6c2;
}
#lib_sevencloud li:nth-child(8) a .hoverbg {
	top: 60px;
	left: 0;
}
#lib_sevencloud li:nth-child(8) a .hoverbg svg {
	fill: #f9efbc;
}
#lib_sevencloud li:nth-child(9) a .hoverbg {
	top: 160px;
	left: 0;
}
#lib_sevencloud li:nth-child(9) a .hoverbg svg {
	fill: #e1f4d4;
}
#lib_sevencloud .head h3 {
	font-size: 1.8rem;
	font-weight: bold;
	margin-bottom: 30px;
	position: relative;
}



#lib_about {
	position: relative;
	margin: 100px auto;
}
#lib_about #aboutmovpc {
	display: block;
}
#lib_about #aboutmovsp {
	display: none;
}

#lib_about .bline {
	position: absolute;
	width: 100%;
	height: 130px;
	top: 100px;
	background: #fcfbf9;
	z-index: -1;
}

#lib_about .head {
	display: flex;
	justify-content: space-between;
	max-width: 1200px;
	margin: 0 auto;
}

#lib_about .head #movpos2 {
	position: absolute;
	top: 0;
	right: 0;
	clip-path: url(#aboutclip);
	width: 674px;
	height: auto;
}

#lib_about .head div:first-child {
	width: 45%;
	padding: 105px 10px 0 0px;
}
#lib_about .head div:last-child {
	flex: 1;
	margin-right: calc(48% - 48vw);
	margin-left: 2%;
}
#lib_about .head div:last-child svg {
	width: 100%;
}
#lib_about .head h2 {
	font-family: 'Cormorant';
	font-size: 6.5rem;
	font-weight: normal;
	color: #333;
	padding-bottom: 20px;
}

#lib_about .head h3 {
	font-size: 1.8rem;
	font-weight: bold;
	margin-bottom: 30px;
	position: relative;
	color: #666;;
}

#lib_about .head h3:before {
	content: "";
	position: absolute;
	width: 100%;
	height: 100%;
	background: #666;
}

#lib_about .head h3.anim.animshow:before {
	animation: bgLRextendAnime .8s cubic-bezier(.25,.1,.25,1) 0s forwards;
}

#lib_about .head h3+p {
	margin-left: 50px;
}

#lib_about .linklist {
	width: 1100px;
	margin: 0 auto;
}

#lib_about .linklist ul {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	width: 708px;
}

#lib_about .linklist a {
	display: block;
	width: 340px;
	border: 1px solid #999;
	padding: 18px;
	margin-bottom: 20px;
	position: relative;
	transition: transform ease-in-out .3s;
}
#lib_about .linklist a:before {
	content: "";
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	z-index: -1;
	background: #666;
	transform-origin: 100% 50%;
	transform: scaleX(0);
	transition: transform ease-in-out .3s;
}
#lib_about .linklist a:hover {
	color: #f6f1eb;
}
#lib_about .linklist a:hover:before {
	transform-origin: 0% 50%;
	transform: scaleX(1);
}
#lib_about .linklist a img {
	width: 16px;
	position: absolute;
	top: 50%;
	right: 5%;
	transform: translateY(-50%);
	filter: brightness(.5);
}
#lib_about .linklist a:hover img {
	filter: brightness(1);
}






#lib_csj {
	width: 1200px;
	padding-right: 200px;
	margin: 150px auto 100px auto;
}

#lib_csj .head {
	display: flex;
	margin-bottom: 50px;
}
#lib_csj .head h2 {
	font-family: 'Cormorant';
	font-size: 6.5rem;
	font-weight: normal;
	color: #333;
	padding-bottom: 20px;
}

#lib_csj .head h3 {
	font-size: 1.8rem;
	font-weight: bold;
	margin-bottom: 30px;
	position: relative;
	color: #666;;
}

#lib_csj .head h3:before {
	content: "";
	position: absolute;
	width: 100%;
	height: 100%;
	background: #666;
}

#lib_csj .head h3.anim.animshow:before {
	animation: bgLRextendAnime .8s cubic-bezier(.25,.1,.25,1) 0s forwards;
}

#lib_csj .head div:last-child {
	margin-left: 40px;
}

#lib_csj .cont {
	display: flex;
	margin-left: 50px;
}

#lib_csj .cont p {
	padding-right: 5%;
}

#lib_csj .cont .linklist {
	width: 340px;
}

#lib_csj .cont .linklist a {
	display: block;
	width: 340px;
	border: 1px solid #999;
	padding: 18px;
	margin-bottom: 20px;
	position: relative;
	transition: transform ease-in-out .3s;
}
#lib_csj .cont .linklist a:before {
	content: "";
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	z-index: -1;
	background: #666;
	transform-origin: 100% 50%;
	transform: scaleX(0);
	transition: transform ease-in-out .3s;
}
#lib_csj .cont .linklist a:hover {
	color: #f6f1eb;
}
#lib_csj .cont .linklist a:hover:before {
	transform-origin: 0% 50%;
	transform: scaleX(1);
}
#lib_csj .cont .linklist a img {
	width: 16px;
	position: absolute;
	top: 50%;
	right: 5%;
	transform: translateY(-50%);
	filter: brightness(.5);
}
#lib_csj .cont .linklist a:hover img {
	filter: brightness(1);
}




#lib_group {
	text-align: center;
	margin: 100px auto;
}

#lib_group h2 {
	font-family: 'Cormorant';
	font-size: 4.2rem;
	font-weight: normal;
	color: #333;
	margin-bottom: 25px;
}
#lib_group h3 {
	font-size: 1.8rem;
	font-weight: normal;
	margin-bottom: 60px;
}

#lib_group .groupswiper {
	width: 960px;
	height: 210px;
	overflow: hidden;
	margin: 0 auto;
	border-top: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
}






#lib_nextreal {
	width: 860px;
	margin: 80px auto;
	background: #fff;
	padding: 3px;
}

#lib_nextreal a {
	display: block;
	display: flex;
	justify-content: space-between;
	cursor: pointer;
}
#lib_nextreal a div:first-child {
	width: 515px;
}
#lib_nextreal a div:last-child {
	width: 315px;
	padding-right: 24px;
	text-align: center;
	padding-top: 30px;
}

#lib_nextreal h2 {
	font-size: 1.6rem;
	margin-bottom: 25px;
}
#lib_nextreal h2+p {
	font-size: 1.4rem;
	line-height: 2;
}
#lib_nextreal .stone {
	margin-bottom: 30px;
}
#lib_nextreal span {
	font-size: 1.4rem;
}
#lib_nextreal span img {
	width: 18px;
	vertical-align: middle;
	margin-left: 20px;
}



#lib_next_yamate {
	width: 960px;
	margin: 80px auto;
}

#lib_next_yamate ul {
	display: flex;
	justify-content: space-between;
}

#lib_next_yamate li {
	width: 460px;
	padding: 2px;
	background: #fff;
}
#lib_next_yamate li a {
	display: block;
	cursor: pointer;
	text-align: center;
}
#lib_next_yamate span {
	display: block;
	font-size: 1.4rem;
	padding: 20px 0;
}
#lib_next_yamate span img {
	width: 18px;
	vertical-align: middle;
	margin-left: 20px;
}




#lib_link1 {
	width: 712px;
	margin: 80px auto;
}

#lib_link1 ul {
	display: flex;
	justify-content: space-between;
}

#lib_link1 li {
	width: 342px;
}

#lib_link1 li a {
	display: block;
	width: 340px;
	border: 1px solid #999;
	padding: 18px;
	margin-bottom: 20px;
	position: relative;
	transition: transform ease-in-out .3s;
}
#lib_link1 li a:before {
	content: "";
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	z-index: -1;
	background: #666;
	transform-origin: 100% 50%;
	transform: scaleX(0);
	transition: transform ease-in-out .3s;
}
#lib_link1 li a:hover {
	color: #f6f1eb;
}
#lib_link1 li a:hover:before {
	transform-origin: 0% 50%;
	transform: scaleX(1);
}
#lib_link1 li a img {
	width: 16px;
	position: absolute;
	top: 50%;
	right: 5%;
	transform: translateY(-50%);
	filter: brightness(.5);
}
#lib_link1 li a:hover img {
	filter: brightness(1);
}




#lib_mockup {
	width: 960px;
	margin: 0 auto 100px;
	position: relative;
}

#lib_mockup svg {
	width: 476px;
	height: 330px;
}

#lib_mockup .textbox {
	position: absolute;
	top: 20px;
	left: 440px;
}

#lib_mockup h2 {
	font-family: 'Cormorant';
	font-size: 4.6rem;
	font-weight: normal;
	color: #333;
	padding-bottom: 5px;
}

#lib_mockup h3 {
	font-size: 1.8rem;
	font-weight: bold;
	margin-bottom: 30px;
	position: relative;
}
#lib_mockup h3:before {
	content: "";
	position: absolute;
	width: 100%;
	height: 100%;
	background: #666;
}
#lib_mockup h3.anim.animshow:before {
	animation: bgLRextendAnime .8s cubic-bezier(.25,.1,.25,1) 0s forwards;
}
#lib_mockup p {
	line-height: 2;
}





#lib_story {
	background: url(/wp-content/themes/twentytwentyone/images/common/bg_story.jpg) no-repeat right top;
	background-size: cover;
	height: 900px;
	padding-top: 120px;
	margin: 100px 0;
}
#lib_story .inner {
	width: 960px;
	padding-left: 550px;
	margin: 0 auto;
}
#lib_story h2 {
	font-family: 'Cormorant';
	font-size: 8rem;
	font-weight: normal;
	color: #333;
}
#lib_story h3 {
	font-size: 1.8rem;
	margin-bottom: 30px;
	position: relative;
}

#lib_story h3:before {
	content: "";
	position: absolute;
	width: 100%;
	height: 100%;
	background: #666;
}
#lib_story h3.anim.animshow:before {
	animation: bgLRextendAnime .8s cubic-bezier(.25,.1,.25,1) 0s forwards;
}
#lib_story p {
	font-size: 1.4rem;
	line-height: 2;
	padding-left: 50px;
	color: #333;
}






.lib_cvcontent {
	background: #fff;
	padding: 30px 0;
	text-align: center;
	margin: 100px 0;
	position: relative;
	z-index: 0;
}

.lib_cvcontent ul {
	width: 820px;
	margin: 0 auto;
	display: flex;
	justify-content: space-between;
	position: relative;
	z-index: 1;
}
.lib_cvcontent ul li a {
	display: block;
	width: 390px;
	padding: 20px;
	position: relative;
	transition: transform ease-in-out .3s;
}
.lib_cvcontent ul li:first-child a {
	border: 1px solid #ff7e6a;
}
.lib_cvcontent ul li:last-child a {
	border: 1px solid #ff8740;
}
.lib_cvcontent ul li a:before {
	content: "";
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	z-index: -1;
	transform-origin: 100% 50%;
	transform: scaleX(0);
	transition: transform ease-in-out .3s;
}
.lib_cvcontent ul li:first-child a:before {
	background: #ff7e6a;
}
.lib_cvcontent ul li:last-child a:before {
	background: #ff8740;
}
.lib_cvcontent ul li a:hover {
	color: #f6f1eb;
}
.lib_cvcontent ul li a:hover:before {
	transform-origin: 0% 50%;
	transform: scaleX(1);
}







#lib_contact {
	background: #fff;
	padding: 120px 0;
	position: relative;
	z-index: 5;
}

#lib_contact #myt,
#lib_contact .myt2 {
	display: none;
}
#lib_contact .inner {
	width: 860px;
	margin: 0 auto;
}

#lib_contact h2 {
	font-family: 'Cormorant';
	font-size: 4.2rem;
	font-weight: normal;
	margin-bottom: 50px;
}
.contactcont {
	display: flex;
	justify-content: space-between;
}
.contactcont div:first-child {
	width: 360px;
}
.contactcont div:last-child {
	width: 450px;
}

.contactcont div:first-child p {
}

#lib_contact input[type="text"],
#lib_contact input[type="email"] {
	width: 450px;
	color: #666;
}
#lib_contact div:last-child li {
	margin-bottom: 20px;
	padding-bottom: 10px;
	border-bottom: 1px solid #ccc;
}
#lib_contact div:last-child li:nth-child(6),
#lib_contact div:last-child li:nth-child(7),
#lib_contact div:last-child li:nth-child(8),
#lib_contact div:last-child li:nth-child(9) {
	border: none;
}
#lib_contact li:nth-child(5) p {
	padding-bottom: 4px;
}
#lib_contact li:nth-child(5) span.mwform-checkbox-field {
	margin-left: 0;
	padding-bottom: 10px;
}
#lib_contact li:nth-child(5) span:nth-child(even).mwform-checkbox-field {
	display: inline-block;
	width: 200px;
}

#lib_contact li:nth-child(5) span:nth-child(odd).mwform-checkbox-field {
	display: inline-block;
	width: 220px;
}

#lib_contact textarea {
	width: 450px;
	color: #666;
	border: 1px solid #ccc;
	border-radius: 4px;
	padding: 5px;
}

#lib_contact div:last-child a {
	text-decoration: underline;
}

#lib_contact div:last-child a:hover {
	text-decoration: none;
}

#lib_contact input[type="submit"] {
	font-weight: bold;
	background: #333;
	display: block;
	width: 450px;
	border: 1px solid #999;
	padding: 18px;
	margin-bottom: 20px;
	color: #fff;
	position: relative;
	transition: ease-in-out .3s;
}
#lib_contact input[type="submit"]:hover {
	background: #999;
	color: #000;
}
#lib_contact input[type="submit"]:before {
	content: "";
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	z-index: -1;
	background: #666;
	transform-origin: 100% 50%;
	transform: scaleX(0);
	transition: ease-in-out .3s;
}
#lib_contact input[type="submit"]:hover:before {
	transform-origin: 0% 50%;
	transform: scaleX(1);
}
#lib_contact button {
	font-weight: bold;
	background: #333;
	display: block;
	width: 450px;
	border: 1px solid #999;
	padding: 18px;
	margin-bottom: 20px;
	color: #fff;
	position: relative;
	transition: ease-in-out .3s;
}
#lib_contact button:hover {
	background: #999;
	color: #000;
}
#lib_contact button:before {
	content: "";
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	z-index: -1;
	background: #666;
	transform-origin: 100% 50%;
	transform: scaleX(0);
	transition: ease-in-out .3s;
}
#lib_contact button:hover:before {
	transform-origin: 0% 50%;
	transform: scaleX(1);
}
#lib_contact div:last-child li:last-child .select {
	display: none;
}
#lib_contact .recap {
	font-size: 1.2rem;
	line-height: 1.4;
}


.mainswiper {
	padding-bottom: 50px;
	position: relative;
}

.swiper-pagination-bullet {
	background-color: #999;
	height: 10px;
	width: 10px;
}


.wpcf7 p {
	display: inline;
}
.wpcf7 p.select {
	display: block;
}
.grecaptcha-badge { visibility: hidden; }
.screen-reader-response {
	display: none;
}







/*/////////////////// SP ///////////////////*/
/*/////////////////// SP ///////////////////*/
/*/////////////////// SP ///////////////////*/
/*/////////////////// SP ///////////////////*/
/*/////////////////// SP ///////////////////*/
@media screen and (max-width: 768px) {

#loading.loaded svg {
	width: auto;
	height: 100%;
}

#loading .loadingcont img {
	width: 100%;
}



body {
	font-size: 1.4rem;
	padding-top: 50px;
}

.brsp {
	display: block;
}

.brpc {
	display: none;
}




#sideoc {
	bottom: 90px;
	right: 10px;
	width: 100px;
}
#btmreq {
	display: block;
	position: fixed;
	bottom: 0;
	z-index: 299;
}


header#fixhead.trans {
	height: 50px;
	padding: 0;
}

header#fixhead.trans img {
	width: 52px;
}
header {
	height: 50px;
	padding: 0;
}

header img {
	width: 52px;
	margin-top: 16px;
}

#js-hamburger {
	top: 16px;
}
#js-hamburger.trans {
	top: 16px;
}
.hamburger {
	left: 20px;
	top: 16px;
}

.hamburger span {
	width: 40px;
	height: 2px;
}

.hamburger span:first-child {
	top: 2px;
}
.hamburger span:last-child {
	top: 14px;
}

.open .hamburger span:first-child {
	transform: rotate(-25deg);
	top: 16px;
	width: 38px;
}

.open .hamburger span:last-child {
	transform: rotate(25deg);
	top: 16px;
	width: 38px;
}

.sp-nav {
	top: 0;
	width: 90%;
}

.sp-nav ul {
	text-align: left;
	padding: 60px 20px 0;
}

footer .inner {
	width: 100%;
}

footer .footerlist {
	display: none;
}

footer .footermenu {
	margin-top: 40px;
	font-size: 1.4rem;
}

footer .company {
	display: block;
	text-align: center;
	margin-bottom: 0;
	font-size: 1.4rem;
}
footer .company div:nth-child(2) {
	margin: 10px 0;
}
.copy {
	font-size: 1.2rem;
}

.stone1hr {
	width: 100%;
}
.stone1hr img {
	width: 30%;
}


.mainswiper {
	margin-bottom: 30px;
}

.mainswiper .pconly {
	display: none;
}

.mainswiper .slide-media {
	aspect-ratio: 15/19;
}

.mainswiper .slide-media .vpc {
	display: none;	
}	
.mainswiper .slide-media .vsp {	
	display: block;	
	width: 100%;	
}

.mainswiper .slide-title h2 {
	font-size: 4rem;
}
.mainswiper .slide-title h2 span {
	font-size: 4.8rem;
}
.mainswiper .slide-title {
	width: 80%;
}

.mainswiper .slide-title a {
	width: 75%;
	padding: 10px;
}

.mainswiper .slide-title .expo {
	display: none;
}

#cvarea {
	right: 0;
	top: auto;
	bottom: 0;
}

#cvarea ul {
	display: flex;
}


#lib_contact {
	padding: 40px 0;
}

#lib_contact div:last-child li:last-child .select {
	display: block;
	font-size: 1.2rem;
	line-height: 1.4;
}
#lib_contact .recap {
	display: none;
}
#lib_contact .recap {
	font-size: 1.2rem;
	line-height: 1.4;
}




#lib_sevencloud .bline {
	height: 60px;
	top: 20px;
}

/*#lib_sevencloud #ninecloudmovpc {
	display: none;
}
#lib_sevencloud #ninecloudmovsp {
	display: block;
}*/


#lib_sevencloud .head {
	display: block;
	max-width: none;
}
#lib_sevencloud .head div:first-child {
	position: absolute;
	width: 56%;
}
#lib_sevencloud .head div:first-child svg {
	width: 100%;
}
#lib_sevencloud .head div:last-child {
	width: 86%;
	margin: 0 auto;
	padding: 20px 0 0 0;
}
#lib_sevencloud .head h2 {
	font-size: 2.7rem;
	padding-bottom: 10px;
	margin-left: 55%;
	/* mix-blend-mode: difference; */
}

#lib_sevencloud .head h3 {
	font-size: 1.2rem;
	margin-left: 55%;
	margin-bottom: 10px;
}
#lib_sevencloud .head h3+p {
	font-size: 1.4rem;
	margin-left: 0;
	margin-right: 8%;
	margin-bottom: 10px;
}

#lib_sevencloud .sevenlist {
	height: auto;
}
#lib_sevencloud .sevenlist .circleanime,
#lib_sevencloud .sevenlist .centername {
	display: none;
}
#lib_sevencloud ul {
	width: 86%;
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}
#lib_sevencloud li,
#lib_sevencloud li:nth-child(1),
#lib_sevencloud li:nth-child(2),
#lib_sevencloud li:nth-child(6),
#lib_sevencloud li:nth-child(7),
#lib_sevencloud li:nth-child(8),
#lib_sevencloud li:nth-child(9) {
	position: static;
	width: 100%;
	text-align: center;
	font-size: 1.4rem;
	margin-left: 0;
	margin-right: 0;
	margin-bottom: 20px;
}

#lib_sevencloud li .vpc {
	display: none;
}
#lib_sevencloud li .vsp {
	display: block;
}

#lib_sevencloud li a h2 {
	font-size: 2.4rem;
	margin-top: 10px;
}
#lib_sevencloud li a h3 {
	margin-bottom: 10px;
}
#lib_sevencloud li a p {
	text-align: left;
	width: 90%;
	margin: 0 auto;
}




#lib_about {
	margin: 40px auto;
}

#lib_about #aboutmovpc {
	display: none;
}
#lib_about #aboutmovsp {
	display: inline;
}
#lib_about .bline {
	height: 60px;
	top: 20px;
}

#lib_about .head {
	display: block;
	max-width: none;
}

#lib_about .head div:first-child {
	width: 86%;
	margin: 0 auto;
	padding: 20px 0 0 0;
}
#lib_about .head div:last-child {
	position: absolute;
	width: 56%;
	margin-right: calc(48% - 48vw);
	margin-left: 2%;
	right: 0;
	top: 0;
}
#lib_about .head div:last-child svg {
	width: 100%;
}
#lib_about .head h2 {
	font-size: 2.7rem;
	padding-bottom: 10px;
}

#lib_about .head h3 {
	font-size: 1.2rem;
	margin-bottom: 10px;
}
#lib_about .head h3+p {
	font-size: 1.4rem;
	margin-left: 8%;
	margin-bottom: 10px;
	margin-top: 24%;
}

#lib_about .linklist {
	width: 86%;
	padding-left: 8%;
}

#lib_about .linklist ul {
	display: block;
	width: 100%;
}

#lib_about .linklist a {
	width: auto;
}








#lib_csj {
	width: 86%;
	padding-right: 0;
	margin: 40px auto;
}

#lib_csj .head {
	display: block;
	margin-bottom: 30px;
}
#lib_csj .head h2 {
	font-size: 2.7rem;
	padding-bottom: 10px;
}

#lib_csj .head h3 {
	font-size: 1.2rem;
	margin-bottom: 10px;
}

#lib_csj .head div:last-child {
	width: 70%;
	margin-top: -10%;
	margin-left: auto;
}

#lib_csj .cont {
	display: block;
	margin-left: 8%;
}

#lib_csj .cont p {
	font-size: 1.4rem;
	padding-right: 0;
}
#lib_csj .cont .linklist {
	width: 100%;
}
#lib_csj .cont .linklist a {
	width: 100%;
}




#lib_group {
	margin: 40px auto;
}

#lib_group h2 {
	font-size: 2.7rem;
	margin-bottom: 10px;
}
#lib_group h3 {
	font-size: 1.2rem;
	margin-bottom: 30px;
}

#lib_group .groupswiper {
	width: 86%;
	height: auto;
	margin: 0 auto;
	aspect-ratio: 5/1.1;
}
#lib_group .groupswiper img {
	width: 100%;
}






#lib_nextreal {
	width: 68%;
	margin: 40px auto;
}

#lib_nextreal a {
	display: block;
}
#lib_nextreal a div:first-child {
	width: 100%;
}
#lib_nextreal a div:last-child {
	width: 100%;
	padding: 10px 0;
}
#lib_nextreal h2,
#lib_nextreal h2+p,
#lib_nextreal .stone {
	display: none;
}



#lib_next_yamate {
	width: 90%;
	margin: 40px auto;
}

#lib_next_yamate ul {
	display: block;
}

#lib_next_yamate li {
	width: 100%;
	margin-bottom: 20px;
}



#lib_link1 {
	width: 90%;
	margin: 40px auto;
}

#lib_link1 ul {
	display: block;
}

#lib_link1 li {
	width: 100%;
}

#lib_link1 li a {
	display: block;
	width: 100%;
	border: 1px solid #999;
	padding: 18px;
	margin-bottom: 20px;
	position: relative;
	transition: transform ease-in-out .3s;
}




#lib_mockup {
	width: 90%;
	margin: 0 auto 50px;
}

#lib_mockup svg {
	width: 80%;
	height: auto;
}

#lib_mockup .textbox {
	position: relative;
	top: 20px;
	left: 0;
}

#lib_mockup h2 {
	font-size: 3rem;
}


#lib_mockup h3 {
	font-size: 1.2rem;
	margin-bottom: 20px;
}



#lib_story {
	background: url(/wp-content/themes/twentytwentyone/images/common/bg_story_sp.jpg) no-repeat left bottom;
	background-size: 100% auto;
	height: auto;
	padding-top: 50px;
	padding-bottom: 280px;
	margin: 50px 0;
}

#lib_story .inner {
	width: 90%;
	padding-left: 0;
	margin: 0 auto;
}
#lib_story h2 {
	font-size: 4.4rem;
}
#lib_story h3 {
	font-size: 1.4rem;
}




.lib_cvcontent {
	margin: 50px auto;
}
.lib_cvcontent ul {
	width: 100%;
	margin: 0 auto;
	display: block;
}
.lib_cvcontent ul li:first-child {
	margin-bottom: 20px;
}
.lib_cvcontent ul li a {
	width: 90%;
	margin: 0 auto;
	padding: 20px;
}





#lib_contact .inner {
	width: 84%;
}
#lib_contact h2 {
	font-size: 2.7rem;
	margin-bottom: 10px;
}
.contactcont {
	display: block;
}

.contactcont div:first-child,
.contactcont div:last-child {
	width: 100%;
}
.contactcont div:first-child p {
	font-size: 1.4rem;
	line-height: 1.6;
}

#lib_contact li:nth-child(5) p,
#lib_contact li:nth-child(5) span.mwform-checkbox-field {
	padding-bottom: 20px;
}
#lib_contact li:nth-child(5) span:nth-child(even).mwform-checkbox-field,
#lib_contact li:nth-child(5) span:nth-child(odd).mwform-checkbox-field {
	width: 100%;
}


#lib_contact input[type="text"],
#lib_contact input[type="email"] {
	width: 100%;
}

#lib_contact textarea {
	width: 100%;
}
#lib_contact input[type="submit"] {
	width: 100%;
}

#lib_contact button {
	width: 100%;
}

#thanks {
	padding: 50px 0;
	font-size: 1.4rem;
}

#thanks .thanksdog img {
	width: 30%;
	margin-bottom: 20px;
}


#notfound img {
	width: 60%;
}

#notfound p {
	font-size: 4rem;
}


}