@charset 'utf-8';

/*

Theme Name: lomaca_moto


Template: twentyseventeen

Theme URI: http://wordpress.org/extend/themes/twentyseventeen

Author: the WordPress team

Author URI: http://wordpress.org/

Description: Twenty Seventeen 子テーマ

Version: 1.0

License: GNU General Public License v2 or later

License URI: http://www.gnu.org/licenses/gpl-2.0.html

Text Domain: twentyseventeen

*/

@import url('../twentyseventeen/style.css');

body, button, input, select, textarea {

    color: #333;

    font-family: "Libre Franklin", "Helvetica Neue", helvetica, arial, sans-serif;

    font-size: 16px;

    font-weight: 400;

    line-height: 1.66;


}


input[type="radio"] + label,
input[type="checkbox"] + label {
	font-weight: 400;
  display: inline;
}




.page:not(.home) #content {

    padding-bottom: 0em;

}



.site-content {

    padding: 0em 0 0;

}

.header_nav{

	width:20%;
	position: fixed;
    right: 27px;
    top: 30px;

	z-index: 999999	;

}



  /* ===============================================

  ハンバーガーのスタイリング

  =============================================== */

 .header_nav input[type="checkbox"] {

	opacity: 0;

	visibility: hidden;

	position: absolute;

  }

 .header_nav  input[type="radio"] + label, 
 .header_nav input[type="checkbox"] + label
 {
    font-weight: 400;
    display: block;
}



  .hamburger {

	display: block;

	width: 35px;

	height: 76px;

	position: absolute;

	right:0px;

	display: flex;

	justify-content: center;

	align-items: center;

	cursor: pointer;



  }

  .hamburger span,

  .hamburger span::before,

  .hamburger span::after {

	position: absolute;

	display: block;

	content: "";

	width: 100%;

	height: 2px;

	background-color: #000;

	transition: all 0.5s;

  }

  .hamburger span::before {

	top: -11px;

  }

  .hamburger span::after {

	bottom: -11px;

  }

  input[type="checkbox"]:checked + .hamburger span {

	background-color: transparent;

  }

  input[type="checkbox"]:checked + .hamburger span::before {

	top: 0;

	transform: rotate(45deg);

  }

  input[type="checkbox"]:checked + .hamburger span::after {

	transform: rotate(-45deg);

	bottom: 0;

  }

  

  /* ===============================================

  メニューのスタイリング

  =============================================== */

  .nav {

	position: fixed;

	width: 100%;

	height: 100vh;

	top: 80px;

	right: -120%;

	background-color:  #00CCCF;

	color: #fff;

	padding: 00px 0;

	border-top: 1px solid #fff;

	transition: all 0.5s;

	z-index: 999;



  }

  .nav__item a {

	display: block;

	font-size: 20px;

	padding: 20px 0 20px 50px;

	text-transform: uppercase;

	text-decoration: none;

	color: #fff;

	transition: all 0.3s;

	border-bottom: 1px dotted #fff;

	position: relative;

  }



  .nav__item a span.text-yellow{

	color: yellow;

  }



  .nav__item a small{

	color: yellow;

	font-size: 16px;

  }





  .nav__item{

	list-style:none;

  }



  .nav__item a:before {

		content: '';

		width: 18px;

		height: 18px;

		background: #fff;

		border-radius: 50%;

		position: absolute;

		top: 0;

		left: 22px;

		bottom: 0;

		margin: auto;

	  }

	  .nav__item a:after {

		content: '';

		width: 0;

		height: 0;

		border-style: solid;

		border-width: 4px 0 4px 6px;

		border-color: transparent transparent transparent #168654;

		position: absolute;

		top: 0;

		left: 29px;

		bottom: 0;

		margin: auto;

	  }

  .nav__item a:hover {

	color: #0f5474;

	background-color: #fff;

  }

  input[type="checkbox"]:checked ~ .nav {

	right: 0;

  }







.heading {

	align-items: center; /* 線を上下中央 */

	display: flex; /* 文字と線を横並び */

	justify-content: center; /* 文字を中央寄せ */

	color:#595656;

	font-size: 22px;

	letter-spacing: 0.1em;

  }

  .heading::before,

  .heading::after {

	background-color: #525252; /* 線の色 */

	border-radius: 0px; /* 線の両端を丸く */

	content: "";

	height: 2px; /* 線の高さ */

	width: 35px; /* 線の長さ */

  }

  .heading::before {

	margin-right: 10px; /* 文字との余白 */

	transform: rotate(60deg); /* 傾ける */

  }

  .heading::after {

	margin-left: 10px; /* 文字との余白 */

	transform: rotate(-60deg); /* 傾ける */

  }



