@charset "UTF-8";
/* Scss Document */
/*=============================================
 * body
 *=============================================*/
body {
	color: #fff;
	font-family: "Noto Sans JP";
	font-weight: 400;
	font-style: normal;
	font-size: 14px;
	line-height: 2;
	background: url(../img/shared/bg.jpg);
	min-width: inherit;
	min-height: inherit;
	max-height: 100%;
	letter-spacing: 1.2px;
}

@media screen and (max-width: 767px) {
body {
	text-align: justify;
	line-height: 2;
	background: url(../img/shared/bg_sp.jpg) repeat-y top center;
	-webkit-background-size: 100% auto;
	background-size: 100% auto;
}
body.home {
}
}

@media screen and (min-width: 768px) {
body {
	font-size: 15px;
	line-height: 29px;
	letter-spacing: 1px;
}
 body::-webkit-scrollbar {
/*    display: none;*/
}
}
/*=============================================
 * fonts - DON'T EDIT
 *=============================================*/
.fnt-mincho {
	font-family: '游明朝', YuMincho, 'ヒラギノ明朝 ProN W3', 'Hiragino Mincho ProN', 'HG明朝E', 'メイリオ', Meiryo, 'ＭＳ Ｐ明朝', 'ＭＳ 明朝', serif;
}
.fnt-meiryo {
	font-family: 'メイリオ', Meiryo, 'ヒラギノ角ゴシックPro', 'ＭＳ ゴシック', 'Hiragino Kaku Gothic Pro', Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
}
.fnt-gothic {
	font-family: '游ゴシック', YuGothic, 'ヒラギノ角ゴ Pro', 'Hiragino Kaku Gothic Pro', 'メイリオ', 'Meiryo', Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
}
.fnt-serif {
	font-family: 'Noto Serif JP', serif;
}
.fnt-shi {
	font-family: 'Shippori Mincho', serif;
	font-weight: 400;
	font-style: normal;
}
.f500 {
	font-weight: 500;
}
html #socialbuttons {
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	align-items: center;
	justify-content: center;
	line-height: 1;
}
html #socialbuttons .social-line {
	overflow: hidden;
}
/*=============================================
 ******************* main **********************
 *=============================================*/
main {
	clear: both;
	width: 100%;
	position: relative;
	overflow: hidden;
}
.wrap {
	max-width: 1300px;
	margin-left: auto;
	margin-right: auto;
	position: relative;
}
.bg-parallax {
	position: relative;
	z-index: -1;
}
.bg-parallax .img-parallax {
	clip: rect(0, auto, auto, 0);
	margin-bottom: 0;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	z-index: 1;
}
.bg-parallax .img-parallax img {
	width: 100%;
	height: 100vh;
	position: fixed;
	top: 0;
	left: 0;
	padding: 0;
	margin: 0;
	object-fit: cover;
	z-index: 0;
	transform: translateZ(0);
}

@media screen and (min-width: 768px) {
.bg-parallax-pc {
	position: relative;
	z-index: -1;
}
.bg-parallax-pc .img-parallax-pc {
	clip: rect(0, auto, auto, 0);
	margin-bottom: 0;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	z-index: 1;
}
.bg-parallax-pc .img-parallax-pc img {
	width: 100%;
	height: 100vh;
	position: fixed;
	top: 0;
	left: 0;
	padding: 0;
	margin: 0;
	object-fit: cover;
	z-index: 0;
	transform: translateZ(0);
}
}
img {
	max-width: 100%;
	width: 100%;
	height: auto;
}
html {
	min-width: auto;
}
.txt {
	text-align: justify;
}
.txt-center {
	text-align: center;
}
.telhref {
	text-decoration: none !important;
}
.row {
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	flex-direction: column;
}
/*=============================================
===============================================
===============================================
*************** mobie first header ************
===============================================
===============================================
*=============================================*/



