/*!
Theme Name: dailies
Theme URI: http://underscores.me/
Author: Underscores.me
Author URI: http://underscores.me/
Description: Description
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: dailies
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

dailies is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/

/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
# Generic
	- Normalize
	- Box sizing
# Base
	- Typography
	- Elements
	- Links
	- Forms
## Layouts
# Components
	- Navigation
	- Posts and pages
	- Comments
	- Widgets
	- Media
	- Captions
	- Galleries
# plugins
	- Jetpack infinite scroll
# Utilities
	- Accessibility
	- Alignments

--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Generic
--------------------------------------------------------------*/

/* Normalize
--------------------------------------------- */

/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */

@charset "UTF-8";
/*!
* Start Bootstrap - Agency v7.0.12 (https://startbootstrap.com/theme/agency)
* Copyright 2013-2023 Start Bootstrap
* Licensed under MIT (https://github.com/StartBootstrap/startbootstrap-agency/blob/master/LICENSE)
*/
/*!
 * Bootstrap  v5.2.3 (https://getbootstrap.com/)
 * Copyright 2011-2022 The Bootstrap Authors
 * Copyright 2011-2022 Twitter, Inc.
 * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
 */
html {
  scroll-padding-top: 4.5rem;
}

body {
  position: relative;
}

h1,h2 {
	background-color: black; /* ボタンの背景色 */ 
	color: #fff; /* 文字色 */ 
	width: 230px;
	height: 60px; /* ボタンの高さ */ 
	text-align: center; 
	line-height: 60px; /* ボタン内のテキストの位置を中央にする */ 
	margin-top: 1rem; /* ヘッダーとの間隔を確保 */
}
h1 {
	margin-bottom: 3rem !important;
}

p {
  line-height: 1.75;
}

.page-section {
  padding: 3rem 0;
}
.page-section h2.section-heading, .page-section .section-heading.h2, h1.entry-title{
  font-size: 2.5rem;
  margin-top: 1rem; /* ヘッダーとの間隔を確保 */
  margin-bottom: 1rem;
}
.page-section h3.section-subheading, .page-section .section-subheading.h3 {
  font-size: 1rem;
  /* font-weight: 400; */
  font-weight: 600;
  /* font-style: italic; */
  /* font-family: "Roboto Slab", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; */
  margin-bottom: 4rem;
}

@media (min-width: 768px) {
  section {
    padding: 9rem 0;
  }
}
.btn-xl {
  padding: 1.25rem 2.5rem;
  /* font-family: "Montserrat", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; */
  font-size: 1.125rem;
  font-weight: 700;
}

.btn-social {
  height: 2.5rem;
  width: 2.5rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  border-radius: 100%;
}

.btn-contact1 {
  padding: 1.25rem 2rem;
  font-family: "Montserrat", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  font-size: 1.125rem;
  font-weight: 700;
}

.btn-contact2 {
  padding: 1.25rem 1.5rem;
  font-family: "Montserrat", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  font-size: 1.125rem;
  font-weight: 700;
}

#mainNav {
  /* padding-top: 1rem;
  padding-bottom: 1rem; */
  background-color: #404040;
}
#mainNav .navbar-toggler {
  padding: 0.75rem;
  font-size: 0.75rem;
  font-family: "Montserrat", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  text-transform: uppercase;
  font-weight: 700;
  width: 90px;
}
#mainNav .navbar-brand {
  color: #b92223;
  font-family: "Montserrat", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  font-weight: 700;
  letter-spacing: 0.0625em;
  text-transform: uppercase;
}
#mainNav .navbar-nav{
	padding-top: 1rem;
	padding-bottom: 1rem;
	/* background-color: #404040; */
  }
#mainNav .navbar-brand img {
  /* height: 1.5rem; */
  height: 3.5rem;
}
#mainNav .navbar-nav .nav-item .nav-link {
  font-family: "Montserrat", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  font-size: 0.95rem;
  color: #fff;
  letter-spacing: 0.0625em;
}
#mainNav .navbar-nav .nav-item .nav-link.active, #mainNav .navbar-nav .nav-item .nav-link:hover {
  color: #b92223;
}
.navbar-brand {
    padding-top: 0rem;
    padding-bottom: 0rem;
    margin-right: 0rem;
}