#area_wrapper{

	width:1000px;

	display: flex;

	flex-wrap: wrap;

	justify-content: space-between;

	margin:30px auto;



}



#content_wrapper{

	width:1000px;

	display: block;

	margin:30px auto;



}

#content_wrapper h1{

	background: #a8cfdd;;

    padding: 0.5em;

    color: #fff;

     font-size: 23px;

    letter-spacing: 0.1em;

    width: 110%;

    margin: 20px 0 20px -5%;

}

h1.content_h1{

    background: #168654;

    padding: 0.5em;

    color: #fff;

     font-size: 23px;

    letter-spacing: 0.1em;

    width: 110%;

    margin: 20px 0 0 -5%;

}



.text-yellow{

	color:yellow;

}

#content_wrapper h2 {

	color: #168654;/*文字色*/

	padding: 0.5em 0;/*上下の余白*/

	border-top: solid 3px #168654;/*上線*/

	border-bottom: solid 3px #168654;/*下線*/

	margin-bottom:30px;

	margin-top:30px;

  }





  #content_wrapper h3 {

	padding: 0.25em 0.5em;/*上下 左右の余白*/

	color: #168654;/*文字色*/

	background: transparent;/*背景透明に*/

	border-left: solid 5px #07cb00;/*左線*/

  }




  * {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
  font-size: 16px;
}

body {
  font-family: "Noto Sans JP", sans-serif;
  color: #333333;
  line-height: 1.8;
  background-color: #fff;
  overflow-x: hidden;
}

img {
  max-width: 100%;
  height: auto;
  display: block;
}

a {
  text-decoration: none;
  color: inherit;
  transition: all 0.3s ease;
}

.container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 20px;
}
@media (max-width: 768px) {
  .container {
    padding: 0 15px;
  }
}

h1.redline {
  display: block;
  background-color: #a8cfdd;
  color: #fff;
  text-align: center;
  font-size: 30px;
}

h2.section-title {
  font-size: 23px;
  padding: 19px;
  border-bottom: 2px solid #000;
  line-height: 1.6;
}

#rentcar h2.section-title {
  font-size: 23px;
  padding: 19px;
  border-bottom: none;
  line-height: 1.6;
}

h2.section-title a{
	text-decoration: none;
	color: #000;
	border-bottom:none;
}

.header {
  background-color: #ffffff;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
  position: sticky;
  top: 0;
  z-index: 1000;
  padding: 20px 0;
}
.header .header-content {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.header .logo {
  font-family: "Montserrat", sans-serif;
  font-size: 28px;
  font-weight: 900;
  color: #333333;
  letter-spacing: 2px;
}
@media (max-width: 768px) {
  .header .logo {
    font-size: 22px;
  }
}
.header .nav {
  display: flex;
  align-items: center;
  gap: 30px;
}
@media (max-width: 768px) {
  .header .nav {
    display: none;
  }
}
.header .nav-link {
  font-size: 15px;
  font-weight: 500;
  color: #333333;
  transition: color 0.3s ease;
}
.header .nav-link:hover {
  color: #e60012;
}

.btn {
  display: inline-block;
  padding: 12px 30px;
  border-radius: 50px;
  font-weight: 700;
  text-align: center;
  transition: all 0.3s ease;
  cursor: pointer;
  border: none;
  font-size: 15px;
}
.btn.btn-header {
  background-color: #e60012;
  color: white;
  padding: 10px 25px;
}
.btn.btn-header:hover {
  background-color: rgb(179, 0, 14.0086956522);
  transform: translateY(-2px);
  box-shadow: 0 5px 15px rgba(230, 0, 18, 0.3);
}
.btn.btn-cta {
  background-color: transparent;
  padding: 0;
  border-radius: 0;
}
.btn.btn-cta:hover {
  opacity: 0.8;
  transform: translateY(-3px);
}
.btn.btn-cta .btn-line-img {
  max-width: 300px;
  margin: 0 auto;
}

.hero {
  position: relative;
  height: 1300px;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}
@media (max-width: 768px) {
  .hero {
    height: 350px;
  }
}
.hero .hero-bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
}
.hero .hero-bg .hero-image {
  width: 100%;
  height: auto;
  -o-object-fit: cover;
     object-fit: cover;
}
.hero .hero-content {
  position: relative;
  z-index: 2;
  text-align: center;
  color: white;
  max-width: 800px;
  padding: 0 20px;
}
.hero .hero-title {
  font-family: "Montserrat", sans-serif;
  font-size: 72px;
  font-weight: 900;
  letter-spacing: 4px;
  margin-bottom: 15px;
  text-shadow: 2px 2px 10px rgba(0, 0, 0, 0.3);
}
@media (max-width: 768px) {
  .hero .hero-title {
    font-size: 42px;
    letter-spacing: 2px;
  }
}
.hero .hero-subtitle {
  font-size: 24px;
  font-weight: 500;
  margin-bottom: 40px;
  text-shadow: 1px 1px 5px rgba(0, 0, 0, 0.3);
}
@media (max-width: 768px) {
  .hero .hero-subtitle {
    font-size: 18px;
  }
}
.hero .hero-features {
  display: flex;
  justify-content: center;
  gap: 40px;
  flex-wrap: wrap;
}
.hero .hero-feature {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 18px;
  font-weight: 700;
  background-color: rgba(255, 255, 255, 0.2);
  padding: 15px 30px;
  border-radius: 50px;
  -webkit-backdrop-filter: blur(10px);
          backdrop-filter: blur(10px);
}
@media (max-width: 768px) {
  .hero .hero-feature {
    font-size: 16px;
    padding: 12px 25px;
  }
}
.hero .hero-feature .feature-icon {
  font-size: 24px;
}

