/*! destyle.css v4.0.0 | MIT License | https://github.com/nicolas-cusan/destyle.css */
/* Reset box-model and set borders */
/* ============================================ */
*, ::before, ::after { box-sizing: border-box; border-style: solid; border-width: 0; }

/* Document */
/* ============================================ */
/** 1. Correct the line height in all browsers. 2. Prevent adjustments of font size after orientation changes in iOS. 3. Remove gray overlay on links for iOS. */
html { line-height: 1.15; /* 1 */ -webkit-text-size-adjust: 100%; /* 2 */ -webkit-tap-highlight-color: transparent; /* 3*/ }

/* Sections */
/* ============================================ */
/** Remove the margin in all browsers. */
body { margin: 0; }

/** Render the `main` element consistently in IE. */
main { display: block; }

/* Vertical rhythm */
/* ============================================ */
p, table, blockquote, address, pre, iframe, form, figure, dl { margin: 0; }

/* Headings */
/* ============================================ */
h1, h2, h3, h4, h5, h6 { font-size: inherit; font-weight: inherit; margin: 0; }

/* Lists (enumeration) */
/* ============================================ */
ul, ol { margin: 0; padding: 0; list-style: none; }

/* Lists (definition) */
/* ============================================ */
dt { font-weight: bold; }

dd { margin-left: 0; }

/* Grouping content */
/* ============================================ */
/** 1. Add the correct box sizing in Firefox. 2. Show the overflow in Edge and IE. */
hr { box-sizing: content-box; /* 1 */ height: 0; /* 1 */ overflow: visible; /* 2 */ border-top-width: 1px; margin: 0; clear: both; color: inherit; }

/** 1. Correct the inheritance and scaling of font size in all browsers. 2. Correct the odd `em` font sizing in all browsers. */
pre { font-family: monospace, monospace; /* 1 */ font-size: inherit; /* 2 */ }

address { font-style: inherit; }

/* Text-level semantics */
/* ============================================ */
/** Remove the gray background on active links in IE 10. */
a { background-color: transparent; text-decoration: none; color: inherit; }

/** 1. Remove the bottom border in Chrome 57- 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari. */
abbr[title] { text-decoration: underline dotted; /* 2 */ }

/** Add the correct font weight in Chrome, Edge, and Safari. */
b, strong { font-weight: bolder; }

/** 1. Correct the inheritance and scaling of font size in all browsers. 2. Correct the odd `em` font sizing in all browsers. */
code, kbd, samp { font-family: monospace, monospace; /* 1 */ font-size: inherit; /* 2 */ }

/** Add the correct font size in all browsers. */
small { font-size: 80%; }

/** Prevent `sub` and `sup` elements from affecting the line height in all browsers. */
sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }

sub { bottom: -0.25em; }

sup { top: -0.5em; }

/* Replaced content */
/* ============================================ */
/** Prevent vertical alignment issues. */
svg, img, embed, object, iframe { vertical-align: bottom; }

/* Forms */
/* ============================================ */
/** Reset form fields to make them styleable. 1. Make form elements stylable across systems iOS especially. 2. Inherit text-transform from parent. */
button, input, optgroup, select, textarea { -webkit-appearance: none; /* 1 */ appearance: none; vertical-align: middle; color: inherit; font: inherit; background: transparent; padding: 0; margin: 0; border-radius: 0; text-align: inherit; text-transform: inherit; /* 2 */ }

/** Correct cursors for clickable elements. */
button, [type="button"], [type="reset"], [type="submit"] { cursor: pointer; }

button:disabled, [type="button"]:disabled, [type="reset"]:disabled, [type="submit"]:disabled { cursor: default; }

/** Improve outlines for Firefox and unify style with input elements & buttons. */
:-moz-focusring { outline: auto; }

select:disabled { opacity: inherit; }

/** Remove padding */
option { padding: 0; }

/** Reset to invisible */
fieldset { margin: 0; padding: 0; min-width: 0; }

legend { padding: 0; }

/** Add the correct vertical alignment in Chrome, Firefox, and Opera. */
progress { vertical-align: baseline; }

/** Remove the default vertical scrollbar in IE 10+. */
textarea { overflow: auto; }

/** Correct the cursor style of increment and decrement buttons in Chrome. */
[type="number"]::-webkit-inner-spin-button, [type="number"]::-webkit-outer-spin-button { height: auto; }

/** Correct the outline style in Safari. */
[type="search"] { outline-offset: -2px; /* 1 */ }