/*=============================================
******************* hamberger  ****************
*=============================================*/
.hamberger-btn {
	position: fixed;
	top: 0;
	right: 0;
	width: 70px;
	height: 70px;
	z-index: 201;
	transition: all 0.4s ease;
	overflow: hidden;
	background: url(../img/shared/bg07.jpg);
}
.hamberger-btn::after {
	width: 100%;
	position: absolute;
	left: 0;
	bottom: 22px;
	content: 'Menu';
	text-align: center;
	font-size: 14px;
	line-height: 1;
	color: #fff;
	letter-spacing: 1px;
	font-family: "Cormorant Garamond";
	font-style: normal;
	font-weight: 500;
	right: 0;
	display: none;
}
.hamberger-btn span {
	width: 40px;
	height: 1px;
	position: absolute;
	top: 55%;
	left: calc(50% - 20px);
	background: #fff;
	transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
	transition: transform 0.13s cubic-bezier(0.215, 0.61, 0.355, 1) 0.13s;
}
.hamberger-btn span::before {
	width: 40px;
	height: 1px;
	position: absolute;
	left: 0;
	background: #fff;
	content: '';
	transition: top 0.2s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1), transform 0.13s cubic-bezier(0.55, 0.055, 0.675, 0.19);
}
.hamberger-btn span::before {
	top: -12px;
}
.menu-open .hamberger-btn {
	border-color: transparent;
	background: transparent;
}
.menu-open .hamberger-btn span {
	transform: rotate(360deg);
}
.menu-open .hamberger-btn span {
	transform: translate3d(0, -5px, 0) rotate(-20deg);
	transition: transform 0.12s cubic-bezier(0.215, 0.61, 0.355, 1) 0.22s;
}
.menu-open .hamberger-btn span::before {
	top: 0;
	transform: rotate(-140deg);
	transition: top 0.2s cubic-bezier(0.33333, 0, 0.66667, 0.33333), transform 0.13s 0.25s cubic-bezier(0.215, 0.61, 0.355, 1);
}
.menu-open .hamberger-btn span::after {
	top: 0;
	transform: rotate(-130deg);
	transition: top 0.2s cubic-bezier(0.33333, 0, 0.66667, 0.33333), transform 0.13s 0.25s cubic-bezier(0.215, 0.61, 0.355, 1);
}
.menu-open .hamberger-btn::after {
	content: 'Close';
}
/*=============================================
******************* nav-header  ***************
*=============================================*/
.nav-header {
	width: 100%;
	height: 100vh;
	position: fixed;
	top: 0;
	left: 0;
	transition: all 0.5s ease;
	opacity: 0;
	visibility: hidden;
	overflow: auto;
}
.menu-open .nav-header {
	opacity: 1;
	visibility: visible;
}
.headerOpen__nav {
	margin-bottom: 11vw;
}
.js-scroll {
	overflow: auto;
	-webkit-overflow-scrolling: touch;
	-webkit-user-select: none;
	-webkit-touch-callout: none;
	padding-bottom: 40vw;
}

@media screen and (min-width: 768px) {
.js-scroll {
	padding-bottom: 0;
}
}
body.mfp-zoom-out-cur, body.menu-open {
	overflow-y: hidden !important;
	-webkit-overflow-scrolling: touch;
}
body.menu-open, body.menu-open *, body.menu-open *:hover, body.menu-open *:focus, body.menu-open *:active {
	pointer-events: none !important;
	-ms-touch-action: none !important;
	touch-action: none !important;
}
body.menu-open #fixed-sp, body.menu-open #fixed-sp *, body.menu-open .hamberger-btn, body.menu-open .hamberger-btn *, body.menu-open .nav-header, body.menu-open .nav-header *, body.menu-open .remodal-is-opened, body.menu-open .remodal-is-opened * {
	pointer-events: visible !important;
	-ms-touch-action: auto !important;
	touch-action: auto !important;
}

/*=============================================
******************* footer  *******************
*=============================================*/




/*=============================================
******************* btn-cus  ******************
*=============================================*/



/* iPhone X */
@media only screen and (min-device-width: 375px) and (min-device-height: 812px) and (-webkit-device-pixel-ratio: 3) and (orientation: portrait) {
footer::after {
	height: 36px;
	content: '';
	background: #000000;
	position: fixed;
	bottom: 0px;
	left: 0;
	right: 0;
	z-index: 7;
}
#ft_fixed {
	bottom: calc(env(safe-area-inset-bottom) - 0px);
}
}

/* iPhone XR */
@media only screen and (min-device-width: 414px) and (min-device-height: 896px) and (-webkit-device-pixel-ratio: 2) and (orientation: portrait) {
footer::after {
	height: 36px;
	content: '';
	background: #000000;
	position: fixed;
	bottom: 0px;
	left: 0;
	right: 0;
	z-index: 7;
}
#ft_fixed {
	bottom: calc(env(safe-area-inset-bottom) - 0px);
}
}

/* iPhone 11 */
@media only screen and (-webkit-min-device-pixel-ratio: 3), only screen and (min--moz-device-pixel-ratio: 3), only screen and (-o-min-device-pixel-ratio: 3 / 1), only screen and (min-device-pixel-ratio: 3), only screen and (min-resolution: 458dpi), only screen and (min-resolution: 3dppx) {
footer::after {
	height: 36px;
	content: '';
	background: #000000;
	position: fixed;
	bottom: 0px;
	left: 0;
	right: 0;
	z-index: 7;
}
#ft_fixed {
	bottom: calc(env(safe-area-inset-bottom) - 0px);
}
}