.section-title {
  font-size: 42px;
  font-weight: 900;
  text-align: center;
  margin-bottom: 10px;
  color: #333333;
}
@media (max-width: 768px) {
  .section-title {
    font-size: 32px;
  }
}

.section-subtitle {
  font-family: "Montserrat", sans-serif;
  font-size: 16px;
  font-weight: 700;
  text-align: center;
  color: #e60012;
  letter-spacing: 3px;
  margin-bottom: 50px;
}

.features {
  padding: 80px 0;
  background-color: #fff;
}
@media (max-width: 768px) {
  .features {
    padding: 0px 0;
  }
}
.features .features-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 30px;
  max-width: 600px;
  margin: 0 auto;
}
.features .feature-card {
  text-align: center;
  padding: 20px 30px;
  background-color: white;
  border-radius: 15px;
}
.features .feature-card .feature-icon-wrapper {
  margin-bottom: 0px;
}
.features .feature-card .feature-icon-wrapper .feature-img {
  max-width: 100%;
  height: auto;
  border-radius: 10px;
}
.features .feature-card .feature-title {
  font-size: 28px;
  font-weight: 700;
  margin-bottom: 15px;
  color: #333333;
}
@media (max-width: 768px) {
  .features .feature-card .feature-title {
    font-size: 24px;
  }
}
.features .feature-card .feature-description {
  font-size: 16px;
  color: #666666;
  line-height: 1.8;
}

#rentcar img {
  margin: 0 auto;
}

.flow {
  padding: 100px 0;
  background-color: #ffffff;
}
.flow h1 {
  display: block;
  background-color: #a8cfdd;
  color: #fff;
  text-align: center;
  font-size: 40px;
}
.flow h2 {
  font-size: 25px;
  padding: 20px;
  border-bottom: 2px solid #000;
}
@media (max-width: 768px) {
  .flow {
    padding: 60px 0;
  }
}
.flow .flow-step {
  display: flex;
  margin-top: 50px;
}
.flow .flow-step .flow-number {
  margin-bottom: 20px;
  width: 50%;
}
.flow .flow-step .flow-number .step-number-img {
  text-align: center;
  width: 90%;
}
.flow .flow-step .flow-icon {
  margin-bottom: 25px;
  width: 50%;
  padding: 20px 0 0 0;
}
.flow .flow-step .flow-icon p {
  font-size: 18px;
  font-weight: bold;
  line-height: 1.4;
}
.flow .flow-step .flow-icon p span.small {
  font-size: 12px;
}
.flow .flow-step .flow-title {
  font-size: 22px;
  font-weight: 700;
  margin-bottom: 15px;
  color: #333333;
}
@media (max-width: 768px) {
  .flow .flow-step .flow-title {
    font-size: 20px;
  }
}
.flow .flow-step .flow-description {
  font-size: 15px;
  color: #666666;
  line-height: 1.8;
  padding: 0 10px;
}

.areas {
  padding: 100px 0;
  background-color: #fff;
}
@media (max-width: 768px) {
  .areas {
    padding: 60px 0;
  }
}
.areas .areas-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 30px;
  margin-top: 50px;
}
.areas .area-card {
  background-color: white;
  border-radius: 0px;
  overflow: hidden;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.areas .area-card:hover {
  transform: translateY(-10px);
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.15);
}
.areas .area-card .area-image {
  width: 100%;
  height: 250px;
  overflow: hidden;
}
.areas .area-card .area-image .area-img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  transition: transform 0.3s ease;
}
.areas .area-card .area-image:hover .area-img {
  transform: scale(1.1);
}
.areas .area-card .area-title {
  font-size: 18px;
  font-weight: 700;
  padding: 10px 0px 10px;
  color: #00CCCF
}
.areas .area-card .area-description {
  font-size: 15px;
  color: #000;
  padding: 0 0px 10px;
  line-height: 1.8;
  font-weight: bold;
}