/** Remove the inner padding in Chrome and Safari on macOS. */
[type="search"]::-webkit-search-decoration { -webkit-appearance: none; }

/** 1. Correct the inability to style clickable types in iOS and Safari. 2. Fix font inheritance. */
::-webkit-file-upload-button { -webkit-appearance: button; /* 1 */ font: inherit; /* 2 */ }

/** Fix appearance for Firefox */
[type="number"] { -moz-appearance: textfield; }

/** Clickable labels */
label[for] { cursor: pointer; }

/* Interactive */
/* ============================================ */
/* Add the correct display in Edge, IE 10+, and Firefox. */
details { display: block; }

/* Add the correct display in all browsers. */
summary { display: list-item; }

/* Remove outline for editable content. */
[contenteditable]:focus { outline: auto; }

/* Tables */
/* ============================================ */
/**
1. Correct table border color inheritance in all Chrome and Safari.
*/
table { border-color: inherit; /* 1 */ border-collapse: collapse; }

caption { text-align: left; }

td, th { vertical-align: top; padding: 0; }

th { text-align: left; font-weight: bold; }

#main2-end-overlay { opacity: 0; transition: opacity 0.3s ease 0s; pointer-events: none; }
#main2-end-overlay.is-active { opacity: 1; pointer-events: auto; }

.mv-spacer { width: 100%; display: block; }
@media screen and (max-width: 1000px) { .mv-spacer { display: block; } }

.mv { overflow: hidden; padding-bottom: 47.5%; position: relative; font-size: 0; }
.mv .img { position: absolute; bottom: -10%; left: 0%; width: 100%; pointer-events: none; }
.mv .img video { width: 100%; height: auto; }
.mv .img .main-img { opacity: 0; position: absolute; top: 0; left: 0; }
@media screen and (max-width: 768px) { .mv { padding-bottom: 50%; } }
@media screen and (max-width: 500px) { .mv { padding-bottom: 0; }
  .mv .img { position: relative; } }