@media screen and (min-width: 768px) {
footer:after {
	display: none;
}
}

@media screen and (max-width: 767px) {
html.responsive .wrap {
	width: auto;
	padding: 0 6%;
}
.txt:not(.except) br:not(.except):not(.sp) {
	display: none;
}
.pc {
	display: none !important;
}
}

@media screen and (min-width: 768px) {
.sp {
	display: none !important;
}
}

/*=============================================
===============================================
===============================================
*************** css for iphone 5 ************
===============================================
===============================================
*=============================================*/
/*=============================================
===============================================
===============================================
***************** css for ie 11 ***************
===============================================
===============================================
*=============================================*/
/*=============================================
===============================================
===============================================
***************** CSS FOR PC ***************
===============================================
===============================================
*=============================================*/

@media only screen and (min-width: 768px) {
.sp {
	display: none;
}
.pc {
	display: block;
}
.txt {
	text-align: left;
}
/*--------------------------------------
    btn-cus
  --------------------------------------*/

  /*--------------------------------------
    font-size
  --------------------------------------*/
.fz40 {
	font-size: 40px;
}
span.fz40,  span.fz60,  span.fz70 {
	line-height: inherit;
}
.fz70 {
	font-size: 70px;
}
/*=============================================
 ******************** header ******************
 *=============================================*/


  /*--------------------------------------
    hamb
  --------------------------------------*/
.hamberger-btn {
	width: 108px;
	height: 90px;
	cursor: pointer;
	top: 33px;
	right: 0;
	opacity: 0;
	visibility: hidden;
	display: none;
}
.menu-open .hamberger-btn,  .fixed-btn .hamberger-btn {
	opacity: 1;
	visibility: visible;
}
.hamberger-btn:hover {
	opacity: 0.6;
}
.hamberger-btn:after {
	left: 2px;
	bottom: 20px;
	text-align: center;
	font-size: 14px;
	letter-spacing: 3px;
}
.hamberger-btn span {
	width: 50px;
	height: 1px;
	position: absolute;
	top: 45%;
	left: calc(50% - 24px);
}
.hamberger-btn span:before {
	top: -16px;
	height: 1px;
	width: 50px;
}
/*=============================================
 ******************* nav-fixed ****************
 *=============================================*/
.nav-header {
	top: 0;
	right: 0;
	width: 100%;
	left: auto;
	display: none;
}
/*=============================================
 ******************* keyvisual ****************
 *=============================================*/
 
	
	
  /*=============================================
 ******************* footer *******************
 *=============================================*/
  
  /*=============================================
***************** copyright ******************
*=============================================*/
#pagetop {
	cursor: pointer;
	transition: all 0.3s ease;
}
}

@media (min-width: 768px) and (max-width: 1180px) {
}
/* Arrows */
.slick-prev, .slick-next {
	font-size: 0;
	line-height: 0;
	position: absolute;
	top: 50%;
	display: block;
	width: 35px;
	height: 35px;
	padding: 0;
	-webkit-transform: translate(0, -50%);
	-ms-transform: translate(0, -50%);
	transform: translate(0, -50%);
	cursor: pointer;
	color: #fff;
	border: none;
	outline: none;
	background: #b10505;
	font-family: 'fontello';
	z-index: 98;
	border-radius: 50%;
}
.slick-prev:hover, .slick-prev:focus, .slick-next:hover, .slick-next:focus {
	color: transparent;
	outline: none;/* background: #b10505; */
}
.slick-prev:hover:before, .slick-prev:focus:before, .slick-next:hover:before, .slick-next:focus:before {
	opacity: 1;
}
.slick-prev.slick-disabled:before, .slick-next.slick-disabled:before {
	opacity: 0.25;
}
.slick-prev:before, .slick-next:before {
	font-size: 30px;
	line-height: 0.5;
	opacity: 1;
	color: white;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}
.slick-prev {
	left: 0;
	background-size: 100%;
	width: 40px;
	height: 40px;
}
[dir='rtl'] .slick-prev {
	right: 0px;
	left: auto;
}
.slick-prev:before {
	content: '';
}
[dir='rtl'] .slick-prev:before {
	content: '▶';
	color: #fff;
}
.slick-next {
	right: 0;
	background-size: 100%;
	width: 40px;
	height: 40px;
}
[dir='rtl'] .slick-next {
	right: auto;
	left: 0px;
}
.slick-next:before {
	content: '';
	color: #fff;
}
[dir='rtl'] .slick-next:before {
	content: '←';
}
/* Dots */
.slick-dots {
	position: absolute;
	bottom: 0%;
	display: block;
	width: 100%;
	padding: 0;
	margin: 0;
	list-style: none;
	text-align: left;
}
.slick-dots li {
	position: relative;
	display: block;
	width: 24px;
	height: 24px;
	margin: 10px 0;
	padding: 0;
	cursor: pointer;
}
.slick-dots li button {
	font-size: 0;
	line-height: 0;
	display: block;
	width: 100%;
	height: 100%;
	padding: 0;
	cursor: pointer;
	color: transparent;
	outline: none;
	background: transparent;
	border: none;
}

