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


/*********************************************************

					　　　　初期設定

**********************************************************/

html{
	font-size: 62.5%; /*1rem=10px*/
	box-sizing: border-box;
	scroll-behavior: smooth;
}

body{
	display: inline-block;
	width: 100%;
	margin: 0 auto;
	line-height: 1.5;
	font-family: 'Noto Sans JP', sans-serif;
	color: #444;
	animation: fadeIn 2s ease 0s 1 normal;
	-webkit-animation: fadeIn 2s ease 0s 1 normal;
	-webkit-text-size-adjust: 100%;
}
@keyframes fadeIn {
    0% {opacity: 0.1}
    100% {opacity: 1}
}

@-webkit-keyframes fadeIn {
    0% {opacity: 0.1}
    100% {opacity: 1}
}

@font-face {
	font-family: 'Noto Sans JP';
	src: url(../css/slick/fonts/Noto_Sans_JP/NotoSansJP-Regular.otf);
}



/*********************************************************

					ここから全体汎用クラス

**********************************************************/


.t8{
	font-size: 0.8rem
}

.t9{
	font-size: 0.9rem
}

.t10{
	font-size: 1rem
}

.t11{
	font-size: 1.1rem
}

.t12{
	font-size: 1.2rem
}

.t13{
	font-size: 1.3rem
}

.t14{
	font-size: 1.4rem
}

.t15{
	font-size: 1.5rem
}

.t16{
	font-size: 1.6rem
}

.t17{
	font-size: 1.7rem
}

.t18{
	font-size: 1.8rem
}

.t19{
	font-size: 1.9rem
}

.t20{
	font-size: 2rem
}

.t20ex{
	font-size:min(1.6vw,2rem)
}

.t21{
	font-size: 2.1rem
}

.t22{
	font-size: 2.2rem
}

.t23{
	font-size: 2.3rem
}

.t24{
	font-size: 2.4rem
}

.t25{
	font-size: 2.5rem
}

.t26{
	font-size: 2.6rem
}

.t27{
	font-size: 2.7rem
}

.t28{
	font-size: 2.8rem
}

.t29{
	font-size: 2.9rem
}

.t30{
	font-size: 3rem
}

.t31{
	font-size: 3.1rem
}

.t32{
	font-size: 3.2rem
}

.t33{
	font-size: 3.3rem
}

.t34{
	font-size: 3.4rem
}

.t35{
	font-size: 3.5rem
}

.t36{
	font-size: 3.6rem
}

.t37{
	font-size: 3.7rem
}

.t38{
	font-size: 3.8rem
}

.t39{
	font-size: 3.9rem
}

.t40{
	font-size: 4rem
}

.t45{
	font-size: 4.5rem
}

.t50{
	font-size: 5rem
}

.t55{
	font-size: 5.5rem
}

.t60{
	font-size: 6rem
}

.t65{
	font-size: 6.5rem
}

.t70{
	font-size: 7rem
}

.t75{
	font-size: 7.5rem
}

.t80{
	font-size: 8rem
}

.t85{
	font-size: 8.5rem
}

.t90{
	font-size: 9rem
}

.t95{
	font-size: 9.5rem
}

.t100{
	font-size: 10rem
}

.lh10{
	line-height: 1;
}

.lh11{
	line-height: 1.1;
}

.lh12{
	line-height: 1.2;
}

.lh13{
	line-height: 1.3;
}

.lh14{
	line-height: 1.4;
}

.lh15{
	line-height: 1.5;
}

.lh16{
	line-height: 1.6;
}

.lh17{
	line-height: 1.7;
}

.lh18{
	line-height: 1.8;
}

.lh19{
	line-height: 1.9;
}

.lh20{
	line-height: 2.0;
}

.lh22{
	line-height: 2.2;
}

.lh27{
	line-height: 2.7;
}

.fwb{
	font-weight: bold;
}

.fwl{
	font-weight: lighter;
}

.fw1{
	font-weight: 100;
}

.fw2{
	font-weight: 200;
}

.fw3{
	font-weight: 300;
}

.fw4{
	font-weight: 400;
}

.fw5{
	font-weight: 500;
}

.fw6{
	font-weight: 600;
}

.fw7{
	font-weight: 700;
}

.fw8{
	font-weight: 800;
}