.mv-container { display: grid; grid-template-rows: auto 1fr; }
.mv-container .main-btn-cls { position: absolute; bottom: 10px; right: 10px; background-color: #000; color: #fff; font-size: 1rem; width: 80px; text-align: center; padding: 0.75rem 0; pointer-events: auto; cursor: pointer; opacity: 1; transition: 0.5s linear 0 opacity, 1s ease 0s background; }
.mv-container .main-btn-cls:hover { background-color: #313131; }
.mv-container .main-btn-cls.is-active { opacity: 1; pointer-events: auto; }
.mv-container .main-btn-cls.is-hidden { opacity: 0; pointer-events: none; }

.exterior-fix { margin: 0 auto 0rem; width: 100%; position: relative; overflow: hidden; /*&.exterior02{
	height:calc(100vh - 150px);
	.exterior-inner{
		height:calc(100vh - 150px);
	}
	.img {
		img{
			object-position: 20% 70%;
		}
	}
	.main-copy{
		top:calc(20px + 5%);
		//min-width: 300px;
		width:calc(412 / 1920 * 100%);
		filter:drop-shadow(0 0 10px #fff) drop-shadow(0 0 10px #fff);
	}
	.main-logo{
		left: auto; right:5rem;
		filter:drop-shadow(0 0 20px #000)
	}
}*/ }
.exterior-fix .exterior-inner { width: 100%; position: relative; background-color: #000; overflow: hidden; aspect-ratio: 16 / 9; }
.exterior-fix .img { width: 100%; height: 100%; transition: opacity 0.5s linear 0s; overflow: hidden; }
.exterior-fix .img .cap { font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif"; right: auto; left: 1rem; }
.exterior-fix .img img { width: 100%; height: 100%; object-fit: cover; object-position: center center; transition: transform 0s ease-out 0.5s; transform: scale(1.2, 1.2); /*&.sp{
	transition: object-position 0s ease-out 0.5s;
	object-position:50% 0%;
}*/ }
.exterior-fix .main-copy { position: absolute; top: 5rem; left: 5rem; width: 23.9583333333%; max-width: 460px; }
.exterior-fix .main-copy img { width: 100%; height: auto; }
.exterior-fix .main-logo { position: absolute; bottom: 5rem; left: 5rem; width: 14%; max-width: 268px; }
.exterior-fix .main-logo img { width: 100%; height: auto; }
.exterior-fix .main-loading { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: #171d2a; display: flex; justify-content: center; align-items: center; }
@keyframes mainLoadingMotion { 0% { opacity: 1; }
  100% { opacity: 0; } }
.exterior-fix .main-loading.fadeOut { display: none; pointer-events: none; }
.exterior-fix .main-loading ul { position: relative; display: flex; flex-direction: row; justify-content: center; }
.exterior-fix .main-loading ul li { margin: 0 4px; width: 4px; height: 4px; background-color: #fff; opacity: 0.3; animation: mainLoadingLiMotion 1s linear 0s infinite forwards; }
@keyframes mainLoadingLiMotion { 0% { opacity: 0.3; transform: rotate(0deg); }
  20% { opacity: 1; }
  50% { opacity: 0.3; transform: rotate(360deg); }
  100% { opacity: 0.3; transform: rotate(360deg); } }
.exterior-fix .main-loading ul li:nth-child(1) { animation-delay: 0s; }
.exterior-fix .main-loading ul li:nth-child(2) { animation-delay: 0.2s; }
.exterior-fix .main-loading ul li:nth-child(3) { animation-delay: 0.4s; }
.exterior-fix .main-loading ul li:nth-child(4) { animation-delay: 0.6s; }
.exterior-fix .main-loading ul li:nth-child(5) { animation-delay: 0.8s; }
.exterior-fix .video-box { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: #171d2a; transition: opacity 0.5s linear 0s; }
.exterior-fix .video-box video { width: 100%; height: 100%; object-fit: cover; object-position: center center; }
.exterior-fix .video-box.fadeOut { opacity: 0; pointer-events: none; }
.exterior-fix.exterior01 .img img { object-position: 0% 90%; }
.exterior-fix.exterior01 .main-copy { width: calc(460 / 1920 * 100%); }
.exterior-fix .visual-1 { position: absolute; top: 0%; left: 0%; width: 100%; height: 100%; }
.exterior-fix .visual-2 { display: none; width: 100%; height: 50%; position: absolute; top: 50%; left: 0%; }
.exterior-fix.active .img, .exterior-fix .aos-animate .img { opacity: 1; transition: opacity 2s linear 0s; }
.exterior-fix.active .img img, .exterior-fix .aos-animate .img img { transform: scale(1, 1); transition: transform 2s ease-out 0s; /*&.sp{
	object-position:90% 50%;
	transition: object-position 6.5s cubic-bezier(0.53, 0.02, 0.61, 1) 0s;
}*/ }
@media screen and (max-width: 1000px) { .exterior-fix { height: auto; margin: 0 auto 0rem; /*&.exterior02{
	height: auto;
	.exterior-inner{
		height: auto;
	}
	.main-copy{
		width:calc(580 / 1920 * 100%);
	}
}*/ }
  .exterior-fix .exterior-inner { height: auto; aspect-ratio: 16 / 9; }
  .exterior-fix .main-logo { width: 16%; min-width: auto; left: auto; right: 2rem !important; bottom: auto; top: 7% !important; }
  .exterior-fix .main-copy { width: 40%; top: 7% !important; left: 3rem; min-width: auto; }
  .exterior-fix.exterior01 .main-copy { width: calc(620 / 1920 * 100%); } }
@media screen and (max-width: 500px) { .exterior-fix { height: auto; margin: 0 auto 0rem; /*&.exterior01{
	.main-copy{
		width:calc(190 / 375 * 100%);
	}
}*/ /*&.exterior02{
	.main-copy{
		width:calc(140 / 375 * 100%);
		filter:drop-shadow(0 0 10px #fff) drop-shadow(0 0 5px #fff) drop-shadow(0 0 2px #fff);
	}
}*/ }
  .exterior-fix .exterior-inner { height: auto; aspect-ratio: 9 / 16; }
  .exterior-fix .main-logo { width: 19%; }
  .exterior-fix .main-copy { width: 47%; }
  .exterior-fix .visual-1 { height: 50%; }
  .exterior-fix .visual-1 .main-copy { width: calc(190 / 375 * 100%); }
  .exterior-fix .visual-1 .img img { object-position: 40% 50%; }
  .exterior-fix .visual-2 { display: block; }
  .exterior-fix .visual-2 .main-copy { width: calc(160 / 375 * 100%); filter: drop-shadow(0 0 10px #fff) drop-shadow(0 0 5px #fff) drop-shadow(0 0 2px #fff); }
  .exterior-fix .visual-2 .img img { object-position: 30% 50%; } }
