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


* {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
	list-style-type: none;
	text-decoration: none;
}
img {
	vertical-align: bottom;
}
body {
	font-family: "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
	letter-spacing: .1em;
	color: #333;
}
.copy_fixed {
	position: fixed;
	top: 50%;
	left: 30px;
	transform: translateY(-50%);
	font-size: .8rem;
	-ms-writing-mode: tb-rl;
	-webkit-writing-mode: vertical-rl;
	writing-mode: vertical-rl;
	white-space: nowrap;
	z-index: 100;
}
.scrolldown {
	position: absolute;
	right: 50px;
	animation: arrowmove 1s ease-in-out infinite;
}
.scrolldown span {
	position: absolute;
	bottom: 40px;
	left: -30px;
	color: #333;
	font-size: 1.5rem;
	-ms-writing-mode: tb-rl;
	-webkit-writing-mode: vertical-rl;
	writing-mode: vertical-rl;
}
.scrolldown:before {
	content: "";
	position: absolute;
	right: -16px;
	bottom: 0;
	width: 1px;
	height: 20px;
	background-color: #333;
	transform: skewX(-31deg);
}
.scrolldown:after {
	content: "";
	position: absolute;
	right: -10px;
	bottom: 0;
	width: 1px;
	height: 150px;
	background-color: #333;
}
.more {
	position: relative;
	display: block;
	width: 300px;
	margin: 80px auto 0 auto;
	padding: 20px 100px;
	border-radius: 50px;
	background-color: #c0cc6d;
	color: #fff;
	text-align: center;
	transition: .3s;
	z-index: 1;
}
.more:before {
	content: "";
	position: absolute;
	top: 25px;
	right: 25px;
	width: 10px;
	height: 10px;
	border-top: solid 2px #fff;
	border-right: solid 2px #fff;
	transform: rotate(45deg);
}
h2 {
	position: relative;
	margin-bottom: 80px;
	font-size: 6rem;
	opacity: 0;
	transform: translateY(-100px);
	transition: opacity 1s, transform 1s;
}
.h2_small {
	display: block;
	font-size: 1.5rem;
}
.back_img,
.back_img2 {
	position: relative;
	width: 100%;
	height: 900px;
	background-position: top center;
	background-size: cover;
	z-index: -1;
}
.back_img {
	background-image: url("../img/img-back1.jpg");
}
.back_img2 {
	background-image: url("../img/img-back2.jpg");
}
#top3:before,
#top4:before,
#top5:before,
#top6:before {
	content: "";
	position: absolute;
	top: -100px;
	left: 0;
	width: 100%;
	height: 100px;
	background-size: cover;
	background-position: center;
}
#top3:before,
#top5:before {
	background-image: url("../img/deco-wave1.svg");
}
#top4:before,
#top6:before {
	background-image: url("../img/deco-wave3.svg");
}
#top3:after,
#top5:after {
	content: "";
	position: absolute;
	bottom: -100px;
	left: 0;
	width: 100%;
	height: 100px;
	background-image: url("../img/deco-wave1.svg");
	background-size: cover;
	background-position: center;
	transform: rotate(180deg);
	z-index: 1;
}
.deco {
	position: absolute;
}
#top3 .deco {
	top: -100px;
	right: 0;
	width: 300px;
}
#top4 .deco {
	top: -100px;
	left: 0;
	width: 300px;
}
#top5 .deco {
	top: -150px;
	right: 0;
	width: 400px;
}
#top6 .deco {
	top: -50px;
	left: 0;
	width: 350px;
}