.fw9{
	font-weight: 900;
}

.ma0a{
	margin: 0 auto;
}

.mt5{
	margin-top: 5px;
}

.mt10{
	margin-top: 10px;
}

.mt15{
	margin-top: 15px;
}

.mt20{
	margin-top: 20px;
}

.mt25{
	margin-top: 25px;
}

.mt30{
	margin-top: 30px;
}

.mt35{
	margin-top: 35px;
}

.mt40{
	margin-top: 40px;
}

.mt50{
	margin-top: 50px;
}

.mt60{
	margin-top: 60px;
}

.mt70{
	margin-top: 70px;
}

.mt80{
	margin-top: 80px;
}

.mt90{
	margin-top: 90px;
}

.mt100{
	margin-top: 100px;
}

.mt120{
	margin-top: 120px;
}

.mt160{
	margin-top: 160px;
}

.mt-20{
	margin-top: -20px;
}

.mt18vh{
	margin-top: 18vh;
}

.mb5{
	margin-bottom: 5px;
}

.mb10{
	margin-bottom: 10px;
}

.mb15{
	margin-bottom: 15px;
}

.mb20{
	margin-bottom: 20px;
}

.mb25{
	margin-bottom: 25px;
}

.mb30{
	margin-bottom: 30px;
}

.mb35{
	margin-bottom: 35px;
}

.mb40{
	margin-bottom: 40px;
}

.mb50{
	margin-bottom: 50px;
}

.mb60{
	margin-bottom: 60px;
}

.mb70{
	margin-bottom: 70px;
}

.mb80{
	margin-bottom: 80px;
}

.mb90{
	margin-bottom: 90px;
}

.mb100{
	margin-bottom: 100px;
}

.mb120{
	margin-bottom: 120px;
}

.mb200{
	margin-bottom: 120px;
}

.ml5{
	margin-left: 5px;
}

.ml10{
	margin-left: 10px;
}

.ml15{
	margin-left: 15px;
}

.ml20{
	margin-left: 20px;
}

.ml25{
	margin-left: 25px;
}

.ml30{
	margin-left: 30px;
}

.ml35{
	margin-left: 35px;
}

.ml40{
	margin-left: 40px;
}

.ml55{
	margin-left: 55px;
}

.ml65{
	margin-left: 65px;
}

.ml5p{
	margin-left: 5%;
}

.ml7p{
	margin-left: 7%;
}

.ml9p{
	margin-left: 9%;
}

.ml11p{
	margin-left: 11%;
}

.ml-5p{
	margin-left: -5%;
}

.ml-7p{
	margin-left: -7%;
}

.ml-10p{
	margin-left: -10%;
}

.mr5{
	margin-right: 5px;
}

.mr10{
	margin-right: 10px;
}

.mr15{
	margin-right: 15px;
}

.mr20{
	margin-right: 20px;
}

.mr25{
	margin-right: 25px;
}

.mr30{
	margin-right: 30px;
}

.mr35{
	margin-right: 35px;
}

.mr40{
	margin-right: 40px;
}

.mr50{
	margin-right: 50px;
}

.mr60{
	margin-right: 60px;
}

.mr65{
	margin-right: 65px;
}

.k{
	color: #444;
}

.k8{
	color: #888;
}

.kc{
	color: #ccc;
}

.w{
	color: #fff;
}

.red{
	color: #e60033;
}

.w60{
	color: #bbb;
}

.w20{
	color: #555;
}

.co{
	color: #EF857D;
}

.co1-1{
	color: #6A8FD4;
}

.co1-2{
	color: #75AFE9;
}

.co1-3{
	color: #89D0F2;
}

.co2-1{
	color: #F18A99;
}

.co2-2{
	color: #F4A3A9;
}

.co2-3{
	color: #F4C2C1;
}

.co3-1{
	color: #FE9839;
}

.fl-l{
	float: left;
}

.fl-r{
	float: right;
}

.ta-c{
	text-align: center;
}

.ta-l{
	text-align: left;
}

.ta-r{
	text-align: right;
}

.ta-j{
	text-align: justify;
	text-justify: inter-ideograph;
}

.flex{
	display: flex;
	justify-content: space-between; 
	align-items: center;
}

.flex2{
	display: flex;
	justify-content: flex-start;
	align-items: center;
}