@media (min-width: 992px) {
  #mainNav {
    /* padding-top: 1.5rem;
    padding-bottom: 1.5rem; */
    border: none;
    /* background-color: transparent; */
	background:rgba(64,64,64,0.8);
    transition: padding-top 0.3s ease-in-out, padding-bottom 0.3s ease-in-out;
  }
  #mainNav .navbar-nav{
    padding-top: 1.5rem;
    padding-bottom: 1.5rem;
    /* border: none; */
    /* background-color: transparent; */
	/* background:rgba(64,64,64,0.8);
    transition: padding-top 0.3s ease-in-out, padding-bottom 0.3s ease-in-out; */
  }
  #mainNav .navbar-brand {
    font-size: 1.5em;
    transition: font-size 0.3s ease-in-out;
  }
  #mainNav .navbar-brand img {
    height: 4.5rem;
    transition: height 0.3s ease-in-out;
  }
  #mainNav .navbar-nav .navbar-shrink {
    padding-top: 1rem;
    padding-bottom: 1rem;
    background-color: #404040;
  }
  #mainNav.navbar-shrink .navbar-brand {
    font-size: 1.25em;
  }
  #mainNav.navbar-shrink .navbar-brand svg,
  #mainNav.navbar-shrink .navbar-brand img {
    /* height: 1.5rem; */
    height: 3.5rem;
  }
  #mainNav .navbar-nav .nav-item {
    margin-right: 1rem;
  }
  #mainNav .navbar-nav .nav-item:last-child {
    margin-right: 0;
  }
}

.kv{
  height: 65vh;
  display: flex;
  justify-content: left;
  align-items: center;
}
.kv img{
	width: 100%;
	height: 65vh;
	object-fit: cover;
	object-position: center;
	/* aspect-ratio: 16 / 9; */
}

header.masthead {
  /* padding-top: 10.5rem; */
  /* padding-bottom: 6rem; */
  text-align: center;
  color: #fff;
  /* background-image: url("../assets/img/header-bg.jpg"); */
  /* background-image: url("../assets/img/header.MP4"); */
  /* background-repeat: no-repeat;
  background-attachment: scroll;
  background-position: center center;
  background-size: cover; */
}
header.masthead .masthead-subheading {
  font-size: 1.5rem;
  font-style: italic;
  line-height: 1.5rem;
  /* margin-bottom: 25px; */
  font-family: "Roboto Slab", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
}
header.masthead .masthead-heading {
  /* font-size: 3.25rem; */
  font-size: 2.25rem;
  font-weight: 700;
  line-height: 3.25rem;
  /* margin-bottom: 2rem; */
  font-family: "Montserrat", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
}

@media (min-width: 768px) {
  header.masthead {
    /* padding-top: 17rem;
    padding-bottom: 12.5rem; */
  }
  header.masthead .masthead-subheading {
    font-size: 2.25rem;
    font-style: italic;
    line-height: 2.25rem;
    /* margin-bottom: 2rem; */
  }
  header.masthead .masthead-heading {
    font-size: 4.5rem;
    font-weight: 700;
    line-height: 4.5rem;
    /* margin-bottom: 4rem; */
  }
}
#portfolio .portfolio-item {
  max-width: 26rem;
  margin-left: auto;
  margin-right: auto;
}
#portfolio .portfolio-item .portfolio-link {
  position: relative;
  display: block;
  margin: 0 auto;
}
#portfolio .portfolio-item .portfolio-link .portfolio-hover {
  display: flex;
  position: absolute;
  width: 100%;
  height: 100%;
  background: rgba(255, 200, 0, 0.9);
  align-items: center;
  justify-content: center;
  opacity: 0;
  transition: opacity ease-in-out 0.25s;
}
#portfolio .portfolio-item .portfolio-link .portfolio-hover .portfolio-hover-content {
  font-size: 1.25rem;
  color: white;
}
#portfolio .portfolio-item .portfolio-link:hover .portfolio-hover {
  opacity: 1;
}
#portfolio .portfolio-item .portfolio-caption {
  padding: 1.5rem;
  text-align: center;
  background-color: #fff;
}
#portfolio .portfolio-item .portfolio-caption .portfolio-caption-heading {
  font-size: 1.5rem;
  font-family: "Montserrat", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  font-weight: 700;
  margin-bottom: 0;
}
#portfolio .portfolio-item .portfolio-caption .portfolio-caption-subheading {
  font-style: italic;
  font-family: "Roboto Slab", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
}