@media screen and (max-width: 767px) {
	.slick-dots li {
		width: 15px;
		height: 15px;
	}
}

.slick-dots li button:hover, .slick-dots li button:focus {
	outline: none;
}
.slick-dots li button:hover:before, .slick-dots li button:focus:before {
	opacity: 1;
}
.slick-dots li button:before {
	font-family: 'slick';
	font-size: 6px;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: #fff;
	content: '';
	text-align: center;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}
.slick-dots li.slick-active button:before {
	background: #205ea2;
}
.fadeInUp {
	-webkit-animation-name: fadeInUp;
	animation-name: fadeInUp;
}
@-webkit-keyframes fadeInUp {
 0% {
 -webkit-transform: translate3d(0, 20px, 0);
 opacity: 0;
 transform: translate3d(0, 20px, 0);
}
 to {
 -webkit-transform: translateZ(0);
 opacity: 1;
 transform: translateZ(0);
}
}
@keyframes fadeInUp {
 0% {
 -webkit-transform: translate3d(0, 20px, 0);
 opacity: 0;
 transform: translate3d(0, 20px, 0);
}
 to {
 -webkit-transform: translateZ(0);
 opacity: 1;
 transform: translateZ(0);
}
}
.fadeInDown {
	-webkit-animation-name: fadeInDown;
	animation-name: fadeInDown;
	-webkit-animation-delay: .5s;
	animation-delay: .5s;
}
 @-webkit-keyframes fadeInDown {
 0% {
 -webkit-transform: translate3d(0, -20px, 0);
 opacity: 0;
 transform: translate3d(0, -20px, 0);
}
 to {
 -webkit-transform: translateZ(0);
 opacity: 1;
 transform: translateZ(0);
}
}
@keyframes fadeInDown {
 0% {
 -webkit-transform: translate3d(0, -20px, 0);
 opacity: 0;
 transform: translate3d(0, -20px, 0);
}
 to {
 -webkit-transform: translateZ(0);
 opacity: 1;
 transform: translateZ(0);
}
}
.fadeIn {
	-webkit-animation-name: fadeIn;
	animation-name: fadeIn;
	-webkit-animation-delay: .5s;
	animation-delay: .5s;
}
@-webkit-keyframes fadeIn {
 0% {
 opacity: 0;
}
 to {
 opacity: 1;
}
}
@keyframes fadeIn {
 0% {
 opacity: 0;
}
 to {
 opacity: 1;
}
}
.fadeInUp2 {
	-webkit-animation-name: fadeInUp2;
	animation-name: fadeInUp2;
}
@-webkit-keyframes fadeInUp2 {
 0% {
 -webkit-transform: translate3d(0, 200%, 0);
 opacity: 0;
 transform: translate3d(0, 200%, 0);
}
 to {
 -webkit-transform: translateZ(0);
 opacity: 1;
 transform: translateZ(0);
}
}
@keyframes fadeInUp2 {
 0% {
 -webkit-transform: translate3d(0, 200%, 0);
 opacity: 0;
 transform: translate3d(0, 200%, 0);
}
 to {
 -webkit-transform: translateZ(0);
 opacity: 1;
 transform: translateZ(0);
}
}
.txt_thanks {
	text-align: center;
	color: #000;
}

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
.btn-over img,  .over-img img,  img.over,  img:not(.btn):not(.non-over),  button img,  .btn {
	opacity: 1;
	transform: none !important;
	-moz-transform: none !important;
	-webkit-transform: none !important;
	transition: opacity 0.3s ease;
	-moz-transition: opacity 0.3s ease;
	-webkit-transition: opacity 0.3s ease;
}
.btn {
	transition: none !important;
	-moz-transition: none !important;
	-webkit-transition: none !important;
}
.over-img img:hover, img.over:hover, /* a:not([href=""]):hover img:not(.btn):not(.non-over), */ a:hover img:not(.btn):not(.non-over), button:hover img {
	cursor: pointer;
	opacity: 0.8;
	transform: none !important;
	-moz-transform: none !important;
	-webkit-transform: none !important;
}
a:before {
	text-decoration: underline;
	display: inline-block;
}
a:before,  a:hover:before {
	text-decoration: none;
}
}