/* Theme Name: The Project - Responsive Website Template
Author:HtmlCoder
Author URI:http://www.htmlcoder.me
Author e-mail:htmlcoder.me@gmail.com
Version:1.0.0
Created:December 2014
License URI:http://support.wrapbootstrap.com/
File Description: Place here your custom CSS styles
*/

body {
	font-family: 游ゴシック体, 'Yu Gothic', YuGothic, 'ヒラギノ角ゴシック Pro', 'Hiragino Kaku Gothic Pro', メイリオ, Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
	color: #000 !important;
}

h1, h2, h3, h4 {
	font-family: 游ゴシック体, 'Yu Gothic', YuGothic, 'ヒラギノ角ゴシック Pro', 'Hiragino Kaku Gothic Pro', メイリオ, Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
	font-weight: bold;
}

h3 span {
	font-size: 70%;
}

.phone {
	font-size: 300%;
}
.phone a {
	font-family: Helvetica, Arial, Verdana, sans-serif;
}

.address {
	font-weight: bold;
	font-style: normal;
	font-size: 110%;
}

.dark-translucent-bg:after {
	background-color: rgba(64, 64, 64, 0.6);
}

.point {
	font-size: 180%;
	padding: 20px;
	font-weight: bold;
	color: #e07e27;
	text-align: center;
}

em {
    font-style: normal;
    color: #6bb5e7;
}

.ggmap {
	position: relative;
	padding-bottom: 56.25%;
	padding-top: 30px;
	height: 0;
	overflow: hidden;
}
 
.ggmap iframe,
.ggmap object,
.ggmap embed {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.ggmap-small {
	position: relative;
	padding-bottom: 32.5%;
	padding-top: 30px;
	height: 0;
	overflow: hidden;
}
@media (max-width: 768px) {
	.ggmap-small {
		padding-bottom: 56.25%;
	}
}
 
.ggmap-small iframe,
.ggmap object,
.ggmap embed {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.light-gray-bg {
	background-color: #f0f0f0;
	padding-top: 30px;
	padding-bottom: 40px;
}

/* アンカーリンクのオフセット設定 */
html {
  scroll-margin-top: 100px;
}

/* より確実な方法として、すべてのアンカー要素にも適用 */
[id] {
  scroll-margin-top: 100px;
}

/* モバイルデバイスでの調整 */
@media (max-width: 767px) {
  html {
    scroll-margin-top: 60px;
  }
  
  [id] {
    scroll-margin-top: 60px;
  }
}

/* 明るめのオレンジ背景 */
.light-orange-bg {
	background-color: #ffb366;
	color: #ffffff;
	padding-top: 30px;
	padding-bottom: 40px;
}

.light-orange-bg h1,
.light-orange-bg h2,
.light-orange-bg h3,
.light-orange-bg h4,
.light-orange-bg h5,
.light-orange-bg h6 {
	color: #ffffff;
}

.light-orange-bg a:not(.btn) {
	color: #ffffff;
}

.light-orange-bg a:not(.btn):hover {
	color: #f0f0f0;
}

.light-orange-bg hr {
	border-color: rgba(255, 255, 255, 0.5);
}

.light-orange-bg .separator:after {
	background: rgba(255, 255, 255, 0.5);
	background: -moz-linear-gradient(left,  rgba(255, 255, 255, 0.0) 0%, rgba(255, 255, 255, 0.5) 35%, rgba(255, 255, 255, 0.5) 70%, rgba(255, 255, 255, 0.0) 100%);
	background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(255, 255, 255, 0.0)), color-stop(35%,rgba(255, 255, 255, 0.5)), color-stop(70%,rgba(255, 255, 255, 0.5)), color-stop(100%,rgba(255, 255, 255, 0.0)));
	background: -webkit-linear-gradient(left,  rgba(255, 255, 255, 0.0) 0%,rgba(255, 255, 255, 0.5) 35%,rgba(255, 255, 255, 0.5) 70%,rgba(255, 255, 255, 0.0) 100%);
	background: -o-linear-gradient(left,  rgba(255, 255, 255, 0.0) 0%,rgba(255, 255, 255, 0.5) 35%,rgba(255, 255, 255, 0.5) 70%,rgba(255, 255, 255, 0.0) 100%);
	background: -ms-linear-gradient(left,  rgba(255, 255, 255, 0.0) 0%,rgba(255, 255, 255, 0.5) 35%,rgba(255, 255, 255, 0.5) 70%,rgba(255, 255, 255, 0.0) 100%);
	background: linear-gradient(to right,  rgba(255, 255, 255, 0.0) 0%,rgba(255, 255, 255, 0.5) 35%,rgba(255, 255, 255, 0.5) 70%,rgba(255, 255, 255, 0.0) 100%);
}