/*----------------------------------------

header

----------------------------------------*/
header {
	position: fixed;
	top: 0;
	width: 100%;
	height: 90px;
	padding: 20px 0;
	background-color: #fff;
	z-index: 100;
}
header .header_cont {
	position: relative;
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	width: calc(100% - 40px);
	margin: 0 auto;
}
header h1 img {
	height: 45px;
}
header nav ul {
	display: flex;
	flex-wrap: nowrap;
	margin-right: 130px;
}
header nav ul li {
	margin-right: 30px;
}
header nav ul li a {
	color: #333;
	transition: .3s;
}
header nav ul li:last-child {
	display: none;
	margin-right: 0;
}
header nav ul li img {
	display: inline-block;
	width: 18px;
	margin-right: 5px;
	vertical-align: baseline;
	transition: .3s;
}
header .shop {
	position: absolute;
	top: -20px;
	right: -20px;
	width: 120px;
	height: 90px;
	background-color: #333;
	pointer-events: none;
}
header .shop a {
	display: block;
	width: 100%;
	height: 100%;
	padding-top: 5px;
	color: #fff;
	font-size: .8em;
	text-align: center;
	transition: .3s;
}
header .shop img {
	display: block;
	width: 35px;
	margin: 0 auto 5px auto;
}
/*--------------------------------------*/


/*----------------------------------------

top1

----------------------------------------*/
#top1 {
	position: relative;
	width: 100%;
	height: calc(100vh - 90px);
	margin: 90px auto 0 auto;
	overflow: hidden;
	background-image: url("../img/img-top.jpg");
	background-position: top 35% center;
	background-size: cover;
	opacity: 0;
	z-index: -1;
}
#top1 .catch {
	position: absolute;
	right: 25%;
	width: 110px;
}
/*--------------------------------------*/


/*----------------------------------------

top2 : About Us

----------------------------------------*/
#top2_cont {
	position: relative;
	display: flex;
	justify-content: space-between;
	max-width: 1200px;
	width: 100%;
	margin: 0 auto;
	padding: 150px 20px 250px 20px;
}
#top2_cont:after {
	content: "";
	position: absolute;
	top: 200px;
	left: 0;
	width: 100%;
	height: 300px;
	background-color: #f7f5c3;
	z-index: -1;
}
#top2_cont .top2_cont_left {
	position: relative;
	opacity: 0;
	transform: translateX(-100px);
	transition: opacity 1s, transform 1s;
}
.fade {
	opacity: 1 !important;
	transform: translateX(0) !important;
}
#top2_cont .top2_cont_left,
#top2_cont .top2_cont_right {
	flex-basis: calc(100%/2 - 25px);
}
#top2_cont .top2_cont_right {
	margin-top: 50px;
	padding-right: 30px;
	text-align: justify;
}
#top2_cont .top2_cont_left img {
	width: 100%;
	border-radius: 5px;
	box-shadow: 5px 5px 10px rgba(0, 0, 0, .07);
}
.policy {
	margin-bottom: 2em;
	padding: 1em;
	border: 1px solid #333;
	font-size: .9rem;
	text-align: left;
}
.policy_title {
	margin-bottom: .2em;
	font-size: 1.2rem;
	font-weight: bold;
}
/*--------------------------------------*/