.safety {
  padding: 100px 0;
  background-color: #ffffff;
}
@media (max-width: 768px) {
  .safety {
    padding: 60px 0;
  }
}
.safety .safety-step {
  display: flex;
  margin-top: 50px;
}
.safety .safety-step .safety-number {
  margin-bottom: 20px;
  width: 20%;
  padding: 5px 0 0 0;
}
.safety .safety-step .safety-number .safety-number-img {
  text-align: center;
  width: 80%;
}
.safety .safety-step .safety-icon {
  margin-bottom: 25px;
  width: 80%;
}
.safety .safety-step .safety-icon h3 {
  color: 00cccf;
  padding: 0 0 10px 0;
  font-size: 18px;
}
.safety .safety-step .safety-icon p {
  font-size: 15px;
  font-weight: bold;
  line-height: 1.6;
}
.safety .safety-step .safety-icon p span.small {
  font-size: 12px;
}
.safety .safety-step .flow-title {
  font-size: 22px;
  font-weight: 700;
  margin-bottom: 15px;
  color: #333333;
}
@media (max-width: 768px) {
  .safety .safety-step .flow-title {
    font-size: 20px;
  }
}
.safety .safety-step .flow-description {
  font-size: 15px;
  color: #666666;
  line-height: 1.8;
  padding: 0 10px;
}

.bikes {
  padding: 100px 0;
  background-color: #fff;
}
@media (max-width: 768px) {
  .bikes {
    padding: 60px 0;
  }
}
.bikes .bikes-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 30px;
  margin-top: 50px;
}
.bikes .bike-card {
  background-color: #fff;
  border-radius: 15px;
  overflow: hidden;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.bikes .bike-card:hover {
  transform: translateY(-10px);
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.15);
}
.bikes .bike-card .bike-image {
  width: 100%;
  height: 250px;
  background-color: white;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
}
.bikes .bike-card .bike-image .bike-img {
  max-width: 100%;
  max-height: 100%;
  -o-object-fit: contain;
     object-fit: contain;
}
.bikes .bike-card .bike-name {
  font-size: 20px;
  font-weight: 700;
  padding: 20px 20px 10px;
  color: #333333;
  text-align: center;
}
.bikes .bike-card .bike-description {
  font-size: 15px;
  color: #666666;
  padding: 0 20px 25px;
  text-align: center;
  line-height: 1.8;
}

.cta {
  padding: 100px 0;
  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
  text-align: center;
}
@media (max-width: 768px) {
  .cta {
    padding: 60px 0;
  }
}
.cta .cta-content {
  max-width: 700px;
  margin: 0 auto;
}
.cta .cta-title {
  font-size: 48px;
  font-weight: 900;
  color: white;
  margin-bottom: 20px;
}
@media (max-width: 768px) {
  .cta .cta-title {
    font-size: 36px;
  }
}
.cta .cta-description {
  font-size: 20px;
  color: white;
  margin-bottom: 40px;
}
@media (max-width: 768px) {
  .cta .cta-description {
    font-size: 18px;
  }
}

.footer {
  background-color: #333333;
  color: white;
  padding: 60px 0 30px;
}
.footer .footer-content {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 50px;
  margin-bottom: 40px;
}
@media (max-width: 768px) {
  .footer .footer-content {
    grid-template-columns: 1fr;
    gap: 30px;
  }
}
.footer .footer-info .footer-logo {
  font-family: "Montserrat", sans-serif;
  font-size: 28px;
  font-weight: 900;
  margin-bottom: 15px;
  letter-spacing: 2px;
}
.footer .footer-info .footer-text {
  font-size: 15px;
  color: rgba(255, 255, 255, 0.8);
  line-height: 1.8;
}
.footer .footer-links {
  display: flex;
  flex-direction: column;
  gap: 15px;
}
.footer .footer-links .footer-link {
  font-size: 15px;
  color: rgba(255, 255, 255, 0.8);
  transition: color 0.3s ease;
}
.footer .footer-links .footer-link:hover {
  color: white;
}
.footer .footer-bottom {
  border-top: 1px solid rgba(255, 255, 255, 0.2);
  padding-top: 30px;
  text-align: center;
}
.footer .footer-bottom .copyright {
  font-size: 14px;
  color: rgba(255, 255, 255, 0.6);
}/*# sourceMappingURL=style.css.map */





#area_wrapper a.area_pre{

	display: block;

	background-color: #fff;

	border:1px solid  #00CCCF;

	color:#00CCCF;

	border-radius: 20px;

	width:48%;

	padding:20px;

	font-size:20px;

	text-align: center;

	margin:0 0 15px;

	cursor: pointer;

}





#area_wrapper .area_pre.on{

	background-color: #168654;

	color:#fff;

}