.flex3{
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	border-radius: 10px;
}

.flex4{
	display: flex;
	justify-content:space-between;
	align-items: stretch;
}


.flex5{
	display: flex;
	justify-content: flex-start;
}

.flex6{
	display: flex;
	justify-content:space-between;
	align-items: stretch;
	flex-wrap: wrap;
}

.flex7{
	display: flex;
	justify-content: space-between; 
}

.flex8{
	display: flex;
	justify-content: space-between; 
	flex-wrap: wrap;
	align-items: flex-start;
}

.p-r{
	position: relative;
}

.link-btn{
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
}

.block{
	display: block;
}

.inblock{
	display: inline-block;
}

.op30{
	opacity: 0.3;
}

.op50{
	opacity: 0.5;
}

.width70{
	width: 70%;
}

.ls30{
	letter-spacing: 0.3em;
}

.pankuzu ul{
  list-style: none;
  font-size: .8em;
}
.pankuzu li{
  display: inline;
}
.pankuzu li a{
  color: inherit;
  text-decoration: none;
}
.pankuzu li + li:before{
  content: ">";
  margin-right:.3em;
}
/*********************************************************

				  以下共通設定

**********************************************************/
a {
	text-decoration: none;
}

a,a:hover,a:visited{
	color: inherit;
}


/*********************************************************
					ここからヘッダー
**********************************************************/
header {
	width: 100%;
	display: flex;
	position: fixed;
	z-index: 9999;
	top: 0;
	height: 100px;
	background: #fff;

}

.header-inner {
	display: flex;
	align-items: stretch;
	justify-content: space-between;
	width: 1246px;
	height: 100%;
	max-width: calc(100vw - 30px);
	margin: 0 auto;
}
.logo {
	width: 260px;
	margin-top: 16px;
}

.menu {
	display: flex;
	margin:0 0 0 auto;
	padding-top: 40px;
}

.menu ul {
	display: flex;
	list-style: none;
	margin: 0 5px;
}

.menu ul li  {
	border-right: 2px solid #000;
	padding: 0 20px;
}

.instalogo {
	width: 30px;
	padding: 0 10px;
}


.dumyspace {
	max-width: 1000px;
	height: 22vw;
	max-height: 100px;
}

/*********************************************************
			ここからBackToTop
**********************************************************/


.triangleUp {
	width:0;
	height:0;
	margin: 0 auto;
	padding-top: 12px;
	border-right:18px solid transparent;
	border-left:18px solid transparent;
	border-bottom:30px solid #E0C986;	
}

.backtotop {
	position: fixed;
	text-align: center;
	align-items: center;
	justify-content: center;
	right: 10px;
	bottom: 10px;
	width: 80px;
	height: 80px;
	border: solid 2px #CECFD1;
	border-radius: 20px;
	color: #C2940F;
	background: #fff;
	transition: .3s;
	/* 非表示にする */
	opacity: 0;
	visibility: hidden;
	cursor: pointer;
	cursor: hand;
}

.is-active {
	/* 表示する */
	opacity: 1;
	visibility: visible;
}


/*********************************************************
					ここからフッター_footer
**********************************************************/
footer {
	width: 100%;
	margin: 0 auto;
	padding: 30px 0 0px;
}

.footer_logo_img {
	width: 100%;
}

.footer-inner {
	display: flex ;
	width: 85%;
	justify-content: center;
	align-items: center;
	margin: 0 auto;
	gap: 0px 62px;
}

.footer_address-info {
	padding: 16px 0 0 20px;
	font-size: min(1.9vw,1.8rem);
	line-height: 34px;
}


.footer_address {
	padding: 24px 0 0 30px;
	text-align: center;
	font-size: min(1.9vw,1.8rem);
}

.footer_address a {
	font-size: 14px;
	border-bottom: 1px solid #000;

}
.footer_address a::after {
	display: inline-block;
	content: '';
	height: 0.8em; 
	aspect-ratio: 1 / 1;
	background: url(../img/arrow.webp) no-repeat center / contain;
}

.footer_period {
	border-bottom: 2px solid #8CAB6D;
}

.footer_time {
	padding-top: 10px;
	border-bottom: 2px solid #8CAB6D;
}

.footer-bottom {
	width: 100%;
	padding: 36px 0;
	margin: 20px auto 0 auto;
	background: #C2940F;
}