/*----------------------------------------

top3 : items

----------------------------------------*/
#top3 {
	position: relative;
	margin: 0 auto;
	padding: 50px 0;
	background-color: #f8f5c4;
}
#top3 .item_cont {
	padding: 20px 0 10px 0;
	overflow: hidden;
}
#top3 .item_cont2 {
	position: relative;
	max-width: 1024px;
	width: calc(100% - 40px);
	margin: 0 auto;
}
.swiper-controller {
	position: absolute;
	top: -120px;
	right: -10px;
	width: 200px;
	height: 70px;
}
.swiper-pagination {
	display: none;
}
.swiper-button-prev,
.swiper-button-next {
	width: 70px !important;
	height: 70px !important;
	border-radius: 50px;
	background-color: #c0cc6d;
	transition: .3s;
}
.swiper-button-prev:hover,
.swiper-button-next:hover {
	transform: scale(1.15);
}
.swiper-button-prev:after,
.swiper-button-next:after {
	content: "" !important;
	position: absolute;
	top: 0;
	bottom: 0;
	width: 20px;
	height: 20px;
	margin: auto;
	border: 3px solid;
	border-color: transparent transparent #fff #fff;
}
.swiper-button-prev:after {
	right: 20px;
	transform: rotate(45deg);
}
.swiper-button-next:after {
	left: 15px;
	transform: rotate(-135deg);
}
.card02 {
	position: relative;
	max-width: 1024px;
	width: calc(100% - 40px);
	height: auto;
	margin: 100px auto 0 auto;
}
.card02 .swiper {
	overflow: visible;
}
.card02 .swiper-slide {
	width: 380px;
	border-radius: 5px;
	box-shadow: 5px 5px 10px rgba(0, 0, 0, .07);
	background-color: #fff;
	transition: transform .3s;
}
.swiper-slide img {
	width: 100%;
	height: auto;
	border-radius: 5px 5px 0 0;
}
.slide-content {
	padding: 20px;
}
.card02 .swiper-slide:hover {
	transform: translateY(-16px);
}
.card02 a {
	position: relative;
	color: #333;
	font-size: 1.2rem;
}
.card02 a:first-child:before,
.card02 a:nth-child(2):before,
.card02 a:nth-child(3):before {
	content: "";
	display: block;
	position: absolute;
	top: -10px;
	left: -10px;
	width: 80px;
	height: 80px;
	border-radius: 100px;
	background-image: url("../img/deco-hot.svg");
	background-size: cover;
	background-color: #d0504a;
	z-index: 1;
}
.card02 a p {
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden;
}
#top3 .category {
	display: block;
	margin-top: 5px;
	color: #606060;
	font-size: 1rem;
}
/*--------------------------------------*/


/*----------------------------------------

top4 : staff

----------------------------------------*/
#top4 {
	position: relative;
	width: 100%;
	padding: 50px 20px 250px 20px;
	background-color: #f5f5f5;
}
#top4_cont {
	position: relative;
	max-width: 1024px;
	width: 100%;
	margin: 0 auto;
	text-align: right;
}
#top4 ul {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	margin-top: -80px;
}
#top4 ul:after {
	content:"";
	display: block;
	width: calc(100%/3 - 20px);
}
#top4 ul li {
	flex-basis: calc(100%/3 - 20px);
	margin-top: 30px;
	padding: 0 20px 20px 20px;
	border-radius: 5px;
	box-shadow: 5px 5px 10px rgba(0, 0, 0, .04);
	font-size: 1.2rem;
	background-color: #fff;
	text-align: center;
}
#top4 ul li img {
	display: block;
	width: 100%;
	margin: 0 auto 20px auto;
	border-radius: 5px 5px 0 0;
}
#top4 .position {
	margin-right: 10px;
	font-size: .8rem;
}
#top4 .president {
	display: flex;
	align-items:center;
	justify-content: space-between;
	margin-bottom: 80px;
	padding: 20px;
	border-radius: 5px;
	box-shadow: 5px 5px 10px rgba(0, 0, 0, .04);
	background-color: #fff;
	text-align: left;
}
#top4 .president_left {
	flex-grow: 1;
	flex-basis: calc(100%/3 - 30px);
	padding-right: 15px;
	overflow: hidden;
}
#top4 .president_right {
	flex-grow: 5;
	flex-basis: calc(100%/3 - 30px);
	padding-left: 15px;
	text-align: justify;
}
#top4 .president_right p {
	margin-bottom: 10px;
}
#top4 .president_right p:first-child {
	margin-bottom: 30px;
	padding-bottom: 10px;
	border-bottom: dashed 1px #b3b3b3;
	font-size: 2rem;
}
#top4 .president_right p:nth-child(2) {
	font-size: 1.2rem;
}
#top4 .president img {
	max-width: 100%;
	border-radius: 5px;
}
/*--------------------------------------*/