#area_wrapper .area_pre.no-active{

	background-color: #eee;

	color:#ccc;

	border:1px solid #ccc;

	pointer-events: none;

}

#area_wrapper .area_pre:hover{

	background-color: #168654;

	color:#fff;

}



.finder-box{

	width: 85%;

	margin:0 auto;

}



.finder-type-box{

	width:100%;

	display: block;

	margin-left:0;
  text-align: center;

}



.finder-type-box .finder-select-label{

	font-size:15px;

	color:#6f767b;
  padding:0 0 14px 0;
  font-weight: normal;

}





.finder-type-box select {

    min-width: 230px;
    width: 100%;
    height: 2.9em;
    padding: .4em calc(.8em + 30px) .4em .8em;
    border: 1px solid #00CCCF;
    border-radius: 36px;
    background-color: #fff;
    color: #333333;
    font-size: 13px;
    cursor: pointer;
    text-align: left;

}



.rental-finder {

    margin-bottom: 0em;

}



.finder-date-label{

	font-size:16px;

	color:#6f767b;

}



.finder-date-box.start{

	width:45%;

	display: inline-block;	

}



.finder-date-box.end{

	width:45%;

	display: inline-block;	

}



.finder-date-box input[type="text"]{

	width: 100%;

display: block;

font-size: 22px;



}

.finder-start-label{

	width:100%;

	display: block;

}





.button-box{

	width:80%;

	margin:0px auto;

	/* display: flex;

	justify-content: center; */

}



.button-box input[type="submit"] {

 background-color: #00CCCF;

 border-radius: 5px;

 display: block;

 width:200px;

 margin: 40px auto 10px;

 font-size: 16px;

}



.button-box input[type="button"] {

	background-color: #8e8d8d;

	border-radius: 5px;

	display: block;

	width:150px;

	margin: 0 auto;

   }





.rental-car-spec {

    margin-bottom: 2em;

    width: 95%;

    margin: 38px auto;

}



.ui-widget-header {

    border: 0px solid #aaaaaa !important;

    background: #eee !important;

    color: #222222;

    font-weight: bold;

}



.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active, a.ui-button:active, .ui-button:active, .ui-button.ui-state-active:hover {

    border: 0px solid #aaaaaa !important;

    background: #168654 !important;

    font-weight: normal;

    color: #ffff !important;

	border-radius: 50%;

	text-align: center;

}



.howto_outwrppwr{

	display: flex;



}

.howto_wrapper{

	border:1px solid #168654;

	padding:20px;

	text-align: center;

	border-radius: 5px;

	width:300px;

}



.triangle{

	border-top: 50px solid transparent;

	border-bottom: 50px solid transparent;

	border-left: 50px solid #168654;

  }





input + button, input + input[type="button"], input + input[type="submit"] {

    padding: 0.75em 1.5em;

    margin: 5px;

}



.map {

	width: 100%;

	position: relative;

	padding-top: 56.25%;

  }

  

  .map iframe {

	position: absolute;

	top: 0;

	left: 0;

	width: 100%;

	height: 100%;

  }



@media screen and (max-width:790px) {



#area_wrapper{

	width:90%;

	display: flex;

	flex-wrap: wrap;

	justify-content: space-between;

	margin:30px auto;

}



#contents_wrapper{

	width:90%;

	display: block;

	flex-wrap: wrap;

	justify-content: space-between;

	margin:30px auto;

}



#content_wrapper {

    display: block;

    margin: 30px auto;

    width: 92%;

}





#content_wrapper ul, ol {

    margin: 0 0 0 1em;

    padding: 0;

}



.howto_outwrppwr{

	display: block;

	

}

.howto_wrapper{

	border:1px solid #168654;

	padding:20px;

	text-align: center;

	border-radius: 10px;

	width:60%;

	margin:0 auto;

	background-color: #16866726;

}



.howto_wrapper img{

	width:50%;

}



.triangle{

	border-top: 25px solid #168654;

	border-right: 25px solid transparent;

	border-left: 25px solid transparent;



	width: 25px;

	margin: 30px auto 0;

}





}



/*

@media screen and (min-width: 48em) {



	.home #primary.rental-car,

	.single #primary.rental-car {

		float: none;

		width: 100%;

	}



	.home .site-main > article {

        float: left;

        margin: 0 1.5em auto;

		padding-bottom: 4em;

		width: 42%;

	}



	body.page #primary.rental-car .entry-content {

		float: none;

		width: 100%;

	}



}



.page-header.entry-header {

	float: none;

}

*/







/* タイCSS */

/* tai_container */