.footer-bottom_link {
	display: flex;
	padding-left: 89px;
	justify-content: space-around;
	width: 80%;
	max-width: 1000px;
	margin: 0 auto;
}

.footer-bottom p {
	margin: 0 auto;
	color: #fff;
}

.copyright_p {
	padding: 12px 0 0;
	text-align: center;
}

.footer_addressinfomation {
	display: flex;
}

.googlemapicon {
	width: 108px;
}

.footer_time-info {
	padding-left: 1.4vw;
}
/****************************************************************************************************************************
			ここからメディアクエリ(タブレット）1000px
*****************************************************************************************************************************/
@media screen and (max-width: 1000px){
	.pc{display: none;}
	.sp{display: none;}
	.tb{display: block;}
	.brpc{display: none;}
	.brsp{display: none;}
	.brtb{display: block;}


/*********************************************************
					ハンバーガーメニュー_メディアクエリ(タブレット）1000px
**********************************************************/

.menubar_wrap {
	position: absolute;
	top: 50%;
	right: 4%;
	transform: translateY(-50%);
	z-index: 10;
	width: 10%;
	max-width: 40px;
	aspect-ratio: 1/1;
}

.menubar {
	position: absolute;
	top: 50%;
	width: 100%;
	max-width: 70px;
	height: 2px;
	background: #000;

}

.menubar::before {
	position: absolute;
	content: "";
	top: -1.4vw;
	left: 0;
	width: 100%;
	height: 100%;
	transition: ease 0.2s;
	background: #000;

}

.menubar::after {
	position: absolute;
	content: "";
	left: 0;
	bottom: -1.4vw;
	width: 100%;
	height: 100%;
	transition: ease 0.2s;
	background: #000;

}

.menubar_wrap.show .menubar {
	background: none;
}

.menubar_wrap.show .menubar::before{
	transform-origin: left top;
	transform: translateX(16%) rotate(45deg) ;
	top: -12px;
}

.menubar_wrap.show .menubar::after{
	transform-origin: left top;
	transform: translateX(12%) rotate(-45deg);
	bottom: -16px;
}

/* ハンバーガーのマーク */
.menu_sp {
	position: fixed;
	top: 10vw;
	right: 1vw;
}

.nav_toggle {
	display: block;
	position: relative;
	z-index: 2;
	width: 4.75rem;
	height: 3.5rem;
	margin-right: 10px;
}

.nav_toggle i {
	position: absolute;
	display: block;
	width: 100%;
	height: 2px;
	transition: transform 0.5s, opacity 0.5s;
	background-color: #333;
}

.nav_toggle i:nth-child(1) {
	top: 0;
}

.nav_toggle i:nth-child(2) {
	top: 0;
	bottom: 0;
	margin: auto;
}

.nav_toggle i:nth-child(3) {
	bottom: 0;
}

/* クリックで表示されるメニュー：クリックされる前 */
.nav {
	position: fixed;
	align-items: center;
	justify-content: center;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 1;
	width: 100%;
	height: 100vh;
	opacity: 0;
	visibility: hidden;
	transition: opacity 0.5s, visibility 0.5s;
	background-color: rgba(255,255,255,0.9);
	}

.nav_wrap {
	width: 80%;
	height: 80%;
	margin-left: 10%;
	margin-top: 10%;
	}

.nav_menu_li {
	display: flex;
	justify-content: center;
	align-items: center;
	height: 16.66%;
	text-align: center;
	border-top: 1px solid #000;
}

.nav_menu_li a {
	text-decoration: none;
	font-size: max(3vw,1.8rem);
	color: #000;
}

/* クリックで表示されるメニュー：クリックされた後 */
.nav.show {
	opacity: 1;
	visibility: visible;
}

.insta_sp {
	width: 100%;
	height: 16.66%;
	display: flex;
	justify-content: center;
	align-items: center;
	margin: 0 auto;
	text-align: center;
	border-top: 1px solid #000;
}

.instalogo_sp {
	height: 100%;
}

.spmenu_logo {
	height: 100%;
}

.sp_menu_logo {
	height: 15%;
	margin-bottom: 5%;
	text-align: center;
}

.nav_menu_ul {
	height: 80%;
	width: 100%;
}

.insta_sp a {
	height: 50%;
}

/*********************************************************
					ここからヘッダー
**********************************************************/
.menu {
	display: none;
}

header {
	height: auto;
	max-width: 1000px;
	padding: 1vw 0;
}

.header-inner {
	display: block;
	width: 90%;
	line-height: 0;
}

.logo_sp {
	width: 23vw;
	height: auto;
	margin: 0 auto;

}

.logo_sp_a {
	display: inline-block;
	width: 100%;
	height: 7vw;
}

.dumyspace {
	height: 9vw;
}

.slick-dots li button:hover:before,
.slick-dots li button:focus:before {
        opacity: .25;
    }

.slick-dots li.slick-active button:before
	{
		opacity: .75;
		color: black;
	}


/*********************************************************
			ここからBackToTop
**********************************************************/
.triangleUp {
	padding-top: 16%;
	border-right: 14px solid transparent;
	border-left: 14px solid transparent;
	border-bottom: 23px solid #E0C986;
}

.backtotop {
	width: 40px;
	height: 40px;
	border-radius: 50%;
}

/*********************************************************
					ここからフッター_footer
**********************************************************/
.footer-inner {
	width: 92%;
	gap: 0px 0px;
}

.footer_logo_img {
	width: 80%;
}

.footer_time-info {
	white-space: nowrap;
}

.telephone_number {
	white-space: nowrap;
}
}
/*********************************************************

				  以下メディアクエリ 1000

**********************************************************/