/*----------------------------------------

top5 : gallery

----------------------------------------*/
#top5 {
	position: relative;
	width: 100%;
	padding: 50px 0;
	background-color: #f7f5c3;
}
#top5_h2_wrap {
	position: relative;
	max-width: 1024px;
	width: calc(100% - 40px);
	margin: 0 auto;
}
#top5_cont {
	display: flex;
	overflow: hidden;
}
#h2-event {
	margin-bottom: 30px !important;
}
#top5 #event {
	margin: 50px auto 100px auto;
}
#top5 #event ul {
	display: flex;
	justify-content: center;
}
#top5 #event ul li {
	flex-basis: calc(100%/2 - 10px);
	flex-shrink: 0;
	margin: 0 10px;
}
#top5 #event img {
	width: 100%;
	height: auto;
}
#top5_cont ul {
	display: flex;
	animation : infinity-scroll-left 95s infinite linear .5s both;
}
#top5_cont ul li {
	width: 380px;
	margin: 0 10px;
	padding-bottom: 10px;
}
#top5_cont ul li img {
	width: 100%;
	border-radius: 5px;
	box-shadow: 5px 5px 10px rgba(0, 0, 0, .07);
}
/*--------------------------------------*/


/*----------------------------------------

top6 : news

----------------------------------------*/
#top6 {
	position: relative;
	width: 100%;
	padding: 0 20px;
	background-color: #f5f5f5;
}
#top6_cont {
	position: relative;
	max-width: 1024px;
	width: 100%;
	margin: 0 auto;
	padding: 80px 0 265px 0;
	text-align: center;
}
#top6 ul {
	padding: 30px;
	border-radius: 5px;
	box-shadow: 5px 5px 10px rgba(0, 0, 0, .04);
	background-color: #fff;
	text-align: left;
}
#top6 ul li {
	padding: 20px 30px;
	border-top: dashed 1px #b3b3b3;
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden;
}
#top6 ul li:last-child {
	border-bottom: dashed 1px #b3b3b3;
}
#top6 .date {
	display: block;
	color: #606060;
	font-size: .8rem;
}
#top6 ul li a {
	color: #333;
	text-decoration: underline;
}
#top6 ul li a:hover {
	text-decoration: none;
}
/*--------------------------------------*/


/*----------------------------------------

footer

----------------------------------------*/
footer {
	position: relative;
	padding: 150px 20px;
	color: #fff;
	background-color: #76573c;
}
footer:before {
	content: "";
	position: absolute;
	top: -85px;
	right: 0;
	left: 0;
	max-width: 1024px;
	width: 100%;
	height: 85px;
	margin: 0 auto;
	background-image: url("../img/deco-footer.svg");
	background-size: cover;
	background-position: center;
}
footer #footer_cont {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	max-width: 1024px;
	width: 100%;
	margin: 0 auto;
}
footer #footer_left,
footer #footer_right {
	flex-basis: calc(100%/2 - 30px);
}
footer ul {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
footer ul li {
	position: relative;
	flex-basis: calc(100%/3 - 30px);
	margin-bottom: 30px;
}
footer ul li:last-child {
	display: none;
}
footer ul li:after {
	content: ">";
	position: absolute;
	top: 0;
	right: 0;
}
footer ul li a {
	color: #fff;
}
footer img {
	height: 45px;
	margin-bottom: 20px;
}
footer .copy {
	display: block;
	width: 100%;
	margin-top: 50px;
	font-size: .8rem;
	text-align: right;
}
footer ul:after {
	content:"";
	display: block;
	width: calc(100%/3 - 30px);
}
/*--------------------------------------*/


/*----------------------------------------
移転お知らせ
----------------------------------------*/
.iten {
	max-width: 500px;
	width: calc(100% - 2em);
	margin: 2em auto 0 auto;
	padding: 1em;
	border-radius: 5px;
	font-size: .8rem;
	background-color: #f7f5c3;
}
.jyusyo {
	margin: .5em 0 1em 0 ;
	padding: .5em;
	border: 1px solid #333;
}
.slider img {
	width: 100%;
	height: auto;
	object-fit: cover;
	aspect-ratio: 4/3;
}