.portfolio-modal .modal-dialog {
  margin: 1rem;
  max-width: 100vw;
}
.portfolio-modal .modal-content {
  padding-top: 6rem;
  padding-bottom: 6rem;
  text-align: center;
}
.portfolio-modal .modal-content h2, .portfolio-modal .modal-content .h2 {
  font-size: 3rem;
  line-height: 3rem;
}
.portfolio-modal .modal-content p.item-intro {
  font-style: italic;
  margin-bottom: 2rem;
  font-family: "Roboto Slab", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
}
.portfolio-modal .modal-content p {
  margin-bottom: 2rem;
}
.portfolio-modal .modal-content ul.list-inline {
  margin-bottom: 2rem;
}
.portfolio-modal .modal-content img {
  margin-bottom: 2rem;
}
.portfolio-modal .close-modal {
  position: absolute;
  top: 1.5rem;
  right: 1.5rem;
  width: 3rem;
  height: 3rem;
  cursor: pointer;
  background-color: transparent;
}
.portfolio-modal .close-modal:hover {
  opacity: 0.3;
}

.timeline {
  position: relative;
  padding: 0;
  list-style: none;
}
.timeline:before {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 40px;
  width: 2px;
  margin-left: -1.5px;
  content: "";
  background-color: #e9ecef;
}
.timeline > li {
  position: relative;
  min-height: 50px;
  margin-bottom: 50px;
}
.timeline > li:after, .timeline > li:before {
  display: table;
  content: " ";
}
.timeline > li:after {
  clear: both;
}
.timeline > li .timeline-panel {
  position: relative;
  float: right;
  width: 100%;
  padding: 0 20px 0 100px;
  text-align: left;
}
.timeline > li .timeline-panel:before {
  right: auto;
  left: -15px;
  border-right-width: 15px;
  border-left-width: 0;
}
.timeline > li .timeline-panel:after {
  right: auto;
  left: -14px;
  border-right-width: 14px;
  border-left-width: 0;
}
.timeline > li .timeline-image {
  position: absolute;
  z-index: 100;
  left: 0;
  width: 80px;
  height: 80px;
  margin-left: 0;
  text-align: center;
  color: white;
  border: 7px solid #e9ecef;
  border-radius: 100%;
  background-color: #b92223;
}
.timeline > li .timeline-image h4, .timeline > li .timeline-image .h4 {
  font-size: 10px;
  line-height: 14px;
  margin-top: 12px;
}
.timeline > li.timeline-inverted > .timeline-panel {
  float: right;
  padding: 0 20px 0 100px;
  text-align: left;
}
.timeline > li.timeline-inverted > .timeline-panel:before {
  right: auto;
  left: -15px;
  border-right-width: 15px;
  border-left-width: 0;
}
.timeline > li.timeline-inverted > .timeline-panel:after {
  right: auto;
  left: -14px;
  border-right-width: 14px;
  border-left-width: 0;
}
.timeline > li:last-child {
  margin-bottom: 0;
}
.timeline .timeline-heading h4, .timeline .timeline-heading .h4 {
  margin-top: 0;
  color: inherit;
}
.timeline .timeline-heading h4.subheading, .timeline .timeline-heading .subheading.h4 {
  text-transform: none;
}
.timeline .timeline-body > ul,
.timeline .timeline-body > p {
  margin-bottom: 0;
}