#tai_body {

	background: url(assets/images/back_img.png) center center / cover no-repeat fixed;

  }

  

  .tai_top {

	display: grid;

  }

  

  img.tai_top_img {

	width: 100%;

  }

  

  img.tai_logo {

	position: absolute;

	top: 20px;

  }

  

  @media screen and (max-width:540px) {

	img.tai_logo {

	  width: 200px;

	  top: 10px;

	}

  }

  

  .tai_reserve_box {

	position: absolute;

	top: 120px;

	right: 120px;

  }

  

  @media screen and (max-width:540px) {

	.tai_reserve_box {

	  top: 30px;

	  right: 10px;

	}

  }

  

  .tai_reserve {

	background-color: 24A74A;

	color: fff;

	padding: 34px;

	border-radius: 30px;

	font-size: 24px;

	font-weight: bold;

	box-shadow: 0px 10px 10px -6px rgba(0, 0, 0, 0.3);

  }

  

  @media screen and (max-width:540px) {

	.tai_reserve {

	  padding: 7px;

	  font-size: 14px;

	}

  }

  

  a.tai_reserve {

	color: #fff !important;

	text-decoration: none;

  }

  

  @media screen and (max-width:540px) {

	a.tai_reserve {

	  font-size: 14px;

	}

  }

  

  /* tai_discription */

  #tai_discription {

	margin-top: 70px;

  }

  

  @media screen and (max-width:540px) {

	#tai_discription {

	  margin-top: 24px;

	}

  }

  

  .tai_discription_title {

	text-align: center;

  }

  

  .tai_store {

	font-size: 26px;

	font-weight: bold;

  }

  

  .tai_operation {

	display: grid;

	grid-template-columns: 1fr 1fr;

	width: 65%;

	margin: 0 auto;

	align-items: center;

  }

  

  @media screen and (max-width:540px) {

	.tai_operation {

	  grid-template-columns: 1fr;

	}

  }

  

  img.tai_logo_discription {

	width: 400px;

  }

  

  .tai_store_description {

	font-weight: bold;

	font-size: 24px;

	color: 17194F;

  }

  

  @media screen and (max-width:540px) {

	.tai_store_description {

	  padding-top: 18px;

	  font-size: 16px;

	}

  }

  

  .tai_use {

	text-align: center;

	max-width: 595px;

	width: 80%;

	margin: 0 auto;

	background-color: #24A74A;

	color: #fff;

	padding: 34px;

	border-radius: 30px;

	font-size: 24px;

	font-weight: bold;

	margin-top: 70px;

	margin-bottom: 60px;

	box-shadow: 0px 10px 10px -6px rgba(0, 0, 0, 0.3);

  }

  

  @media screen and (max-width:540px) {

	.tai_use {

	  font-size: 18px;

	  padding: 18px;

	}

  }

  

  a.tai_use_link {

	font-size: 24px;

	text-decoration: none;

	color: #fff !important;

  }

  

  @media screen and (max-width:540px) {

	a.tai_use_link {

	  font-size: 18px;

	}

  }

  

  .tai_use_container {

	display: flex;

	justify-content: space-around;

  }

  

  @media screen and (max-width:540px) {

	.tai_use_container {

	  display: block;

	  text-align: center;

	}

  }

  

  img.tai_use_img {

	width: 300px;

  }

  

  @media screen and (max-width:540px) {

	img.tai_use_img {

	  margin-bottom: 12px;

	}

  }

  

  /* tai_price */

  section#tai_price {

	margin-top: 48px;

  }

  

  .tai_price_box {

	display: flex;

	justify-content: space-around;

  }

  

  @media screen and (max-width:540px) {

	.tai_price_box {

	  display: block;

	  text-align: center;

	}

  }

  

  img.tai_price_off_img {

	width: 375px;

	height: 140px;

  }

  

  @media screen and (max-width:540px) {

	img.tai_price_off_img {

	  width: 300px;

	  height: 120px;

	}

  }

  

  .tai_title_content_price {

	position: relative;

	font-size: 90px;

	color: #ffffff;

  }

  

  .tai_title_content_price::before {

	position: absolute;

	content: "";

	top: 50%;

	background-color: FEC530;

	width: 300px;

	height: 70px;

	z-index: -1;

  }

  

  @media screen and (max-width:540px) {

	.tai_title_content_price::before {

	  width: 230px;

	  height: 40px;

	}

  }

  

  .tai_pran_box {

	display: grid;

	grid-template-columns: 1fr 1fr 1fr;

	gap: 18px;

	margin: 18px;

  }

  

  @media screen and (max-width:540px) {

	.tai_pran_box {

	  grid-template-columns: 1fr;

	}

  }

  

  @media screen and (max-width:540px) {

	img.tai_price_img {

	  padding: 12px 0;

	}

  }

  

  .tai_car_pran {

	text-align: center;

	font-size: 24px;

	font-weight: bold;

	color: #ffffff;

  }

  

  

  

  

  

  /* img.tai_price_off_img_left {

	display: block;

	padding: 8px;

  }

  

  img.tai_price_off_img_right {

	max-width: 450px;

	width: 80%;

	padding: 0 8px;

  }

  

  .tai_price_off_img_right_content {

	display: flex;

  }

  

  @media screen and (max-width:540px) {

	.tai_price_off_img_right_content {

	  display: block;

	  text-align: center;

	}

  } */

  

  /* tai_profile */

  section#tai_profile {

	margin: 90px 90px;

  }

  

  @media screen and (max-width:540px) {

	section#tai_profile {

	  margin: 0;

	}

  }

  

  .tai_title_content_profile {

	position: relative;

	font-size: 90px;

	color: #ffffff;

  }

  

  @media screen and (max-width:540px) {

	.tai_title_content_profile {

	  font-size: 60px;

	  text-align: center;

	}

  }

  

  .tai_title_content_profile::before {

	position: absolute;

	content: "";

	top: 50%;

	background-color: 2EB0CC;

	width: 600px;

	height: 70px;

	z-index: -1;

  }

  

  @media screen and (max-width:540px) {

	.tai_title_content_profile::before {

	  width: 320px;

	  height: 40px;

	}

  }

  

  .tai_driver_discription_box {

	position: relative;

	font-size: 90px;

	color: #ffffff;

	padding: 40px;

  }

  

  @media screen and (max-width:540px) {

	.tai_driver_discription_box {

	  font-size: 60px;

	  text-align: center;

	}

  }

  

  .tai_driver_discription_box::before {

	position: absolute;

	content: "";

	top: 30%;

	background-color: 2EB0CC;

	width: 380px;

	height: 100px;

	z-index: -1;

  }

  

  @media screen and (max-width:540px) {

	.tai_driver_discription_box::before {

	  position: absolute;

	  content: "";

	  top: 20%;

	  left: 17px;

	  background-color: 2EB0CC;

	  width: 340px;

	  height: 150px;

	  z-index: -1;

	}

  }

  

  .tai_driver_title {

	font-size: 32px;

	font-weight: bold;

	color: #fff;

  }

  

  p.tai_driver_discription_ {

	padding: 12px 24px;

  }

  

  .tai_driver_img_box {

	display: grid;

	grid-template-columns: 1fr 1fr 1fr;

	gap: 20px;

  }

  

  @media screen and (max-width:540px) {

	.tai_driver_img_box {

	  grid-template-columns: 1fr;

	  padding: 24px;

	}

  }

  

  /* .tai_profile_box {

	display: flex;

	justify-content: space-around;

	margin-top: 48px;

  }

  

  @media screen and (max-width:375px) {

	.tai_profile_box {

	  display: block;

	  text-align: center;

	}

  }

  

  .tai_driver {

	font-size: 34px;

	font-weight: bold;

  }

  

  .tai_driver_discription {

	font-weight: bold;

  }

  

  @media screen and (max-width:375px) {

	.tai_driver_discription {

	  padding: 0 32px;

	}

  }

  

  .tai_driver_img_content {

	display: grid;

	grid-template-columns: 1fr 1fr 1fr;

	gap: 20px;

  }

  

  .tai_driver_img_box {

	width: 130px;

	height: 130px;

  }

  

  img.tai_driver_img {

	width: 130px;

	height: 130px;

  }

  

  .tai_driver_name {

	text-align: center;

	padding-top: 12px;

	font-weight: bold;

  } */

  

  

  /* tai_reserve_flow */

  .tai_reserve_flow_title {

	text-align: center;

	background-color: 24A74A;

	color: fff;

	padding: 34px;

	font-size: 24px;

	font-weight: bold;

	margin: 120px 0;

  }

  

  @media screen and (max-width:540px) {

	.tai_reserve_flow_title {

	  margin: 40px 0;

	}

  }

  

  .tai_reserve_flow_content {

	display: flex;

	width: 70%;

	margin: 0 auto;

	margin-bottom: 60px;

  }

  

  @media screen and (max-width:540px) {

	.tai_reserve_flow_content {

	  display: block;

	}

  }

  

  .tai_reserve_flow_content:nth-child(even) {

	flex-direction: row-reverse;

  }

  

  .tai_use_flow_img {

	max-width: 450px;

	width: 70%;

  }

  

  @media screen and (max-width:540px) {

	.tai_use_flow_img {

	  width: 100%;

	}

  }

  

  .tai_reserve_detail {

	margin: 0 40px;

  }

  

  @media screen and (max-width:540px) {

	.tai_reserve_detail {

	  margin: 0;

	}

  }

  

  .tai_reserve_number_add {

	width: 100px;

	height: 100px;

	padding-top: 5px;

	background-color: #529dc0;

	color: #fff;

	font-weight: bold;

	font-size: 62px;

	border-radius: 50%;

	text-align: center;

	box-sizing: border-box;

  }

  

  @media screen and (max-width:540px) {

	.tai_reserve_number_add {

	  font-size: 34px;

	  width: 70px;

	  height: 70px;

	  padding-top: 10px;

	}

  }

  

  .tai_reserve_number_even {

	width: 100px;

	height: 100px;

	padding-top: 5px;

	background-color: #5585D8;

	color: #fff;

	font-weight: bold;

	font-size: 62px;

	border-radius: 50%;

	text-align: center;

	box-sizing: border-box;

  }

  

  @media screen and (max-width:540px) {

	.tai_reserve_number_even {

	  font-size: 34px;

	  width: 70px;

	  height: 70px;

	  padding-top: 10px;

	}

  }

  

  .tai_flow_text_title {

	font-size: 28px;

	color: 133172;

	font-weight: bold;

  }

  

  @media screen and (max-width:540px) {

	.tai_flow_text_title {

	  font-size: 24px;

	  margin-top: 12px;

	}

  }

  

  .tai_flow_text {

	font-size: 18px;

	font-weight: bold;

	padding: 14px;

	border-radius: 10px;

	background-color: #ffffff;

  }

  

  @media screen and (max-width:540px) {

	.tai_flow_text {

	  font-size: 14px;

	}

  }

  

  /* tai_contact_container */

  #tai_contact_container {

	color: #F2F2F2;

	margin-bottom: 32px;

  }

  

  .tai_contact_box {

	position: relative;

	background-color: rgba(34, 167, 74, 0.70);

  }

  

  .tai_contact_title {

	position: absolute;

	top: 15%;

	left: 50%;

	transform: translate(-50%, -50%);

	font-size: 52px;

	font-weight: bold;

	color: #434040;

  }

  

  @media screen and (max-width:540px) {

	.tai_contact_title {

	  font-size: 18px;

	}

  }

  

  .tai_contact_tel {

	position: absolute;

	top: 40%;

	left: 50%;

	transform: translate(-50%, -50%);

	font-size: 52px;

	font-weight: bold;

	color: #434040;

  }

  

  @media screen and (max-width:540px) {

	.tai_contact_tel {

	  top: 30%;

	  font-size: 18px;

	}

  }

  

  .tai_contact_line {

	position: absolute;

	top: 60%;

	left: 50%;

	transform: translate(-50%, -50%);

	font-size: 18px;

	font-weight: bold;

	color: #434040;

  }

  

  @media screen and (max-width:540px) {

	.tai_contact_line {

	  font-size: 12px;

	}

  }

  

  .tai_contact_line_box {

	position: absolute;

	bottom: 10%;

	left: 50%;

	transform: translate(-50%, -50%);

	font-size: 22px;

	padding: 20px 42px;

	border-radius: 20px;

	color: #24A74A;

	background-color: #F2F2F2;

	font-weight: bold;

	text-align: center;

	width: 300px;

	box-shadow: 0px 10px 10px -6px rgba(0, 0, 0, 0.3);

  }

  

  @media screen and (max-width:540px) {

	.tai_contact_line_box  {

	  padding: 8px 12px;

	  bottom: -5%;

	  font-size: 14px;

	}

  }

  

  .tai_contact_link {

	font-size: 22px;

	color: #24A74A;

  }

  

  @media screen and (max-width:540px) {

	.tai_contact_link {

	  font-size: 14px;

	}

  }





  .footer_sns{

	width:80%;

	margin:0 auto;

  }



  .footer_sns ul{

	display: flex;

	flex-wrap: wrap;

	justify-content: space-between;

  }



  .footer_sns ul li{

	list-style:none;

  }



  .text-center{

	text-align: center;

  }

  

  #shiharai_buttton {

	box-shadow: 2px 2px 0px 0px #919191;

	background:linear-gradient(to bottom, #f7cf2d 5%, #ffaa00 100%);

	background-color:#f7cf2d;

	border-radius:6px;

	display:inline-block;

	cursor:pointer;

	color:#ffffff;

	font-family:Arial;

	font-size:18px;

	font-weight:bold;

	padding:16px 58px;

	text-decoration:none;

	}

	#shiharai_buttton :hover {

	background:linear-gradient(to bottom, #ffaa00 5%, #f7cf2d 100%);

	background-color:#ffaa00;

	}

	#shiharai_buttton :active {

	position:relative;

	top:1px;

	}



  .finder-date-box input[type="text"]{



  }



  .first-four {

	/* 最初の4文字に適用するスタイル */

	color: red; /* 例 */

	font-weight: bold; /* 例 */

  }