.light-orange-bg .separator-2:after {
	background: rgba(255, 255, 255, 0.5);
	background: -moz-linear-gradient(left,  rgba(255, 255, 255, 0.5) 0%, rgba(232, 232, 232, 0.4) 35%, rgba(232, 232, 232, 0.2) 70%, rgba(255, 255, 255, 0.0) 100%);
	background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(255, 255, 255, 0.5)), color-stop(35%,rgba(232, 232, 232, 0.4)), color-stop(70%,rgba(232, 232, 232, 0.2)), color-stop(100%,rgba(255, 255, 255, 0.0)));
	background: -webkit-linear-gradient(left,  rgba(255, 255, 255, 0.5) 0%,rgba(232, 232, 232, 0.4) 35%,rgba(232, 232, 232, 0.2) 70%,rgba(255, 255, 255, 0.0) 100%);
	background: -o-linear-gradient(left,  rgba(255, 255, 255, 0.5) 0%,rgba(232, 232, 232, 0.4) 35%,rgba(232, 232, 232, 0.2) 70%,rgba(255, 255, 255, 0.0) 100%);
	background: -ms-linear-gradient(left,  rgba(255, 255, 255, 0.5) 0%,rgba(232, 232, 232, 0.4) 35%,rgba(232, 232, 232, 0.2) 70%,rgba(255, 255, 255, 0.0) 100%);
	background: linear-gradient(to right,  rgba(255, 255, 255, 0.5) 0%,rgba(232, 232, 232, 0.4) 35%,rgba(232, 232, 232, 0.2) 70%,rgba(255, 255, 255, 0.0) 100%);
}

.light-orange-bg .separator-3:after {
	background: rgba(255, 255, 255, 0.5);
	background: -moz-linear-gradient(right,  rgba(255, 255, 255, 0.5) 0%, rgba(232, 232, 232, 0.4) 35%, rgba(232, 232, 232, 0.2) 70%, rgba(255, 255, 255, 0.0) 100%);
	background: -webkit-gradient(linear, right top, left top, color-stop(0%,rgba(255, 255, 255, 0.5)), color-stop(35%,rgba(232, 232, 232, 0.4)), color-stop(70%,rgba(232, 232, 232, 0.2)), color-stop(100%,rgba(255, 255, 255, 0.0)));
	background: -webkit-linear-gradient(right,  rgba(255, 255, 255, 0.5) 0%,rgba(232, 232, 232, 0.4) 35%,rgba(232, 232, 232, 0.2) 70%,rgba(255, 255, 255, 0.0) 100%);
	background: -o-linear-gradient(right,  rgba(255, 255, 255, 0.5) 0%,rgba(232, 232, 232, 0.4) 35%,rgba(232, 232, 232, 0.2) 70%,rgba(255, 255, 255, 0.0) 100%);
	background: -ms-linear-gradient(right,  rgba(255, 255, 255, 0.5) 0%,rgba(232, 232, 232, 0.4) 35%,rgba(232, 232, 232, 0.2) 70%,rgba(255, 255, 255, 0.0) 100%);
	background: linear-gradient(to left,  rgba(255, 255, 255, 0.5) 0%,rgba(232, 232, 232, 0.4) 35%,rgba(232, 232, 232, 0.2) 70%,rgba(255, 255, 255, 0.0) 100%);
}

/* Full Width Image Container の調整 */
/* ホバー効果を無効化 */
.full-width-section:hover .full-image-container:before,
.full-width-section .full-image-container.hovered:before {
	opacity: 0 !important;
	filter: alpha(opacity=0) !important;
}

.full-width-section:hover .full-image-overlay,
.full-width-section .hovered .full-image-overlay {
	opacity: 0 !important;
	filter: alpha(opacity=0) !important;
}

/* デスクトップでの写真表示調整 */
@media (min-width: 1200px) {
	.full-image-container img {
		width: 100%;
		height: auto;
	}
}

/* タブレット・スマートフォンでの調整 */
@media (max-width: 1199px) {
	.full-width-section {
		display: block !important;
	}
	
	.full-image-container {
		width: 100% !important;
		display: block !important;
		position: relative !important;
		overflow: hidden;
		margin-bottom: 0;
	}
	
	.full-image-container img {
		width: 100%;
		height: auto;
		display: block;
		margin: 0 auto;
	}
	
	.full-text-container {
		position: static !important;
		display: block !important;
		width: 100% !important;
		padding: 20px !important;
	}
}

/* --- Improved Mobile Bottom Navigation (v2) --- */
.mobile-bottom-nav {
  display: none !important;
  align-items: center;
  justify-content: space-between;
  height: 60px;
  width: 100vw;
  max-width: 100vw;
  background: #fff;
  border-top: 1px solid #e0e0e0;
  box-shadow: 0 -2px 10px rgba(0,0,0,0.07);
  padding: 0;
  overflow: visible;
}

.mobile-bottom-nav-phone {
  min-width: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100%;
  overflow: hidden;
  width: 100%;
}

.mobile-bottom-nav-link {
  font-size: 16px;
  padding: 0 0 0 6px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.mobile-bottom-nav-link i {
  font-size: 30px;
  margin-right: 10px;
  color: #e07e27;
}

.mobile-bottom-nav-text {
  font-size: 24px;
  font-weight: bold;
  letter-spacing: 0.03em;
}

a.mobile-bottom-nav-map {
  display: inline-block;
  width: 60px !important;
  height: 60px !important;
  background: #e07e27 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: #fff !important;
  z-index: 1001 !important;
  font-size: 24px !important;
}

.mobile-bottom-nav-map:hover,
.mobile-bottom-nav-map:focus {
  background: #ff9800;
  color: #fff;
}

.mobile-bottom-nav {
  padding-right: 0;
}

@media (max-width: 767px) {
  body { padding-bottom: 60px; }
  #footer { margin-bottom: 0; }
  .scrollToTop { bottom: 70px !important; right: 10px !important; }
  .mobile-bottom-nav {
    display: flex !important;
    position: fixed;
    left: 0;
    bottom: 0;
    z-index: 1000;
    width: 100vw;
    max-width: 100vw;
  }
}