@media (min-width: 768px) {
  .timeline:before {
    left: 50%;
  }
  .timeline > li {
    min-height: 100px;
    margin-bottom: 100px;
  }
  .timeline > li .timeline-panel {
    float: left;
    width: 41%;
    padding: 0 20px 20px 30px;
    text-align: right;
  }
  .timeline > li .timeline-image {
    left: 50%;
    width: 100px;
    height: 100px;
    margin-left: -50px;
  }
  .timeline > li .timeline-image h4, .timeline > li .timeline-image .h4 {
    font-size: 13px;
    line-height: 18px;
    margin-top: 16px;
  }
  .timeline > li.timeline-inverted > .timeline-panel {
    float: right;
    padding: 0 30px 20px 20px;
    text-align: left;
  }
}
@media (min-width: 992px) {
  .timeline > li {
    min-height: 150px;
  }
  .timeline > li .timeline-panel {
    padding: 0 20px 20px;
  }
  .timeline > li .timeline-image {
    width: 150px;
    height: 150px;
    margin-left: -75px;
  }
  .timeline > li .timeline-image h4, .timeline > li .timeline-image .h4 {
    font-size: 18px;
    line-height: 26px;
    margin-top: 30px;
  }
  .timeline > li.timeline-inverted > .timeline-panel {
    padding: 0 20px 20px;
  }
}
@media (min-width: 1200px) {
  .timeline > li {
    min-height: 170px;
  }
  .timeline > li .timeline-panel {
    padding: 0 20px 20px 100px;
  }
  .timeline > li .timeline-image {
    width: 170px;
    height: 170px;
    margin-left: -85px;
  }
  .timeline > li .timeline-image h4, .timeline > li .timeline-image .h4 {
    margin-top: 40px;
  }
  .timeline > li.timeline-inverted > .timeline-panel {
    padding: 0 100px 20px 20px;
  }
}
.team-member {
  margin-bottom: 3rem;
  text-align: center;
}
.team-member img {
  width: 14rem;
  height: 14rem;
  border: 0.5rem solid rgba(0, 0, 0, 0.1);
}
.team-member h4, .team-member .h4 {
  margin-top: 1.5rem;
  margin-bottom: 0;
}

.img-brand {
  height: 2.75rem;
}

section#contact {
  background-color: #404040;
  background-image: url("../assets/img/map-image.png");
  background-repeat: no-repeat;
  background-position: center;
}
section#contact .section-heading {
  color: #fff;
}
section#contact form#contactForm .form-group {
  margin-bottom: 1.5rem;
}
section#contact form#contactForm .form-group input,
section#contact form#contactForm .form-group textarea {
  padding: 1.25rem;
}
section#contact form#contactForm .form-group input.form-control {
  height: auto;
}
section#contact form#contactForm .form-group-textarea {
  height: 100%;
}
section#contact form#contactForm .form-group-textarea textarea {
  height: 100%;
  min-height: 10rem;
}
section#contact form#contactForm p.help-block {
  margin: 0;
}
section#contact form#contactForm .form-control:focus {
  border-color: #b92223;
  box-shadow: none;
}
section#contact form#contactForm ::-webkit-input-placeholder {
  font-family: "Montserrat", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  font-weight: 700;
  color: #ced4da;
}
section#contact form#contactForm :-moz-placeholder {
  font-family: "Montserrat", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  font-weight: 700;
  color: #ced4da;
}
section#contact form#contactForm ::-moz-placeholder {
  font-family: "Montserrat", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  font-weight: 700;
  color: #ced4da;
}
section#contact form#contactForm :-ms-input-placeholder {
  font-family: "Montserrat", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  font-weight: 700;
  color: #ced4da;
}

.footer {
  text-align: center;
  font-size: 0.9rem;
  font-family: "Montserrat", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
}
.floating-button { 
	position: fixed; 
	right: 40px; 
	bottom: 40px; 
	z-index: 9999;
	display: block; 
	/* background-color: #b92222; */
	/* color: #fff; */
	width: 200px;
	height: 60px;
	/* text-align: center;  */
	/* line-height: 60px; */
	/* font-size: 24px;  */
	/* border-radius: 5%; */
	/* box-shadow: 5px 5px 5px rgba(0, 0, 0, 1); */
	/* text-decoration: none; */
	/* font-weight: 700; */
	
	/* background-image: url("../assets/img/contact_btn.png");
  	background-repeat: no-repeat; */
} 
.floating-button img{ 
	height: 100%;
}
.floating-button:hover { 
	/* background-color: #b20000;
	color: #fff; */
	width: 201px;
	height: 61px;
}

.btn-primary {
	background-color: #fff; /* ボタンの背景色 */ 
    border-color: #fff; /* ボタンの背景色 */ 
	box-shadow: 5px 5px 5px rgba(0, 0, 0, 1); /* 影の効果 */ 
	border-radius: 0%;
    color: #000000;
}
.btn-primary:hover { 
	background-color: #b20000; /* ホバー時の背景色 */ 
	border-color: #b20000; /* ボタンの背景色 */ 
	color: #fff; /* 文字色 */ 
}
dd {
	margin-bottom: 0;
}
.sub-main {
	background-color: #fff;
	width: 100%;
	max-width: 100%;
}
.nav-contact {
	/* position: fixed;  */
	/* right: 40px; 
	bottom: 40px;  */
	/* z-index: 9999;  */
	display: block; 
	background-color: #fff; /* ボタンの背景色 */ 
	color: black; /* 文字色 */ 
	width: 40px; /* ボタンの幅 */ 
	height: 40px; /* ボタンの高さ */ 
	text-align: center; 
	line-height: 40px; /* ボタン内のテキストの位置を中央にする */ 
	border-radius: 100%;
	/* font-size: 24px; /* テキストサイズ */
	/* border-radius: 5%; */
	/* box-shadow: 5px 5px 5px rgba(0, 0, 0, 1); /* 影の効果 */ 
	/* text-decoration: none;
	font-weight: 700; */
}
.nav-contact{
	display: none;
}

