@charset "utf-8";

html 					{ overflow-x: hidden; font-size: 62.5%; }
body					{ font-family: hiragino-mincho-pron, sans-serif; font-weight: 300; font-style: normal; line-height: 1; color: #000; position: relative; }

video {
	-webkit-filter: drop-shadow(0px 0px rgba(0,0,0,0));
	filter: drop-shadow(0px 0px rgba(0,0,0,0));
	outline: none;
	border: none;
}


.garamondPro{ font-family: "adobe-garamond-pro", serif;
font-weight: 600;
font-style: normal; }


.libre-baskerville{
	font-family: "Libre Baskerville", serif;
	font-weight: 400;
	font-style: normal;
}



.fade{ display: block; color: transparent; background-clip: text; -webkit-background-clip: text; background-size: 300% 300%; }
.active .fade.to__right{ background-image: -webkit-gradient(linear, left top, right top, color-stop(30%, #595757), color-stop(60%, rgba(89, 87, 87, 0))); background-image: linear-gradient(to right, #595757 30%, rgba(89, 87, 87, 0) 60%); background-position: left 100% center; -webkit-animation: toRight var(--duration, 2.4s) var(--ease) var(--delay, 0.6s) forwards; animation: toRight var(--duration, 2.4s) var(--ease) var(--delay, 0.6s) forwards; }

.fadeInRight{ opacity: 0; -webkit-transform: translateX(20px); transform: translateX(20px); -webkit-transition: 1s; transition: 1s; }
.fadeInRight>a article{ opacity: 0; -webkit-transition: 1s; transition: 1s; }
.fadeInRight>a article{ opacity: 0; -webkit-transition: 1s; transition: 1s; }
.fadeInRight>a:nth-of-type(1) article{  }
.fadeInRight>a:nth-of-type(2) article{ -webkit-transition-delay: .1s; transition-delay: .2s }
.fadeInRight>a:nth-of-type(3) article{ -webkit-transition-delay: .2s; transition-delay: .2s; }
.fadeInRight>a:nth-of-type(4) article{ -webkit-transition-delay: .3s; transition-delay: .3s; }
.fadeInRight>a:nth-of-type(5) article{ -webkit-transition-delay: .4s; transition-delay: .4s; }
.fadeInRight>a:nth-of-type(6) article{ -webkit-transition-delay: .5s; transition-delay: .5s; }
.fadeInRight>a:nth-of-type(7) article{ -webkit-transition-delay: .6s; transition-delay: .6s; }
.fadeInRight>a:nth-of-type(8) article{ -webkit-transition-delay: .7s; transition-delay: .7s; }
.fadeInRight>a:nth-of-type(9) article{ -webkit-transition-delay: .8s; transition-delay: .8s; }
.fadeInRight>a:nth-of-type(10) article{ -webkit-transition-delay: .9s; transition-delay: .9s; }

.active .fadeInRight{ opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); }
.active .fadeInRight>a article{ opacity: 1; }


main 					{ position: relative; z-index: 1; }
img 					{ vertical-align: bottom; max-width: 100%; height: auto; }
svg 					{ vertical-align: bottom; max-width: 100%; height: auto; }
h1,h2,h3,h4,h5,p,dl,dt,dd{ margin: 0; font-weight: 400; line-height: 1.5; }
p,dl,dt,dd 				{ line-height: 1.5; text-align: justify; }
hr 						{  }
figure 					{ margin: 0; }
.thumbImage 			{ height: auto; }

.grecaptcha-badge{ z-index: 9999; }

body{ background: url('../img/bg-w.png') 0 0 repeat; background-size: 250px; }

@media print, screen and (min-width: 751px) {
.sp 					{ display: none!important; }
body 					{ padding-top: 0; font-size: 1.6rem; }
a 						{ -webkit-transition: .3s; transition: .3s; }
a:hover 				{ opacity: .6; }
.master 				{ width: 92%; max-width: 1110px; margin: 0 auto; }

/*a 						{ -webkit-transition: .2s; transition: .2s; }
a:hover 				{ opacity: .5; }*/


#header 				{ width: 100%; height: 80px; margin: 0; position: fixed; top: 0; left: 0; background-color: transparent; z-index: 99; border-bottom: 0; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-transition: .3s; transition: .3s; overflow: hidden; }
.is-fixed #header{ background: #fff; }
#header>.master 		{ max-width: 960px; position: relative; }
#header>.logo 			{ margin: 22px 0 0 32px; }
#header>.logo img 		{ display: block; }

#header>.logo .logoB{ display: none; }
.is-fixed #header>.logo .logoW{ display: none; }
.is-fixed #header>.logo .logoB{ display: block; }

#header>#nav .iconC{ display: none; }
.is-fixed #header>#nav .iconW{ display: none; }
.is-fixed #header>#nav .iconC{ display: block; }

#header>#nav ul li a{ color: #fff; }
.is-fixed #header>#nav ul li a{ color: #000; }

#header #nav{ margin: 0 0 0 auto; }
#header #nav ul{ display: -webkit-box; display: -ms-flexbox; display: flex; }
#header #nav ul li{ margin-right: 23px; }
#header #nav ul li.instagram{ margin-right: 43px; margin-left: 18px; }
.drawer-nav>ul>li.instagram img{ width: 18px; }
#header #nav ul li a{ padding: 32.5px 0; font-size: 1.5rem; letter-spacing: .08em; display: block; }
#header #nav ul li.contact{ margin-right: 0; }
#header #nav ul li.contact a{ padding: 27px 33px; color: #fff; }
.is-fixed #header #nav ul li.contact a{ background-color: #ac2d00; }
#header #nav ul li.contact .icon{ padding-left: 30px; font-size: 2.6rem; letter-spacing: .03em; background: url('../img/tel-icon-w.svg') 0 50% no-repeat; }

#footer{ margin-top: 69px; padding: 13px 0; background-color: #000; }
#footer .copyright{ font-size: 1.0rem; text-align: center; letter-spacing: .05em; color: #fff; }
}


@media screen and (max-width: 1050px) and (min-width: 751px) {
#header>.logo{ width: 130px; margin: 22px 0 0 15px; }
#header #nav ul li{ margin-right: 15px; }
#header #nav ul li a{ padding: 33px 0; font-size: 1.4rem; }
#header #nav ul li.instagram{ margin-right: 20px; margin-left: 5px; }
#header #nav ul li.contact a{ padding: 28px 15px; }
#header #nav ul li.contact .icon{ font-size: 2.4rem; }
}


@media screen and (max-width: 850px) and (min-width: 751px) {
#header>.logo{ width: 120px; margin: 22px 0 0 10px; }
#header #nav ul li{ margin-right: 13px; }
#header #nav ul li a{ padding: 33.5px 0; font-size: 1.3rem; }
#header #nav ul li.instagram{ margin-right: 15px; margin-left: 0px; }
#header #nav ul li.contact a{ padding: 29px 10px; }
#header #nav ul li.contact .icon{ font-size: 2.2rem; }
}



@media screen and (max-width: 750px) {
.pc 					{ display: none!important; }
body 					{ font-weight: 500; font-size: 14px!important; overflow-x: hidden; }
.drawer-open body 		{ overflow: hidden!important; }
.master 				{ width: 92%; margin: 0 auto; }


#header 				{ width: 100%; height: 65px; margin: 0; position: fixed; top: 0; left: 0; background-color: transparent; z-index: 99; border-bottom: 0; -webkit-transition: .3s; transition: .3s; }
#header>.master 		{ max-width: 960px; position: relative; }
#header>.logo 			{ width: 150px; margin: 12px 0 0 15px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; position: relative; z-index: 99999; }

#header>.logo img 		{ display: block; }

#header>.logo .logoB{ display: none; }
.is-fixed #header>.logo .logoW{ display: none; }
.is-fixed #header>.logo .logoB{ display: block; }

#header #nav>ul 		{ height: 100vh; padding-top: 95px; opacity: 0; -webkit-transform: translateX(40px); transform: translateX(40px); position: relative; -webkit-transition: .3s; transition: .3s; -webkit-transition-delay: 0s; transition-delay: 0s; }
.drawer-open #header #nav>ul{ opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); -webkit-transition: .5s; transition: .5s; -webkit-transition-delay: .4s; transition-delay: .4s; }

.drawer-hamburger-icon{ background-color: #fff; }
.drawer-hamburger-icon:after, .drawer-hamburger-icon:before{ background-color: #fff; height: 2px; }
/*.drawer-open .drawer-hamburger-icon:after, .drawer-open .drawer-hamburger-icon:before{ background-color: #fff; }*/
.drawer-hamburger-icon:before{ top: -7px; }
.drawer-hamburger-icon:after{ top: 7px; left: auto; right: 0; }
.drawer-hamburger 		{ width: 48px; height: 48px; padding: 10px; top: 8px; right: 8px; z-index: 10002; border-radius: calc(1px * infinity); border: 1px solid #fff; }
.drawer-hamburger-icon 	{  }
.drawer-open .drawer-overlay{ display: none; }
.drawer-nav 			{ /*max-width: 400px;*/ top: 0; right: -400px; left: auto; background-color: transparent; z-index: 10001; }
.drawer-open .drawer-nav{ top: 0; right: 0; }
.drawer-open .drawer-hamburger-icon,.drawer-open .drawer-hamburger-icon:after,.drawer-open .drawer-hamburger-icon:before{ -webkit-box-shadow: none; box-shadow: none; }
.drawer-menu li a 		{  }
#header .drawer-menu-item{ width: 100%; margin: 0; padding: 15px 30px; color: #fff; text-align: left; font-weight: bold; display: inline-block; font-weight: 400; font-size: 1.6rem; letter-spacing: .1em; }
#header .drawer-menu-item:hover{ opacity: 1; }
.drawer-nav 			{ height: 100vh; background: transparent; -webkit-transition: .5s; transition: .5s; overflow-x: hidden; }
.drawer-nav>ul>li 		{ width: 100%; margin:10px auto 0; }
.drawer-nav>ul>li:first-of-type{ margin-top: 0; }
.drawer-open .drawer-nav{ background-color: #ac2d00; }
.drawer-open .drawer-hamburger-icon:after, .drawer-open .drawer-hamburger-icon:before{ width: 100%; top: 0; background: #fff; }


.is-fixed #header{ background-color: rgba(255,255,255,.8); }
.is-fixed .drawer-hamburger-icon{ background-color: #000; }
.is-fixed .drawer-hamburger-icon:after,.is-fixed .drawer-hamburger-icon:before{ background-color: #000; }
.is-fixed .drawer-hamburger{ border-color: #000; }

.drawer-open .is-fixed .drawer-hamburger-icon{ background-color: transparent; }
.drawer-open .is-fixed .drawer-hamburger{ border-color: #fff }
.drawer-open .is-fixed .drawer-hamburger-icon:after,.drawer-open .is-fixed .drawer-hamburger-icon:before{ background-color: #fff; }
.drawer-open .is-fixed #header>.logo .logoB{ display: none; }
.drawer-open .is-fixed #header>.logo .logoW{ display: block; }


#header .drawer-menu-item{ font-size: 1.8rem; }
#header .drawer-menu-item>span{ margin-top: 6px; display: block; font-size: 1.2rem; }
.drawer-nav>ul>li.instagram{ margin-top: 60px; }
.drawer-nav>ul>li.instagram img{ width: 24px; }
.drawer-nav>ul>li.instagram .iconC{ display: none; }
#header .drawer-nav>ul>li.contact{ margin-top: 30px; }
#header .drawer-nav>ul>li.contact .drawer-menu-item{ width: 80%; margin: 0 auto; display: block; border: 1px solid #fff; text-align: center; }
#header .drawer-nav>ul>li.contact .drawer-menu-item .sp{ font-size: 1.2rem; }
#header .drawer-nav>ul>li.contact .drawer-menu-item .icon{ margin-top: 10px; padding: 0 0 0 25px; font-size: 2.34rem; display: inline-block; background: url('../img/tel-icon-w.svg') 0 50% no-repeat; background-size: 20px; }

#footer{ margin-top: 60px; padding: 13px 0; background-color: #000; }
#footer .copyright{ font-size: 1.0rem; text-align: center; letter-spacing: .05em; color: #fff; }
}