@media screen and (max-width:767px){
	.t45{
		font-size: 2.8rem;
	}
	
	.cause .inner2 .flex{
		display: block;
	}
}

/*********************************************************************************
			   ここからメディアクエリ(SP） 750px
**********************************************************************************/

@media screen and (max-width: 750px){
	.pc{display: none;}
	.sp{display: block;}
	.brpc{display: none;}
	.brsp{display: block;}


/*********************************************************
					ここからヘッダー
**********************************************************/
.logo_sp_a {
	height: 9vw;
	min-height: 50px;
}
.logo_sp {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
	margin: 0 auto;
}

header {
	max-width: 1000px;
}

.header-inner {
	display: block;
	width: 36%;
}

.menubar_wrap {
	width: 8%;
    max-width: 40px;
}

.menubar::before {
	top: -2vw;
}

.menubar::after {
	bottom: -2vw;
}

.menubar_wrap.show .menubar {
	background: none;
}

.menubar_wrap.show .menubar::before{
	transform-origin: left top;
	transform: translateX(12%)rotate(45deg) ;
	top: -17px;
}

.menubar_wrap.show .menubar::after{
	transform-origin: left top;
	transform: translateX(12%)rotate(-45deg);
	bottom: -11px;
}

.dumyspace {
	height: 11vw;
}

.logo_sp {
	width: 28vw;
}

/*********************************************************
					ここからフッター_footer
**********************************************************/
.footer-inner {
	display: block;
	text-align: center;
}

.footer_logo_img {
	display: none;
}

.footer_logo_img_sp {
	width: min(60vw,338px);
	margin: 0 auto;
}

.footer_addressinfomation {
	display: block;
}

.footer_address-info {
	padding: 16px 0 0 0px;
	font-size: min(4vw,1.8rem);
	line-height: 2em;
}

.footer_address {
	width: 80%;
	padding: 20px 0 0;
	margin: 0 auto;
	text-align: center;
	font-size: min(4vw,1.8rem);
}

.footer_time {
	padding-top: 20px;
	padding-bottom: 10px;

}

.footer_period {
	padding-bottom: 10px;
}

.footer-bottom_link {
	display: none;
}
.footer_period-info,.footer_time-info {
	padding-top: 10px;
}


/*********************************************************
					ここからフッターの下_footer-bottom
**********************************************************/
.footer-bottom {
	padding: 10px 0 20px;
}
}

/*********************************************************************************
					ここからメディアクエリ(SP） 500px
**********************************************************************************/

@media screen and (max-width: 500px){
	.pc{display: none;}
	.sp{display: block;}
	.brpc{display: none;}
	.brsp{display: block;}

.menubar_wrap.show .menubar::before {
  top: -2.8vw;
}

.menubar_wrap.show .menubar::after {
	bottom: -2.5vw;
}
}