/* 新しいナビゲーション右側要素のスタイル */
.nav-right-elements {
  gap: 8px;
}

.nav-right-elements .nav-contact {
  display: block;
  margin-right: 0;
}

.nav-right-elements .navbar-toggler {
  margin-left: 0;
}

/* 768px以上でメール・電話アイコンを非表示 */
@media (min-width: 768px) {
  .nav-right-elements .nav-contact {
    display: none;
  }
}
.navbar-dark .navbar-toggler {
    color: #fff;
    border-color: #fff;
	background-color: #b92222;
}
.fade-in {
	/*追加*/
	opacity: 0;
	visibility: hidden;
	transition: all 1s;
	transform: translateY(150px);
}
.is-active {
	/*要素を表示させる*/
	opacity: 1;
	visibility: visible;
	/*元の位置に戻す*/
	transform: translateY(0);
}

/* スマホには適用しない */
/* タブレットサイズ（768px〜991px）用の設定 */
@media (min-width: 768px) and (max-width: 991px) {
  #mainNav {
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
  }
  
  #mainNav .navbar-brand img {
    height: 3rem;
  }
  
  #mainNav .navbar-toggler {
    width: 80px;
    font-size: 0.7rem;
    padding: 0.5rem;
  }
  
  .nav-contact {
    display: block;
    width: 35px;
    height: 35px;
    line-height: 35px;
  }
  
  .kv {
    height: 60vh;
  }
  
  .kv img {
    height: 60vh;
    object-fit: cover;
    object-position: center;
  }
  
  /* ナビゲーションコンテナの調整 */
  #mainNav .container {
    padding-left: 15px;
    padding-right: 15px;
  }
  
  /* 右側の要素の調整 */
  .nav-right-elements {
    gap: 8px;
  }
  
  /* ナビゲーションリンクの調整 */
  #mainNav .navbar-nav .nav-item .nav-link {
    font-size: 0.85rem;
    padding: 0.5rem 0.75rem;
  }
  
  /* ナビゲーション全体の調整 */
  #mainNav .navbar-nav {
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
  }
}

/* 小さいタブレット・大きいスマホ（530px〜767px）用の設定 */
@media (min-width: 530px) and (max-width: 767px) {
  #mainNav .navbar-brand img {
    height: 2.5rem;
  }
  
  #mainNav .navbar-toggler {
    width: 70px;
    font-size: 0.65rem;
    padding: 0.4rem;
  }
  
  .nav-contact {
    display: block;
    width: 30px;
    height: 30px;
    line-height: 30px;
  }
  
  /* 右側の要素の調整 */
  .nav-right-elements {
    gap: 6px;
  }
}

@media (min-width: 768px) {

	.wpcf7-form-control.form-control {
	  width: auto;
	  max-width: 100%;
	}
  
	/* フォームを中央に配置・背景色指定 */
	.wpcf7-form {
	  max-width: 680px;
	  margin-left:auto;
	  margin-right:auto;
	  background-color: #f1f1f1;
	  padding: 15px 20px;
	  border-radius: 5px;
	}
  
  }
  
  /* 必須マーク */
  .wpcf7-form small.text-danger {
	  color: #fff !important;
	  background-color: #dc3545;
	  font-size: 75%;
	  padding: 0.1em 0.3em;
	  margin-left: 0.5em;
  }
  
  /* 入力確認のチェックボックスを大きく */
  form .wpcf7-acceptance input[type="checkbox"] {
	  transform: scale(2.0);
	  margin-right: 0.5em;
  }
  
  /* 送信ボタンをぴったり中央に配置 */
  .wpcf7-submit.btn {
	  margin-left: 72px;
  }

  input, textarea{
	width: 100%;
  }

