﻿html:not(.responsive) {
	min-width: 1000px; /* viewport */
}



/*=============================================
 * body
 *=============================================*/

body {
	color: #000;
	font-family: 'Noto Serif JP';
	font-size: 15px;
	line-height: 36px;
	letter-spacing: 0;
	background: #FFF;
	min-width: inherit;
	min-height: inherit;
	max-height: 100%;
	letter-spacing: 0.2em;
	background-image: url(../img/shared/bg.jpg);
}



/*=============================================
 * 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 - customs
 *=============================================*/

.fnt-mincho {
}
.fnt-meiryo {
}
.fnt-gothic {
}
.fnt-garamond {
}



/*=============================================
 * <main>
 *=============================================*/

main {
	clear: both;
	width: 100%;
	position: relative;
	overflow: hidden;
}
.wrap {
	width: 1000px;
}



/*=============================================
 * <header>
 *=============================================*/

header {
}
header h1 {
}
header .logo {
}
header .tel {
}
header nav {
}

/*=============================================
 * <header>
 *=============================================*/

.nav-fixed{
  background-image: url(../img/shared/bg_nav.jpg);
  position: fixed;
  z-index: 99;
  left: 0;
  right: 0;
  top: 0;
  -webkit-box-shadow: 0px 4px 10px 0px rgba(99, 81, 43, 0.25);
  -moz-box-shadow: 0px 4px 10px 0px rgba(99, 81, 43, 0.25);
  box-shadow: 0px 4px 10px 0px rgba(99, 81, 43, 0.25);
  color: #fff;
  opacity: 0;
  visibility: hidden;
}
.nav-fixed .wrap nav{
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.nav-fixed.fixed {
  opacity: 1;
  visibility: visible;
}
.nav-fixed a{
  position: relative;
}
.nav-fixed a:before{
    content: '';
    position: absolute;
	left: 51%;
	right: 51%;
    height: 2px;
    background: #fff;
    bottom: -7px;
    transition: all .5s ease;
}
.nav-fixed a.active:before, .nav-fixed a:hover:before{
  /* width: 100%; */
  left: 0;
  right: 0;
}
.nav-fixed a:hover{
    text-decoration: none;
}

/*=============================================
 * key
 *=============================================*/

#key {
	background-color: #000;
	background-repeat: no-repeat;
	background-position: center top;
	background-size: cover;
	min-height: 500px;
	position: relative;
}
#key ul {
	min-height: inherit;
}
#key li {
	background-repeat: no-repeat;
	background-position: center top;
	background-size: cover;
	min-height: inherit;
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
}



/*=============================================
 * <section>
 *=============================================*/

section {
}



/*=============================================
 * <footer>
 *=============================================*/

footer {
	text-align: center;
}
footer .logo {
}
footer .tel {
}
footer nav {
}



/*=============================================
 * .socialbuttons
 *=============================================*/

footer .socialbuttons {
}



/*=============================================
 * copyright
 *=============================================*/

address {
}


@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 {
		opacity: 1;
		transform: translateX(0) translateZ(0);
		-moz-transform: translateX(0) translateZ(0);
		-webkit-transform: translateX(0) translateZ(0);
		transition: all 0s ease;
		-moz-transition:  all 0s ease;
		-webkit-transition:  all 0s ease;
	}
	.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: .8;
		transform: translateX(0) translateZ(0);
		-moz-transform: translateX(0) translateZ(0);
		-webkit-transform: translateX(0) translateZ(0);
	}
	.non-over a:hover img:not(.over),
	.non-over img:not(.over):not(.btn):hover {
		opacity: 1 !important;
	}
}

/* iPhone X */
@media only screen  and (min-device-width: 375px)  and (min-device-height: 812px)  and (-webkit-device-pixel-ratio: 3)  and (orientation: portrait) {
	.has_nav footer:after {
		background: #000;
		content: '';
		position: fixed;
		bottom: 0px;
		left: 0;
		right: 0;
		height: 36px;
	}
	#nav_fixsp {
		padding-bottom: 15px;
		/* 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) {
	.has_nav footer:after {
		background: #000;
		content: '';
		position: fixed;
		bottom: 0px;
		left: 0;
		right: 0;
		height: 36px;
	}
	#nav_fixsp {
		bottom: calc(env(safe-area-inset-bottom) - 0px);
	}
	}
	
	/* iPhone 11 */
	
	@media only screen 
		and (device-width: 414px) 
		and (device-height: 896px) 
		and (-webkit-device-pixel-ratio: 2) ,@media only screen 
		and (device-width: 375px) 
		and (device-height: 812px) 
		and (-webkit-device-pixel-ratio: 3),@media only screen 
		and (device-width: 414px) 
		and (device-height: 896px) 
		and (-webkit-device-pixel-ratio: 3) {
	
	.has_nav footer:after {
		background: #000;
		content: '';
		position: fixed;
		bottom: 0px;
		left: 0;
		right: 0;
		height: 36px;
	}
	#nav_fixsp {
		bottom: calc(env(safe-area-inset-bottom) - 0px);
	}
	}