/* 1200px以下で会社情報のレイアウトを上下に配置 */
@media screen and (max-width: 1200px) {
	/* 会社情報のdt（タイトル）とdd（内容）を上下に配置 */
	dl.row dt {
		width: 100% !important;
		margin-bottom: 0.5rem;
		text-align: left;
	}
	
	dl.row dd {
		width: 100% !important;
		margin-left: 0 !important;
		margin-bottom: 1rem;
	}
	
	/* コロン（:）を非表示 */
	dl.row span.col-sm-1.text-center.d-none.d-md-block {
		display: none !important;
	}
	
	/* 会社情報のコンテナ調整 */
	#company .col-md-12 {
		padding: 0 15px;
	}
}

/* 768px以下でgrid-marginを適用 */
@media screen and (max-width: 768px) {
	.grid-margin{
		margin-top: 1rem;
	}
	
	/* 768px以下でタイトルとヘッダーの間隔を確保 */
	h1, h2 {
		margin-top: 1.5rem;
	}
	
	.page-section h2.section-heading, .page-section .section-heading.h2, h1.entry-title {
		margin-top: 1.5rem;
	}
	
	/* 小画面でのコンテナ幅調整 */
	.container {
		max-width: 100%;
		padding-left: 10px;
		padding-right: 10px;
	}
	
	/* 小画面でのフォームスタイル */
	.wpcf7-form {
		max-width: 100%;
		margin: 0 5px;
		background-color: #f1f1f1;
		padding: 15px;
		border-radius: 5px;
	}
	
	.wpcf7-form-control.form-control {
		width: 100%;
		max-width: 100%;
	}
	
	/* 小画面での送信ボタン位置調整 */
	.wpcf7-submit.btn {
		margin-left: 0;
		width: 100%;
	}
	
	/* 小画面での入力フィールド調整 */
	input, textarea {
		width: 100%;
		box-sizing: border-box;
	}
}

/* 小さいスマホ（480px以下）用の設定 */
@media screen and (max-width: 480px) {
	.page-section h2.section-heading, .page-section .section-heading.h2{
		font-size: 1.25rem;
		width: 110px;
		height: 40px;
		line-height: 40px;
		margin-bottom: 2rem;
		margin-top: 2rem; /* ヘッダーとの間隔を確保 */
	}
	h1.entry-title{
		font-size: 1.25rem;
		width: 110px;
		height: 40px;
		line-height: 40px;
		margin-bottom: 2rem;
		margin-top: 2rem; /* ヘッダーとの間隔を確保 */
	}
	.floating-button { 
		right: 20px;
		bottom: 20px;
	}
	.page-section {
		padding: 2rem 0;
	}
	h5, h5 {
		font-size: 1.1rem;
	}
	.kv {
		height: 50vh;
	}
	.kv img {
		height: 50vh;
		object-fit: cover;
		object-position: center;
	}
	.nav-contact{
		display: block;
	}
	#mainNav .navbar-nav .nav-item .nav-link {
		color: #404040;
		text-stroke: 2px #FFF;
		-webkit-text-stroke: 2px #fff;
    	paint-order: stroke;
	}
	
	/* 480px以下でのコンテナ幅調整 */
	.container {
		max-width: 100%;
		padding-left: 5px;
		padding-right: 5px;
	}
	
	/* 480px以下でのフォーム調整 */
	.wpcf7-form {
		margin: 0 2px;
		padding: 10px;
	}
	
	.wpcf7-form-control.form-control {
		padding: 0.75rem;
		font-size: 16px; /* iOSでのズーム防止 */
	}
	
	/* 小画面での必須マーク調整 */
	.wpcf7-form small.text-danger {
		font-size: 70%;
		padding: 0.05em 0.2em;
	}
	
	/* 小画面でのチェックボックス調整 */
	form .wpcf7-acceptance input[type="checkbox"] {
		transform: scale(1.5);
		margin-right: 0.3em;
	}
}

/* 530px以下でナビゲーション要素の調整 */
@media screen and (max-width: 530px) {
  #mainNav .navbar-brand img {
    height: 2.2rem;
  }
  
  #mainNav .navbar-toggler {
    width: 65px;
    font-size: 0.6rem;
    padding: 0.35rem;
  }
  
  .nav-contact {
    display: block;
    width: 28px;
    height: 28px;
    line-height: 28px;
  }
  
  /* 右側の要素の調整 */
  .nav-right-elements {
    gap: 4px;
  }
}