@charset "UTF-8";
/*
Theme Name: Emanon Business
Theme URI: https://wp-emanon.jp
Author: 株式会社イノ・コード
Author URI: https://innocord.co.jp/
Description: Emanon Businessは、簡単な操作で本格的なブログを始めることができるEmanon Pro専用の子テーマです。Emanon Proの機能に加え、フロントページのデザイン機能を拡張しています。Emanon Pro本体がインストールされていないと動作しませんのでご注意ください。
Template: emanon-pro
Version: 1.6.3
License: GPLv2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: one-column, two-columns, three-columns, left-sidebar, right-sidebar, theme-options

Emanon Business用のスタイルを以下に記述
カスタマイズ機能のCSS圧縮をオンにしている場合、オフに切り替えてからスタイルを追加し、その後、再度CSS圧縮をオンにしてください。
*/

.inner {
	padding: 0 8px;
}

/* Newsticker section ======================================================= */

.eb-ticker-section {
	display: block;
	height: 48px;
	padding: 0 8px;
	background-color: #f8f8f8;
	font-size: 14px;
	font-size: 1.4rem;
}

.ticker-label {
	float: left;
	margin-right: 8px;
	line-height: 48px;
}

.ticker-label a {
	padding: 4px 6px;
	color: #fff;
	background-color: #161410;
}

.ticker-label a:hover {
	color: #fff;
	background-color: #6584d1;
}

.ticker-date {
	display: none;
}

.ticker-title {
	height: 48px;
	line-height: 48px;
	overflow: hidden;
}

.ticker-title li {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

/* solution section ========================================================= */

.eb-solution-section {
	position: relative;
	padding: 82px 0;
	text-align: center;
	background-color: #fff;
}

.solution-header {
	margin: 0 0 48px 0;
}

.solution-header h3 {
	position: relative;
	margin: 0 0 16px 0;
	font-size: 26px;
	font-size: 2.6rem;
	color: #000c15;
}

.solution-header p {
	margin: 16px 0 32px 0;
	color: #303030;
}

.solution-box-list {
	width: 100%;
	margin: 0 2.6% 32px 0;
	box-sizing: border-box;
	border-radius: 0 0 4px 4px;
	-webkit-transition: all 0.2s ease 0s;
	transition: all 0.2s ease 0s;
}

.solution-box-list:nth-child(3n+1) {
	margin: 0 0 32px 0;
}

.solution-box-list p {
	color: #000c15;
}

.solution-box-icon img {
	width: 96px;
	height: 96px;
	border-radius: 50%;
}

.solution-box-icon i {
	width: 96px;
	height: 96px;
	line-height: 96px;
	border-radius: 50%;
	border: 2px solid #9b8d77;
	color: #9b8d77;
	-webkit-transition: all 0.2s ease 0s;
	transition: all 0.2s ease 0s;
}

.solution-box-list:hover i {
	box-shadow: 0 0 0 0px #00bcd4;
	background: #9b8d77;
	border: 2px solid #9b8d77;
	color: #fff;
}

.solution-box-detail {
	overflow: hidden;
}

.solution-box-list h3 {
	padding: 16px 0;
	font-size: 20px;
	font-size: 2.0rem;
}

.solution-box-list h3:before, .solution-box-list h3:after {
	display: inline-block;
	opacity: 0;
	-webkit-transition: -webkit-transform 0.3s, opacity 0.2s;
	transition: transform 0.3s, opacity 0.2s;
}

.solution-box-list h3:before {
	margin-right: 10px;
	content: '[';
	-webkit-transform: translateX(20px);
	transform: translateX(20px);
}

.solution-box-list h3:after {
	content: ']';
	-webkit-transform: translateX(-20px);
	transform: translateX(-20px);
	margin-left: 8px;
}

.solution-box-list:hover h3:before, .solution-box-list:hover h3:after, .solution-box-list:hover h3:before, .solution-box-list:hover h3:after {
	-webkit-transform: translateX(0px);
	transform: translateX(0px);
	opacity: 1;
}

.bottom-arrow {
	position: absolute;
	left: 50%;
	margin-left: -20px;
	width: 40px;
	height: 40px;
	background: #fff;
	-webkit-transform: rotate( 45deg);
	-moz-transform: rotate( 45deg);
	transform: rotate( 45deg);
	bottom: -20px;
	-webkit-filter: drop-shadow(2px 1px 0px rgba(0, 0, 0, 0.1));
	filter: drop-shadow(2px 1px 0px rgba(0, 0, 0, 0.1));
	z-index: 888;
}

/* Sales section ============================================================ */

.eb-sales-section {
	padding: 82px 0;
	border-top: 1px solid #e2e5e8;
}

.eb-sales-section .inner {
	padding: 0 16px;
}

.sales-section img {
	margin-bottom: 32px;
}

.sales-section-col {
	width: 100%;
}

.sales-header {
	margin: 0 0 64px 0;
	text-align: center;
}

.sales-content p {
	padding-bottom: 16px;
	text-align: justify;
}

.sales-section-cta {
	margin-top: 16px;
	text-align: center;
}

.sales-section-btn {
	width: 100%;
}

.sales-section-btn a {
	background-color: #9b8d77;
	font-size: 12px;
	font-size: 1.2rem;
	color: #fff;
}

.sales-section-box {
	padding: 56px 0 0 0;
}

.sales-box-list {
	padding-bottom: 32px;
}

.sales-box-list:nth-child(3) {
	padding-bottom: 0;
}

.sales-box-header {
	position: relative;
	margin-bottom: 8px;
}

.sales-box-header h3, .sales-box-header i {
	-webkit-transition: 0.2s ease-in-out;
	transition: 0.2s ease-in-out;
}

.sales-box-icon {
	position: absolute;
	top: 0;
	left: 0;
}

.sales-box-detail p {
	padding-bottom: 16px;
	text-align: justify;
}

#sales-section-video {
	width: 100%;
}

.sales-section-video-wrap {
	position: relative;
}

.sales-section-video-btn {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 40px;
	/*コントローラー分下部に余白を*/
	cursor: pointer;
}

/* Benefit section ========================================================== */

.eb-benefit-section {
	position: relative;
	padding: 86px 0 54px 0;
	border-top: 1px solid #e2e5e8;
	background-color: #f8f8f8;
	text-align: center;
}

.benefit-header {
	margin: 0 0 48px 0;
	padding: 0 16px;
}

.benefit-header h3 {
	position: relative;
	margin: 0 0 16px 0;
	font-size: 26px;
	font-size: 2.6rem;
	color: #000c15;
}

.benefit-header p {
	margin: 16px 0 32px 0;
	color: #303030;
}

.benefit-box-list {
	margin: 0 2.9% 32px 0;
	padding: 16px;
	width: 100%;
	box-sizing: border-box;
	border-radius: 0 0 4px 4px;
	border: 1px solid #e2e5e8;
	background-color: #f4f4f4;
	-webkit-transition: all 0.2s ease 0s;
	transition: all 0.2s ease 0s;
}

.benefit-box-list:hover {
	background-color: #6584d1;
	color: #fff
}

.benefit-box-list:nth-child(3n+1) {
	margin: 0 0 32px 0;
}

.benefit-box-icon {
	min-height: 128px;
}

.benefit-box-icon img {
	width: 100%;
	;
	height: 100%;
	vertical-align: bottom;
}

.benefit-box-icon i {
	margin: 32px 0;
	font-size: 64px;
	color: #9b8d77;
	-webkit-transition: all 0.2s ease 0s;
	transition: all 0.2s ease 0s;
}

.benefit-box-list:hover i {
	color: #fff;
	-webkit-transform: TranslateY(-8px);
	transform: TranslateY(-8px);
}

.benefit-box-detail {
	position: relative;
	overflow: hidden;
}

.benefit-box-detail h3 {
	margin: 16px 0;
	font-size: 20px;
	font-size: 2.0rem;
	-webkit-transition: all 0.2s ease 0s;
	transition: all 0.2s ease 0s;
}

.benefit-box-list:hover h3 {
	color: #fff
}

.benefit-box-list p {
	margin-bottom: 32px;
	-webkit-transition: all 0.2s ease 0s;
	transition: all 0.2s ease 0s;
}

.benefit-box-list:hover p {
	color: #fff
}

.benefit-section-cta {
	margin: 32px 0;
}

.benefit-section-btn {
	width: 80%;
}

.benefit-section-btn a {
	background-color: #9b8d77;
	font-size: 12px;
	font-size: 1.2rem;
	color: #fff;
}

/* Case Section ============================================================= */

.eb-case-section {
	position: relative;
	padding: 86px 16px 54px 16px;
	border-top: 1px solid #e2e5e8;
	background-color: #f8f8f8;
	text-align: center;
}

.case-header {
	margin: 0 0 48px 0;
	padding: 0 16px;
}

.case-header h3 {
	position: relative;
	margin: 0 0 16px 0;
	font-size: 26px;
	font-size: 2.6rem;
	color: #000c15;
}

.case-header p {
	margin: 16px 0 32px 0;
	color: #303030;
}

.case-thumbnail {
	position: relative;
}

.case-thumbnail a {
	display: block;
}

.case-thumbnail img {
	width: 100%;
	height: auto;
	vertical-align: middle;
}

.case-post {
	padding: 8px 0;
}

.case-title a {
	display: block;
	color: #000c15;
}

.case-title {
	font-size: 16px;
	font-size: 1.6rem;
	font-weight: bold;
}

.case-section-cta {
	margin: 32px 0;
}

.case-section-btn {
	width: 80%;
}

.case-section-btn a {
	background-color: #9b8d77;
	font-size: 12px;
	font-size: 1.2rem;
	color: #fff;
}

/* Product section ========================================================== */

.eb-product-section {
	padding: 64px 0;
}

.product-message {
	position: absolute;
	top: 50%;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
	text-align: center;
	z-index: 300;
}

.product-content {
	margin: 0 16px;
}

.product-content h2 {
	margin: 16px 0;
	color: #fff;
	text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.4);
}

.product-content p {
	margin: 16px 0;
	color: #fff;
	text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.4);
}

.product-section-cta {
	margin-top: 32px;
}

.product-section-btn {
	position: relative;
	width: 80%;
}

.product-section-btn a {
	background-color: #9b8d77;
	color: #fff;
}

/* Front cta section ======================================================== */

.eb-front-cta-section {
	padding: 40px 0 72px 0;
	background-color: #161410;
}

.front-cta-header {
	margin: 32px 0 16px 0;
	text-align: center;
}

.front-cta-header h2 {
	font-size: 20px;
	font-size: 2.0rem;
	color: #fff;
}

.front-cta-header-single {
	margin: 32px 0 16px 0;
	text-align: center;
}

.front-cta-header-single h2, .front-cta-header-single .fa {
	font-size: 20px;
	font-size: 2.0rem;
	color: #fff;
}

.front-cta-header .fa {
	margin: 0 8px 0 0;
	font-size: 20px;
	font-size: 2.0rem;
	color: #fff;
}

.front-cta-content dl {
	position: relative;
	padding: 32px;
	border: 1px solid #e2e5e8;
	color: #fff;
	z-index: 300;
}

.front-cta-content dt {
	padding: 0 0 24px 0;
	font-weight: normal;
}

.front-cta-content dd {
	padding: 0;
	text-align: center;
}

.front-cta-tell {
	font-size: 20px;
	font-size: 2.0rem;
	font-weight: bold;
}

.front-cta-mail-btn {
	position: relative;
	width: 80%;
}

/* Price section ============================================================ */

.eb-price-section {
	position: relative;
	padding: 86px 0;
	border-top: 1px solid #e2e5e8;
	background-color: #f8f8f8;
}

.price-header {
	margin: 0 0 48px 0;
	text-align: center;
}

.price-header h2 {
	margin: 0 0 16px 0;
	font-size: 26px;
	font-size: 2.6rem;
}

.price-header p {
	margin: 16px 0 32px 0;
	font-size: 18px;
	font-size: 1.8rem;
}

.eb-price-section table {
	table-layout: fixed;
	border: none;
	text-align: center;
}

.eb-price-section table td {
	display: block;
	margin-bottom: 32px;
	padding: 0;
	border: 1px solid #e2e5e8;
	background-color: #fff;
	text-align: center;
	vertical-align: inherit;
}

.eb-price-section table td:hover {
	box-shadow: 0 10px 20px -5px rgba(0, 0, 0, 0.2);
	-webkit-transition: 0.2s ease-in-out;
	transition: 0.2s ease-in-out;
}

.price-item {
	padding: 16px;
	border-bottom: 1px solid #e2e5e8;
	background-color: #9b8d77;
	color: #fff;
	font-size: 18px;
	font-size: 1.8rem;
	font-weight: bold;
	color: #303030;
}

.price-selling {
	padding: 16px;
	border-bottom: 1px solid #e2e5e8;
	font-size: 16px;
	font-size: 1.6rem;
	font-weight: bold;
	color: #303030;
}

.price-description {
	padding: 16px;
	line-height: 2;
	font-size: 14px;
	font-size: 1.4rem;
}

.price-section-cta {
	margin: 32px 0;
}

.price-section-btn {
	position: relative;
	width: 80%;
}

.price-section-btn a {
	background-color: #9b8d77;
	font-size: 12px;
	font-size: 1.2rem;
	color: #fff;
}

.eb-price-section .bottom-arrow {
	background-color: #f8f8f8;
}

/* Category section ========================================================= */

.eb-category-section {
	padding: 86px 0;
	border-top: 1px solid #e2e5e8;
	background-color: #fff;
}

.category-img img {
	width: 100%;
	height: auto;
	vertical-align: bottom;
}

.category-header {
	margin: 0 0 48px 0;
	text-align: center;
}

.category-header p {
	margin: 16px 0 32px 0;
	color: #303030;
}

.category-body {
	display: -webkit-flex;
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	align-items: stretch;
}

.category-box {
	position: relative;
	margin: 0 0 32px 0;
	width: 100%;
	border-radius: 0 0 4px 4px;
	border: 1px solid #e2e5e8;
	box-sizing: border-box;
	background-color: #f4f4f4;
}

.category-box-list {
	overflow: hidden;
}

.category-box-header {
	position: relative;
	margin-bottom: 10rem;
}

.category-box-header h3 {
	padding: 24px 16px 16px 16px;
	text-align: center;
	font-size: 20px;
	font-size: 2.0rem;
}

.category-box-header h3:after {
	content: "";
	position: absolute;
	top: 58px;
	left: 0;
	right: 0;
	width: 32px;
	height: 2px;
	margin: 0 auto;
}

.category-box-header p {
	margin: 32px 0 16px 0;
	padding: 0 16px;
	font-size: 14px;
	font-size: 1.4rem;
}

.category-box:nth-child(3n+1) {
	margin: 0 0 32px 0;
}

.category-list li {
	padding: 0px 16px 8px 16px;
	font-size: 16px;
	font-size: 1.6rem;
}

.category-list li a:before {
	content: "-";
	display: inline-block;
	padding-right: 5px;
}

.category-list li a {
	display: block;
	font-weight: bold;
}

.category-box-footer {
	position: absolute;
	right: 0;
	bottom: 24px;
	left: 0;
	width: 100%;
}

.category-btn a {
	background-color: #9b8d77;
	font-size: 12px;
	font-size: 1.2rem;
	color: #fff;
}

/* Content section ========================================================== */

.home .content {
	border-top: 1px solid #e2e5e8;
}

/* Information section ====================================================== */

.eb-info-section {
	padding: 86px 0;
	border-top: 1px solid #e2e5e8;
	background-color: #f8f8f8;
}

.info-container {
	margin: 0 auto;
	width: 100%;
}

.info-header {
	margin: 0 0 32px 0;
	text-align: center;
}

.info-header p {
	margin: 16px 0;
	font-size: 18px;
	font-size: 1.8rem;
}

.info-container li {
	position: relative;
	border-bottom: 1px dotted #c6ccd1;
	line-height: 1.6;
	-webkit-transition: 0.4s ease-in-out;
	transition: 0.4s ease-in-out;
}

.info-container li:hover {
	background-color: #fff;
}

.info-meta {
	padding: 16px 0 0 0;
	font-size: 12px;
	font-size: 1.2rem;
}

.info-container h3 {
	display: inline;
	font-weight: normal;
}

.info-container h3 a {
	display: block;
	padding: 4px 0 15px 0;
	font-size: 16px;
	font-size: 1.6rem;
}

.info-section-btn {
	margin-top: 32px;
	width: 80%;
}

.info-section-btn a {
	background-color: #9b8d77;
	color: #fff;
	font-size: 12px;
	font-size: 1.2rem;
}

/* Accordion faq section ==================================================== */

.eb-accordion-faq-section {
	padding: 86px 0;
	border-top: 1px solid #e2e5e8;
	background-color: #fff;
}

.accordion-faq-container {
	position: relative;
	width: 100%;
	margin: 0 auto;
}

.accordion-faq-header {
	margin: 0 0 48px 0;
	text-align: center;
}

.accordion-faq-header h2 {
	margin: 0 0 16px 0;
	font-size: 26px;
	font-size: 2.6rem;
}

.accordion-faq-header p {
	margin: 16px 0 32px 0;
	font-size: 16px;
	font-size: 1.6rem;
}

.accordion-faq-content {
	text-align: left;
}

.accordion-faq-content dt {
	position: relative;
	padding: 4px 0 32px 40px;
	font-weight: normal;
	cursor: pointer;
}

.accordion-faq-content dd {
	position: relative;
	margin-bottom: 32px;
	padding: 4px 0 32px 40px;
	border-bottom: 1px solid #e2e5e8;
}

.accordion-faq-content dd a {
	color: #9b8d77;
	text-decoration: underline;
}

.accordion-faq-content dd a:hover {
	color: #b5b5b5;
	text-decoration: none;
}

.accordion-faq-content .question:before {
	display: inline-block;
	content: "Q";
	position: absolute;
	top: 0;
	left: 0;
	width: 32px;
	height: 32px;
	line-height: 32px;
	text-align: center;
	background: #9b8d77;
	color: #fff;
	border-radius: 50%;
	font-weight: normal;
}

.accordion-faq-content .answer:before {
	display: inline-block;
	content: "A";
	position: absolute;
	top: 0;
	left: 0;
	width: 32px;
	height: 32px;
	line-height: 32px;
	text-align: center;
	background: #232323;
	color: #fff;
	border-radius: 50%;
	font-weight: normal;
}

.faq-section-btn {
	width: 80%;
}

.faq-section-btn a {
	background-color: #9b8d77;
	color: #fff;
}

/* Contactfrom section ====================================================== */

.eb-contactfrom-section {
	padding: 86px 0;
	border-top: 1px solid #e2e5e8;
	text-align: center;
}

.contactfrom-header {
	margin-bottom: 32px;
}

.contactfrom-content p {
	margin-bottom: 32px;
}

.contactfrom-content .wpcf7 {
	margin: 32px 0;
	padding: 32px 16px;
	background-color: #fff;
}

.contactfrom-content input[type="text"], .contactfrom-content input[type="email"], .contactfrom-content input[type="url"], .contactfrom-content input[type="password"], .contactfrom-content input[type="search"], .contactfrom-content input[type="number"], .contactfrom-content input[type="tel"], .contactfrom-content input[type="range"], .contactfrom-content input[type="color"], .contactfrom-content input[type="time"], .contactfrom-content input[type="date"], .contactfrom-content input[type="datetime"], .contactfrom-content input[type="datetime-local"], .contactfrom-content input[type="week"], .contactfrom-content input[type="month"], .contactfrom-content select, .contactfrom-content textarea {
	margin: 8px 0 16px 0;
	width: 100%;
	background-color: #f8f8f8;
}

.contactfrom-content-btn a, .contactfrom-content input[type="submit"] {
	margin-top: 32px;
	background-color: #9b8d77;
	color: #fff;
}

.contactfrom-content .wpcf7-response-output {
	margin: 0 auto;
	margin-top: 32px;
	width: 95%;
}

.front-page-widget {
	background-color: #fff;
}

.front-page-widget h2 {
	padding: 32px 0;
	text-align: center;
}

/* Not Mobile */
@media screen and ( min-width: 768px) {
	.inner {
		padding: 0;
	}
	/* Newsticker section */
	.ticker-label a {
		padding: 4px 24px;
	}
	.ticker-label {
		margin-right: 16px;
	}
	.ticker-date {
		display: inline-block;
	}
	/* Solution section */
	.solution-box-list {
		float: left;
		width: 31.4%;
		margin: 0 2.6% 0 0;
	}
	/* Sales section */
	.sales-section-col {
		float: left;
		margin-left: 2.8%;
		width: 48.6%;
	}
	.sales-section-col:first-child {
		margin-left: 0;
	}
	.sales-section-box {
		padding: 0;
	}
	.sales-section-btn {
		width: 80%;
	}
	/* Case section */
	.eb-case-section {
		padding: 86px 0 54px 0;
	}
	.case-section-btn {
		width: 40%;
	}
	/* Price section */
	.eb-price-section table td {
		display: table-cell;
	}
	.price-section-btn {
		width: 40%;
	}
	/* Product section */
	.product-section {
		padding: 64px 0;
	}
	.product-section-btn {
		width: 50%;
	}
	/* Info section */
	.info-container {
		width: 752px;
	}
	.info-header {
		margin: 0 0 48px 0;
	}
	.info-header p {
		margin: 16px 0 32px 0;
	}
	.info-meta {
		display: inline;
		position: absolute;
		top: 50%;
		left: 0;
		padding: 0 0 0 8px;
		-webkit-transform: translateY(-50%);
		transform: translateY(-50%);
	}
	.info-container h3 {
		display: inline;
	}
	.info-container h3 a {
		display: block;
		padding: 16px 8px 16px 120px;
	}
	.info-section-btn {
		width: 40%;
	}
	/* Accordion faq section */
	.accordion-faq-container {
		width: 752px;
	}
	.faq-section-btn {
		width: 40%;
	}
	/* Front CTA section */
	.eb-front-cta-section {
		padding: 72px 0;
	}
	.front-cta-col6 {
		position: relative;
		width: 100%;
		margin-left: 0;
	}
	.front-cta-header {
		margin: 0 0 16px 0;
	}
	.front-cta-header h2, .front-cta-header .fa {
		font-size: 24px;
		font-size: 2.4rem;
	}
	.front-cta-single {
		width: 100%;
		margin: 0 auto;
	}
	.front-cta-header-single {
		margin: 0 0 16px 0;
	}
	.front-cta-header-single h2, .front-cta-header-single .fa {
		font-size: 24px;
		font-size: 2.4rem;
	}
	.front-cta-content-single {
		border: 1px solid #e2e5e8;
	}
	.cta-tel {
		margin-bottom: 0;
		padding-bottom: 0;
		border-bottom: none;
	}
	.front-cta-mail-btn {
		width: 80%;
	}
	/* Benefit section */
	.benefit-box-list {
		float: left;
		width: 31.4%;
		margin: 0 2.6% 32px 0;
	}
	.benefit-section-btn {
		width: 40%;
	}
	.benefit-box-icon img {
		width: 350px;
	}
	/* Category section */
	.category-box {
		float: left;
		width: 31.4%;
		margin: 0 2.6% 32px 0;
	}
	.category-list li {
		font-size: 14px;
		font-size: 1.4rem;
	}
	.category-btn {
		width: 80%;
	}
	/* Accordion faq section */
	.accordion-faq-content li {
		padding: 8px 0 32px 56px;
	}
	/* Contactfrom section */
	.contactfrom-content input[type="text"], .contactfrom-content input[type="email"], .contactfrom-content input[type="url"], .contactfrom-content input[type="number"], .contactfrom-content input[type="tel"], .contactfrom-content input[type="range"], .contactfrom-content input[type="color"], .contactfrom-content input[type="time"], .contactfrom-content input[type="date"], .contactfrom-content input[type="datetime"], .contactfrom-content input[type="datetime-local"], .contactfrom-content input[type="week"], .contactfrom-content input[type="month"], .contactfrom-content select, .contactfrom-content textarea {
		width: 70%;
	}
	.contactfrom-content .wpcf7 {
		margin: 32px;
		padding: 32px;
	}
	.front-cta-col6 {
		float: left;
		margin-left: 2.8%;
		width: 48.6%;
	}
	.front-cta-first {
		margin-left: 0;
	}
	.front-cta-single {
		width: 752px;
	}
}

/* Not Mobile */
@media screen and ( min-width: 992px) {
	/* Sales section */
	.sales-section-btn {
		width: 60%;
	}
	/* Case section */
	.case-section-btn {
		width: 20%;
	}
	/* Benefit section */
	.benefit-section-btn {
		width: 20%;
	}
	/* Product section */
	.product-section-btn {
		width: 12%;
	}
	/* Price section */
	.price-section-btn {
		width: 20%;
	}
	/* Front CTA section */
	.front-cta-mail-btn {
		width: 60%;
	}
	/* Info section */
	.info-container {
		width: 960px;
	}
	.info-section-btn {
		width: 20%;
	}
	/* Accordion faq section */
	.accordion-faq-container {
		width: 960px;
	}
	.faq-section-btn {
		width: 20%;
	}
}

/* home (Top) section ======================================================= */

.home .eb-solution-section {
	background-color: #cee2f5;
	position: relative;
	padding-bottom: 10px;
}

.home .eb-solution-section::after {
	content: '';
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 8px;
	background-image: repeating-linear-gradient(45deg, #add7ff 0px, #b0c9e0 1px, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 50%), repeating-linear-gradient(135deg, #388bda 0px, #94cbff 1px, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 50%);
	background-size: 8px 8px;
}

.home .solution-header h2 {
	position: relative;
	font-size: 26px;
	text-align: center;
	border-bottom: 5px solid #f6f6f6;
	color: #005884;
}

.solution-header h2::after {
	content: '';
	position: absolute;
	bottom: -5px;
	left: 50%;
	transform: translateX(-50%);
	width: 70px;
	height: 5px;
	background-color: #4ec9ea;
}

.home .solution-header p {
	text-align: left;
	line-height: 180%;
}

.home .solution-box-icon img {
	width: 100%;
	height: auto;
	border-radius: 10px 10px 0 0;
}

.home .solution-box-list h3 {
	color: #005a86;
}

.solution-box-list h3 {
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: 26px;
	text-align: center;
}

.solution-box-list {
	border-radius: 10px;
	background-color: white;
	text-align: left;
	padding: 15px;
	height: 470px;
}

.solution-box-list h3::before, .solution-box-list h3::after {
	content: '';
	width: 3px;
	height: 40px;
	background-color: #3fc1c9;
}

.solution-box-list h3::before {
	margin-right: 30px;
	transform: rotate(-35deg)
}

.solution-box-list h3::after {
	margin-left: 30px;
	transform: rotate(35deg)
}

.point {
	padding: 70px 0;
}

.point_title {
	position: relative;
	padding-top: 50px;
	padding-bottom: 50px;
	font-size: 3rem;
	text-align: center;
}

.point_title span {
	position: relative;
	z-index: 2;
}

.point_title::before {
	content: attr(data-en);
	position: absolute;
	top: -20px;
	left: 50%;
	transform: translateX(-50%);
	color: rgb(66 158 224 / 20%);
	font-size: 80px;
	font-style: italic;
}

.point_title::after {
	content: '';
	position: absolute;
	bottom: 0;
	left: 50%;
	transform: translate(-50%) rotate(30deg);
	width: 1px;
	height: 40px;
	background-color: rgb(57 140 219);
}

.point_list {
	position: relative;
	padding-left: 85px;
	font-weight: bold;
	font-size: 2.4rem;
	margin: 25px 0;
	font-family: 'Yusei Magic', sans-serif;
}

.point_list::before {
	content: attr(data-number);
	position: absolute;
	top: 50%;
	left: 0;
	transform: translateY(-50%);
	color: rgb(255 154 27 / 70%);
	font-size: 50px;
}

.point_list::after {
	content: '';
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100px;
	height: 1px;
	background-color: rgb(255 155 29);
}

.point .alignleft {
	margin: 15px;
}

.point figure {
	position: relative;
	float: right;
}

.point figure::after {
	content: '';
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: calc(100% - 20px);
	height: calc(100% - 20px);
	border-image-source: repeating-linear-gradient(45deg, #f8f8f8, #fff 3px, rgba(0 0 0 / 0) 0, rgba(0 0 0 / 0) 6px);
	border-image-slice: 20;
	border-image-repeat: round;
	border-style: solid;
	border-width: 15px;
}

.home .price-header h2 {
	font-size: 4rem;
}

span.tell-number {
	font-weight: bold;
}

body #gnav, .global-nav li ul li, .mb-horizontal-nav {
	background-color: rgb(232 232 232);
}

body #gnav .global-nav .current-menu-item>a {
	color: #e8ff2b;
}

body .slider .bx-viewport {
	width: 1280px;
	height: 640px;
	color:lightgray;
	border-top: solid 4px lightgray;
	border-bottom: solid 4px lightgray;
}
body .slider .bx-viewport h2 {
/*	color: #B00000;	*/
	left:5%;
	text-align: left;
	color: #ffffff;
	display: flex;
	align-items: center;
	justify-content: left;
	line-height: 1.2;
	font-size: 5rem;
	text-shadow:
/*	-0.75px -0.75px 0 white,
	 0.75px -0.75px 0 white,
	-0.75px  0.75px 0 white,
	 0.75px  0.75px 0 white,	*/
	5px 5px 5px rgba(0,0,0,0.7);
}
body .slider .bx-viewport .slider-message .slider-message-inner .slider-title {
	top: 0%;
	text-align: center;
	position: absolute;
	bottom: 0;
	width: 100%;
}

body .slider h2.slider-title::after {
	content: none;
}

/* Mobile */
@media screen and (max-width: 767px) {

	body .contents_1 .container h2, body .contents_2 .container h2, body .contents_3 .container h2, body .contents_4 .container h2, body .contents_5 .container h2 {
		position: relative;
		border-bottom: 5px solid #717171;
		margin: 0 0 1rem 0;
	}
	body .contents_1 .container h2::after, body .contents_2 .container h2::after, body .contents_3 .container h2::after, body .contents_4 .container h2::after, body .contents_5 .container h2::after {
		content: '';
		position: absolute;
		bottom: -5px;
		left: 50%;
		transform: translateX(-50%);
		width: 20%;
		height: 5px;
		background-color: #d40000;
	}


	body .contents_0 img{
		width: 150px;
		height: 150px;
		position: absolute;
		top: 35%;
		left: 65%;
		z-index:20;
	}
	body .slider .bx-viewport{
		color:lightgray;
		border-top: solid 4px lightgray;
		border-bottom: solid 4px lightgray;
	}
	body .slider .bx-viewport h2 {
	/*	color: #B00000;	*/
		left:2%;
		text-align: left;
		color: #ffffff;
		display: flex;
		align-items: center;
		justify-content: left;
		line-height: 1.2;
		font-size: 3rem;
		z-index: 50;
		text-shadow:
/*		-0.75px -0.75px 0 white,
		0.75px -0.75px 0 white,
		-0.75px  0.75px 0 white,
		0.75px  0.75px 0 white,	*/
		5px 5px 5px rgba(0,0,0,0.7);
	}
	body .slider .bx-viewport .slider-message .slider-message-inner .slider-title {
		top: 0%;
		text-align: center;
		position: absolute;
		bottom: 0;
	}
	body .slider h2.slider-title::after {
		content: none;
	}
}

body .slider #bxslider li {
	background-size: auto;
}

/*フェードインアニメ*/

/*左から右にフェードイン*/

.left-to-right {
	opacity: 0.1;
	transform: translateX(-20px);
	transition: all 1s;
}

.left-to-right.scrollin {
	opacity: 1;
	transform: translate(0);
}

/*下から上にフェードイン*/

.down-to-top {
	opacity: 0.1;
	transform: translateY(20px);
	transition: all 1s;
}

.down-to-top.scrollin {
	opacity: 1;
	transform: translateY(0);
}

body {
	background-color: #ffffff !important;
}

body .contents_1 .container, body .contents_2 .container, body .contents_3 .container, body .contents_4 .container, body .contents_5 .container {
	margin: 50px auto;
}

body h1 {
	margin: 0;
}

body .container h1 {
	margin: 0.5em 0em;
	text-align: center;
	font-size: 3.5rem;
}

body h2 {
	/* font-weight: normal; */
	/* font-family: 'Yusei Magic', sans-serif; */
	text-align: center;
	font-size: 3rem;
}

body .contents_1 .container h2, body .contents_2 .container h2, body .contents_3 .container h2, body .contents_4 .container h2, body .contents_5 .container h2 {
	position: relative;
	border-bottom: 5px solid #717171;
	margin: 0 0 1rem 0;
}

body .contents_1 .container h2::after, body .contents_2 .container h2::after, body .contents_3 .container h2::after, body .contents_4 .container h2::after, body .contents_5 .container h2::after {
	content: '';
	position: absolute;
	bottom: -5px;
	left: 50%;
	transform: translateX(-50%);
	width: 20%;
	height: 5px;
	background-color: #d40000;
}

body .btn a {
	display: inline-block;
}

/*東京・神奈川・千葉・埼玉で産業廃棄物処理・建築廃材回収業者をお探しならミライズへ！*/

span .tell-number {
	font: bold;
}

.contents_0 img{
	width: 400px;
	height: 400px;
	position: absolute;
	top: 43%;
	left: 56%;
}

.contents_1 {
	margin: auto;
}
.contents_1 h2 {
	font-size: 2.8rem;
}

/*業務内容・サービス紹介*/

.contents_2 {
	margin: auto;
}

.contents_2 .service_item {
	width: 47%;
	display: inline-grid;
	text-align: center;
	background-color: #ececec;
	margin: 10px 4px;
	padding: 10px;
}

.contents_2 .service_item h3 {
	background-color: #d40000;
	color: white;
	padding: 10px 0;
	line-height: 100%;
	margin: 0;
}

.contents_2 .service_item img {
	width: 100%;
	height: 150px;
	object-fit: cover;
	margin: 0 0 10px 0;
}

.contents_2 .service_item .btn {
	margin: 1rem auto 1rem auto;
}

.contents_2 .service_banner {
	text-align: center;
	background-color: #eaeaea;
	padding: 10px;
	margin: 2rem 0;
}

.contents_2 .service_banner .btn {
	margin: 2rem 0;
	display: inline-grid;
}

.contents_2 .service_banner span {
	background-color: #d40000;
	color: white;
	border-radius: 5px;
	padding: 3px 5px 0 10px;
	margin: 0 10px 0 0;
}

.contents_2 .service_banner section {
	width: 49%;
	display: inline-grid;
	text-align: center;
	margin: 10px 4px;
	padding: 10px;
	background-color: white;
}

/*回収の流れ*/

.contents_3 {
	margin: auto;
}

.contents_3 .flow {
	width: 31%;
	display: inline-grid;
	margin: 0 3% 30px 0;
}

.contents_3 .last {
	margin-right: 0;
}

.contents_3 .flow h3 {
	text-align: center;
	background-color: #d40000;
	color: white;
	padding: 5px 0;
	margin: 0 0 1rem 0;
}

/*対応エリア*/

.contents_4 {
	margin: auto;
}

/*産業廃棄物処理業者を選ぶ時のポイント*/

.contents_5 {
	margin: auto;
}

.contents_5 ul {
	padding: 2rem 0 0 0;
}

.contents_5 ul li {
	border-bottom: 1px #c1c1c1 solid;
	margin: 0 0 1rem 0;
	padding: 0 0 1rem 0;
}

body .eb-info-section {
	padding: 10px 0;
}

body .info-header {
	margin: 0;
}

body .eb-info-section h2 {
	border: none;
	font-size: 2.4rem;
}

body .eb-info-section h2::after {
	background: no-repeat;
}

#footerFloatingMenu {
	display: block;
	width: 100%;
	position: fixed;
	left: 0px;
	bottom: 0;
	z-index: 9999;
	text-align: center;
	background-color: rgb(0 0 0 / 76%);
	padding: 20px 0 20px 0;
	color: white;
}

#footerFloatingMenu img {
	float: left;
	width: 30px;
	margin: 0px 10px 0 0;
}

#footerFloatingMenu .wrap {
	width: 32%;
	margin: auto;
}

#footerFloatingMenu .tel {
	float: left;
}

#footerFloatingMenu .tel p {
	font-size: 3.6rem;
	line-height: 80%;
	display: flow-root;
}

#footerFloatingMenu .tel span {
	font-size: 1.4rem;
}

#footerFloatingMenu a {
	background-color: #d40000;
	color: white;
	padding: 15px 30px;
	font-size: 2rem;
	border-radius: 5px;
	display: inline-grid;
}

#footerFloatingMenu a:hover {}

/* Font Awesome */

.container .fa, .required, .widget-line a {
	color: #000c15;
	font-size: 1.2em;
}

.contents_5 ul li p {
	margin-left: 4rem;
	color: #334e43;
}

.btn {
	margin: 2rem auto;
}

/* Mobile */
@media screen and (max-width: 767px) {
	#top {
		overflow: hidden;
	}
	.header-logo img, .modal-header-logo img {
		max-width: 100%;
	}
	body h1 {
		margin: 0;
	}
	body h2 {
		font-size: 2.4rem;
	}
	body h3 {
		font-size: 1.8rem;
	}
	body .container h1 {
		margin: 0.3em 0em 0em;
		text-align: center;
		font-size: 1.5em;
	}
	body .contents_1 h2 {
		font-size: 2rem;
	}
	body .contents_1 .container, body .contents_2 .container, body .contents_3 .container, body .contents_4 .container, body .contents_5 .container {
		margin: 20px auto;
		padding: 15px;
	}
	.contents_2 .service_item {
		width: 100%;
		margin: 0 0 1rem 0;
	}
	.contents_2 .service_item p {
		font-size: 1.4rem;
		text-align: left;
	}
	.contents_3 .flow {
		width: 100%;
	}
	.eb-accordion-faq-section {
		padding: 20px 0;
	}
	.eb-case-section {
		padding: 20px 0 20px 0;
	}
	body .slider #bxslider li {
		background-size: contain;
		height: 180px;
	}
	body .slider .bx-viewport {
		background-size: auto;
	}
	body .slider .bx-viewport .slider-message .slider-message-inner .slider-title {
		top: 0%;
		text-align: center;
		position: absolute;
		bottom: 0;
		width: 100%;
	}
	body .slider h2.slider-title::after {
		content: none;
	}
	#mega-menu-wrap-global-nav #mega-menu-global-nav>li.mega-menu-megamenu>ul.mega-sub-menu>li.mega-menu-item, #mega-menu-wrap-global-nav #mega-menu-global-nav>li.mega-menu-megamenu>ul.mega-sub-menu li.mega-menu-column>ul.mega-sub-menu>li.mega-menu-item {
		padding: 0;
		width: 100%;
	}
	#mega-menu-wrap-global-nav #mega-menu-global-nav>li.mega-menu-megamenu>ul.mega-sub-menu>li.mega-menu-item>a.mega-menu-link, #mega-menu-wrap-global-nav #mega-menu-global-nav>li.mega-menu-megamenu>ul.mega-sub-menu li.mega-menu-column>ul.mega-sub-menu>li.mega-menu-item>a.mega-menu-link {
		padding: 10px 5px;
		text-align: left;
	}
	#mega-menu-wrap-global-nav #mega-menu-global-nav li.mega-menu-megamenu>ul.mega-sub-menu>li.mega-menu-row .mega-menu-column>ul.mega-sub-menu>li.mega-menu-item {
		padding: 0;
	}
	#mega-menu-wrap-global-nav #mega-menu-global-nav li.mega-menu-megamenu>ul.mega-sub-menu>li.mega-menu-row>ul.mega-sub-menu>li.mega-menu-column.mega-menu-clear {
		width: 100%;
	}
}

/* 問合せフォーム */
.required_icon{
	color: red;
}

@media (max-width: 767px) {
	input#zip,
	#zip2 {
		width:80%;
    }
}

/* スマホ版の問合せメール見積もりリンク */
.contactformNavLink_mb {
	margin-bottom: 10px;
}
.contactformNavLink_mb_sub {
	display: flex;
}

.contactformNavLink_mb a {
    background: #ffff;
    border-radius: 30px;
	border: solid 1px #006b35;
    position: relative;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    margin: 0 auto;
    color: #006b35;
    transition: 0.3s ease-in-out;
    font-weight: bold;
	padding: 5px;
	box-shadow: 0 3px 3px 0 rgba(0, 50, 25, 0.3);
}
.contactformNavLink_mb a:hover {
    background: #006b35;
    color: #ffff;
}
.contactformNavLink_mb a:after {
    content: '';
    width: 5px;
    height: 5px;
    border-top: 3px solid #006b35;
    border-right: 3px solid #006b35;
    transform: rotate(45deg) translateY(-50%);
    position: absolute;
    top: 50%;
    right: 20px;
    border-radius: 1px;
    transition: 0.3s ease-in-out;
}
.contactformNavLink_mb a:hover:after {
    border-color: #ffff;
}

/* 問合せフォームのボタン上部の文字列 */
.contactformNavLink_mb p {
	width: 60%;
	font-size: 13px;
    margin-bottom: 5px;
    color: #006b35;
    letter-spacing: 0.04rem;
    display: inline-block;
    position: relative;
}
.contactformNavLink_mb p:before,
.contactformNavLink_mb p:after {
    display: inline-block;
    position: absolute;
    top: 45%;
    width: 16px;
    height: 1px;
    border-radius: 5px;
    background-color: #006b35;
    content: "";
}
.contactformNavLink_mb p:before {
    left: -30px;
    -webkit-transform: rotate( 50deg );
    transform: rotate( 50deg );
}
.contactformNavLink_mb p:after {
    right: -30px;
    -webkit-transform: rotate( -50deg );
    transform: rotate( -50deg );
}
/**
	トップページ下部LINE追加 	
*/
.line_add_friends{
	display: flex;
	flex-direction: column;
	align-items:center;
}

.partner-widget-title span{
	background: linear-gradient(transparent 60%, #ffa04c 50%);
}

/**
	トップページ下部パートナーバナー 	
*/
.partner-widget {
  padding: 24px;
  background-color: #f9f9f9;
  border-radius: 10px;
  box-shadow: 0 4px 10px rgba(0,0,0,0.05);
  width: 100%;
  height: 100%;;
}

.partner-widget-title {
  font-size: 1.8rem;
  margin-bottom: 20px;
  text-align: center;
  color: #2c3e50;
  font-weight: bold;
  letter-spacing: 0.5px;
}

/* バナー画像 */
.banner-container {
  display: flex;
  gap: 16px;             /* バナー間の間隔 */
  flex-wrap: wrap;       /* 折り返し可能 */
  justify-content: center;
}

.banner-item {
  flex: 1 1 calc(50% - 16px); /* 横幅を2つ分に調整（gapを引く） */
  text-align: center;
  margin-bottom: 16px;        /* 縦の間隔 */
}

.banner-image {
  width: 100%;                /* 親要素に合わせて伸縮 */
  height: auto;
  display: block;
  border-radius: 6px;
  transition: transform 0.3s;
}

.banner-item:hover .banner-image {
  transform: scale(1.05);
}

/* === ヘッダーCTA === */
.header-tellItem-container{
	display: flex;
	flex-direction: row;
	gap: 10px;
}

.header-tellItem-container span{
	display: block;
	margin-top: 5px;
}
.tell-item{
	display: flex;
	flex-direction: column !important;
}
.tellIconContainer{
	width: 20px;
}
.tellIconContainer img{
	width: 100%;
}
/* === スマホ版ヘッダーCTAにアイコンを表示する === */
@media screen and (max-width: 767px) {
	.header-cta-btn-tell-icon:before,
	.header-cta-btn-page-icon:before,
	.header-cta-btn-LINE-icon:before,
	.header-cta-btn-mail-icon:before
	{
		content: '';/*何も入れない*/
		display: inline-block;
		width: 25px;/*画像の幅*/
		height: 25px;/*画像の高さ*/
		background-size: contain;
		vertical-align: middle;
		margin: 0 20px;
	}
	.header-cta-btn-tell-icon:before{
		background-image: url(https://miraiz-yokohama.com/wp-content/uploads/2025/10/tell_icon.png);
	}
	.header-cta-btn-page-icon:before{
		background-image: url(https://miraiz-yokohama.com/hp/wp-content/uploads/2025/10/page_icon.png);
	}
	.header-cta-btn-LINE-icon:before{
		background-image: url(https://miraiz-yokohama.com/wp-content/uploads/2025/10/LINE_icon.png);
	}
	.header-cta-btn-mail-icon:before{
		background-image: url(https://miraiz-yokohama.com/hp/wp-content/uploads/2025/10/mail_icon.png);
	}
}

/* =========================================
	ティッカー
   ========================================= */

/* 赤帯を少しリッチに：角丸＋内側ハイライト＋薄い内側影 */
.mir-ticker{
  overflow: hidden;
  position: relative;
  border-radius: 10px;
  background: linear-gradient(180deg, #e01616 0%, #c70000 100%);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.25),
    inset 0 -1px 0 rgba(0,0,0,.12),
    0 6px 18px rgba(0,0,0,.12);
  padding: 4px 8px; /* 上下に余白を少し追加 */
  margin-bottom: 10px;
}

/* スクロール列の見栄え調整：間隔・高さ・行揃え */
.mir-ticker__inner{
  display: flex;
  gap: 4.5rem;               
  min-height: 44px;          
  align-items: center;
  white-space: nowrap;
  will-change: transform;    
  padding: 10px 0;
  animation: none !important;
}

/* 各アイテムを“チップ”風に：半透明の白＋境界線＋丸み */
.mir-ticker__item{
  display: inline-flex;
  align-items: center;
  gap: .6rem;
  padding: .35rem .9rem;
  background: rgba(255,255,255,.14);
  border: 1px solid rgba(255,255,255,.28);
  border-radius: 999px;
  backdrop-filter: saturate(1.1);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.15);
  transition: transform .18s ease, box-shadow .18s ease, background-color .18s ease, filter .18s ease;
}

/* ラベルは少し落ち着いた白、価格は視認性を強く */
.mir-ticker__item .label{
  color: rgba(255,255,255);
  font-weight: 700;
  letter-spacing: .02em;
}
.mir-ticker__item .price{
  color: #111;                     /* 価格は濃い字色でコントラスト確保 */
  background: #fff;                /* 白いバッジ */
  padding: .22rem .6rem;
  border-radius: .5rem;
  line-height: 1;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
}

/* ホバー時：チップを少し持ち上げ、明るさを+ */
.mir-ticker:hover .mir-ticker__item{
  filter: brightness(1.05);
}

/* アイテム間に控えめな区切りを追加（疑似要素） */
.mir-ticker__item + .mir-ticker__item{
  position: relative;
}
.mir-ticker__item + .mir-ticker__item::before{
  content: "";
  position: absolute;
  left: -2.2rem; top: 50%;
  width: 6px; height: 6px;
  transform: translateY(-50%);
  border-radius: 50%;
  background: rgba(255,255,255,.6);   /* 小さな白丸 */
  box-shadow: 0 0 0 3px rgba(255,255,255,.15); /* 薄い外縁 */
}

/* 両端フェードの幅を少し広げて自然に */
.mir-ticker::before, .mir-ticker::after{
  width: 64px;
}

.mir-ticker{
  overflow: hidden;
  position: relative;
}

.mir-ticker__inner{
  display: flex;
  align-items: center;      /* 既存と合わせて明示 */
  gap: 4.5rem;              /* 既存値を維持 */
  white-space: nowrap;      /* 折り返さない ← 重要 */
  animation: mir-scroll var(--mir-dur, 40s) linear infinite; /* ← 重要 */
  will-change: transform;
  padding: 10px 0;          
}

/* モバイル最適化：密度を少し上げる */
@media (max-width: 600px){
  .mir-ticker__inner{ gap: 2.5rem; padding: 6px 0; }
  .mir-ticker__item{ padding: .28rem .7rem; }
  .mir-ticker__item .price{ padding: .18rem .5rem; }
}

/* =========================================
	アニメーション定義（右→左スクロール）
   ========================================= */
@keyframes mir-scroll {
	from {
		transform: translateX(0);  /* 初期位置（右端からスタート） */
	}

	to {
		transform: translateX(-50%);  /* 内容の半分だけ左へ移動（JSで2倍複製するため） */
	}
}

/* =========================================
 *  フロントページ 旧スライダー部分 
 * ========================================= */
#frontPage_topView_section{
	width: 100%;
	min-height: 350px;
}
#frontPage_topView_nonslider{
	display: flex;
	flex-direction: row;
	width: 100%;
	min-height: 250px;
	justify-content:space-evenly;
}

/* 写真枠ベース　*/
#frontPage_topView_currentImgContainer{
  width:55%;
  transition: 
    background-size .35s ease,
    background-position .35s ease,
    transform .35s ease,
    box-shadow .35s ease;
  will-change: background-size, background-position, transform;
  background-position: center;  /* 初期状態も指定しておくと安定 */
  background-size: cover;       /* 初期値が明示されるとチラつき防止 */
}

#frontPage_topView_currentImgContainer:hover{
  background-size: 104%;            /* ほんのり寄り */
  background-position: center 45%;  /* 僅かに上方向にパン（数値は好みで） */
  transform: translateY(-2px);
  box-shadow: 0 12px 28px rgba(0,0,0,.18);
}

#frontPage_topView_currentImgContainer:hover::after{
  opacity: 1;
}

#frontPage_btnItemContainer{
  display:flex;
  flex-direction:column;
  gap:12px; 
  justify-content:space-evenly;
  width:40%;
}

/* ---- ボタンの共通スタイル ---- */
.frontPage_btnItem{
  position:relative;
  display:flex;
  justify-content:flex-start;     
  align-items:center;
  border-radius:10px;             /* 丸みを少し強めに */
  background:#fff;
  border:1px solid #e5e7eb;       /* 薄い枠 */
  box-shadow:
    0 1px 0 rgba(0,0,0,.04),      /* うっすら段差 */
    0 4px 10px rgba(0,0,0,.05);   /* ソフトな影 */
  transition: transform .12s ease, box-shadow .12s ease, background-color .12s ease, border-color .12s ease;
  cursor:pointer;
  min-height:64px;                /* 高さをパーセントで固定しない */
  user-select:none;
}

.frontPage_btnItem::after{
  /* 上に入る光沢のハイライト（さりげなく） */
  content:"";
  position:absolute; inset:0;
  border-radius:inherit;
  background: linear-gradient(to bottom, rgba(255,255,255,.35), rgba(255,255,255,0));
  pointer-events:none;
}

.frontPage_btnItem:hover{
  transform: translateY(-1px);
  box-shadow:
    0 2px 0 rgba(0,0,0,.04),
    0 8px 20px rgba(0,0,0,.10);
}

.frontPage_btnItem:active{
  transform: translateY(0);
  box-shadow:
    0 1px 0 rgba(0,0,0,.04),
    0 4px 12px rgba(0,0,0,.08);
}

/* 全面リンク用 <a> */
.frontPage_btnItem a{
  position:absolute; inset:0;
  z-index:2;
  width:100%; height:100%;
  border-radius:inherit;
}

/* キーボード操作のフォーカスリング（アクセシビリティ） */
.frontPage_btnItem a:focus-visible{
  outline: none;
  box-shadow:
    0 0 0 3px rgba(59,130,246,.45),  /* ブルーの外側リング */
    0 1px 0 rgba(0,0,0,.04),
    0 6px 16px rgba(0,0,0,.10);
}

/* ラベル文字 */
.frontPage_btnItem span{
  position:relative; z-index:1;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  color:#111;                 /* デフォは濃いめ */
  font-size:18px;
  font-weight:700;
  padding:14px 22px;
  text-align:center;
  line-height:1.2;
}

/* ---- 個別カラー（既存色を活かして“ボタン化”） ---- */

/* ケイカル歓迎*/
.frontPage_btnItem.welcomeKeicalBtn{
  background: rgb(55,129,165);
  border-color: rgba(55,129,165,.9);
  box-shadow:
    0 1px 0 rgba(0,0,0,.04),
    0 6px 16px rgba(55,129,165,.25);
  justify-content:center;
}
.frontPage_btnItem.welcomeKeicalBtn span{ color:#fff; }
.frontPage_btnItem.welcomeKeicalBtn:hover{
  background: rgb(45,118,151);
  border-color: rgba(45,118,151,1);
}

/* 2) 料金表（枠線→ホバーで塗り） */
.pricePageBtn{ border:2px solid rgb(55,129,165); }
.frontPage_btnItem.pricePageBtn:hover{
  background: rgb(55,129,165);
  border-color: rgb(55,129,165);
}
.frontPage_btnItem.pricePageBtn:hover .pricePageBtn_span{ color:#fff; }

/* 3) メール */
.mailBtn{ border:2px solid rgb(239,48,60); }
.frontPage_btnItem.mailBtn:hover{
  background: rgb(239,48,60);
  border-color: rgb(239,48,60);
}
.frontPage_btnItem.mailBtn:hover .mailBtn_span{ color:#fff; }

/* 4) LINE */
.lineBtn{ border:2px solid #06c755; }
.frontPage_btnItem.lineBtn:hover{
  background: #06c755;
  border-color: #06c755;
}
.frontPage_btnItem.lineBtn:hover .lineBtn_span{ color:#fff; }

/* 共通：ホバー時は必ず白文字に（塗りつぶし系の保険） */
.frontPage_btnItem:hover span,
.frontPage_btnItem a:hover + span,
.frontPage_btnItem span:hover{
  color:#fff;
}

/* アイコンの余白・サイズを微調整 */
.pricePageBtn_span:before,
.lineBtn_span:before,
.mailBtn_span:before{
  content:"";
  display:inline-block;
  width:26px; height:26px;
  background-size:contain; background-repeat:no-repeat;
  vertical-align:middle;
  margin: 0 12px 0 4px;
}

.pricePageBtn_span:before{
  background-image:url(https://miraiz-yokohama.com/wp-content/uploads/2025/10/page_icon-1.png); 
}
.frontPage_btnItem.pricePageBtn:hover .pricePageBtn_span::before {
  background-image: url(https://miraiz-yokohama.com/wp-content/uploads/2025/10/page_icon_white.png);
}

.mailBtn_span:before{
  background-image:url(https://miraiz-yokohama.com/wp-content/uploads/2025/10/mail_icon-1.png); 
}
.frontPage_btnItem.mailBtn:hover .mailBtn_span::before {
  background-image: url(https://miraiz-yokohama.com/wp-content/uploads/2025/10/mail_icon_white.png);
}
.lineBtn_span:before{
  background-image:url(https://miraiz-yokohama.com/wp-content/uploads/2025/10/LINE_icon.png);
}
.frontPage_btnItem.lineBtn:hover .lineBtn_span::before {
  background-image: url(https://miraiz-yokohama.com/wp-content/uploads/2025/10/LINE_icon_white.png);
}

#frontPage_topView_slider{
	margin-top: 10px;
	position: relative;
	width: 100%;
	overflow: hidden;
}
.swiper{
	position: relative;
}
/* Swiper内部の構造を正しく制御 */
#frontPage_topView_slider .swiper-wrapper {
  width: 100%;
  box-sizing: border-box;
}
/* 各スライドは自動幅に任せる（Swiperが内部計算する） */
#frontPage_topView_slider .swiper-slide {
  display: flex;
  justify-content: center;
  align-items: center;
  overflow: hidden;
  opacity: .3; /* 左右のスライドを薄くする */
  transform: scale(.8); /* 左右のスライドを小さくする */
}
#frontPage_topView_slider .swiper-slide img {
  height: auto;
  width: 100%;
}
#frontPage_topView_slider .swiper-slide-active {
  opacity: 1; /* 中央のスライドは薄くしない */
  transform: scale(1); /* 中央のスライドは小さくしない */
  z-index: 1; /* 中央のスライドを一番上にする */
}
#frontPage_topView_slider .slider-btn {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 20px;
  height: 100%;
  background-color: #313131;
  cursor: pointer;
  z-index: 10;
  transition: background 0.3s;
  margin: 0;
  border-radius: 10px;
}
#frontPage_topView_slider .slider-btn:hover {
  background: rgba(255,255,255,1);
  border: solid 2px #313131;
}
/* 左右位置 */
.prev-btn { left: 10px; }
.next-btn { right: 10px; }
/* 擬似要素で矢印を作成 */
.slider-btn::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 8px;
  height: 8px;
  border-top: 2px solid #ffffff;
  border-right: 2px solid #ffffff;
  transform: translate(-50%, -50%);
}
/* 左矢印（＜） */
.prev-btn::before {
  transform: translate(-50%, -50%) rotate(-135deg);
}
/* 右矢印（＞） */
.next-btn::before {
  transform: translate(-50%, -50%) rotate(45deg);
}
/* ホバー時に矢印の色を反転 */
.slider-btn:hover::before {
  border-top-color: #313131;   /* ボタン背景色に合わせて反転 */
  border-right-color: #313131;
}
@media screen and (max-width: 767px) {
	#frontPage_topView_currentImgContainer{
		width: 100%;
	}
	#frontPage_btnItemContainer{
		display:none;
	}
	#frontPage_topView_nonslider{
		min-height:200px;
	}
	#frontPage_topView_section {
		min-height:280px;
	}
}

/* ========================
	固定フッター
   ======================== */
.fixed-footer {
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100%;
  background: #313131;
  color: #fff;
  z-index: 9999;
  box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.2);
  font-size: 16px;
  line-height: 1.6;
  padding: 5px 5px;
	transform: translateY(100%);
	opacity: 0;
	transition: all 0.6s ease;
}

.fixed-footer.show{
	transform: translateY(0);
	opacity: 1;
}

.footer-inner.axis {
  display: grid;
  grid-template-columns: max-content max-content max-content;
  justify-content: center;
  align-items: center;
  gap: 0 20px;
}

/* 左右ブロック配置 */
.ff-left {
  grid-column: 1;
  grid-row: 2;
  text-align: center;
}
.ff-center {
  grid-column: 2;
  grid-row: 2;
  text-align: center;
}
.ff-label {
  white-space: nowrap;
  line-height: 1.;
  font-size: 16px;
}
.ff-number {
  white-space: nowrap;
  font-size: 20px;
}

.ff-tell-number-container{
	display:flex;
	flex-direction:row;
	align-items:center;
	gap:10px;
}

.ff-right {
  grid-row: 1 / span 2;
  display: inline-block;
  padding: 16px 10px;
  border-radius: 5px;
  font-weight: bold;
  white-space: nowrap;
}
.ff-right a {
  display: inline-block;
  padding: 16px 10px;
  border-radius: 5px;
  font-weight: bold;
  text-decoration: none;
  white-space: nowrap;
  margin: 5px;
}

.ff-right a:hover{
  transform: translateY(-2px);
  box-shadow: 0 6px 14px rgba(0,0,0,.35);
  filter: brightness(1.05);
  color:#fff;
}

.btn-contract {
  background: #3781a5;
  color: #fff;
}
.btn-line {
  background: #06c755;
  color: #fff;
}
.btn-mail {
  background: #ef303c;
  color: #fff;
}

/* 電話リンク */
.tel-link {
  color: #fff;
  font-weight: bold;
  text-decoration: none;
}

/* 受付時間（全幅） */
.ff-cta {
  grid-column: 1 / span 2;
  grid-row: 1;
  text-align: center;
  font-size: 14px;
  font-weight: bold;
  margin-top: 6px;
}
.time {
  font-size: 16px;
  white-space: nowrap;
}

/* 最上部へ戻るボタン */
.scroll-top-btn {
  position: absolute;
  right: 16px;
  top: 50%;
  transform: translateY(-50%);
  z-index: 10000;

  background: #555;
  color: #fff;
  border: none;
  border-radius: 50%;
  width: 45px;
  height: 45px;
  font-size: 20px;
  cursor: pointer;
  transition: all .3s ease;
  box-shadow: 0 3px 6px rgba(0,0,0,.3);
}
.scroll-top-btn:hover {
  background: #777;
  transform: translateY(-50%) translateY(-2px);
}

/* レイアウト調整：右端に固定 */
.fixed-footer .footer-inner.axis {
  grid-template-columns: max-content max-content max-content auto; 
}
.scroll-top-btn {
  justify-self: end;
  margin-right: 20px;
}

/* モバイル対応*/
@media (max-width: 768px) {
	.fixed-footer{
		display:none;
	}
  .footer-inner.axis {
    grid-template-columns: 1fr;
    grid-template-rows: auto auto auto auto;
    row-gap: 6px;
  }
  .ff-left,
  .ff-center,
  .ff-right,
  .ff-cta {
    grid-column: 1;
    grid-row: auto;
    text-align: center;
  }
  .ff-right {
    flex-direction: row;
    justify-content: center;
  }
}

/* コンテンツが隠れないように */
body {
  padding-bottom: 100px;
}

/* 証明書ページ */
.pdf-grid {
  display: grid;
  grid-template-columns: repeat( auto-fill, minmax(180px, 1fr) );
  gap: 16px;
}
.pdf-grid__item {
  display: flex;
  flex-direction: column;
  text-align: center;
  align-items: center;
}
.pdf-grid__link {
  display: block;
  width: 100%;
  aspect-ratio: 4 / 3;
  overflow: hidden;
  border: 1px solid #eee;
  border-radius: 10px;
}
.pdf-grid__thumb, .pdf-grid__fallback {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}
.pdf-grid__caption {
  margin-top: 8px;
  font-size: .92rem;
  line-height: 1.4;
  word-break: keep-all;
}
.pdf-grid__link:hover { 
  box-shadow: 0 4px 12px rgba(0,0,0,.08);
  transform: translateY(-2px);
  transition: .2s;
}
/*----------------------------------------
 料金表・単価表PDF
----------------------------------------*/
p.pdf-link {
  display: flex;
  align-items: center;
  gap: 6px;
  margin: 8px 0;
}

p.pdf-link img.pdf-icon {
  width: 32px;
  height: 32px;
  vertical-align: middle;
}

p.pdf-link a {
  color: #06c; 
  text-decoration: underline;
  transition: opacity 0.2s ease;
}

p.pdf-link a:hover {
  opacity: 0.8;
}

/*----------------------------------------
 料金表・単価表ページ　電子決済可能ブランド一覧
----------------------------------------*/
#cashlessPayment-section{
    display: flex;
    flex-direction: column;
    width: 100%;
	margin-top: 0;
    justify-content:space-around;
    gap:5px
}

.payment-block{
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    width: 100%;
}

.payment-blok_title{
    display: flex;
    justify-content: flex-start;
    align-items: center;
    background-color: rgba(58, 58, 58, 1);
    color: #ffff;
    padding: 5px;
    text-align: center;
	margin-top: 15px;
}

.payment-blok_title p{
    font-weight: bold;
}

.payment-block .brandLogos_block{
    display: flex;
    flex-direction: row;
}

/* === 保有車両ページ === */
.carCards_container {
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
}

.car_l-wrapper {
    margin: 1rem auto;
    width: 47%;
    list-style: none;
}

.car_l-wrapper:hover {
    transform: translateY(-3px);
    box-shadow: 0 7px 14px rgba(50, 50, 93, .1), 0 3px 6px rgba(0, 0, 0, .08);
    transition: all .5s;
}

.card {
    background-color: #fff;
    box-shadow: 0 0 8px rgba(0, 0, 0, .16);
    color: #212121;
    text-decoration: none;
}

.car_card__header {
    display: flex;
    flex-wrap: wrap;
}

.car_card__title {
    padding: 1rem 1.5rem 0;
    font-size: 2rem;
    order: 1;
    margin-bottom: 0.6rem;
    font-weight: bold;
    text-decoration: none;
}

.car_card__thumbnail {
    margin: 0;
    order: 0;
}

.car_card__image {
    width: 100%;
}

.car_card__body {
    padding: 0 1.5rem;
}

.car_card__text2 {
    margin-top: 0;
    margin-bottom: 2rem;
}

.car_card__text+.car_card__text {
    margin-top: .5rem;
}
/* サービス動画 */
.service-video-section {
	display: flex;
	gap: 40px;
	margin: 80px auto;
	max-width: 1100px;
}

.service-video {
	flex: 1;
	text-align: center;
}

.service-video video {
	width: 100%;
	border-radius: 8px;
}

@media screen and (max-width: 767px) {
	.service-video-section {
		flex-direction: column;
	}
}
/* 電子マニフェスト */
.dots {
    background-image: radial-gradient(circle at center, orange 20%, transparent 20%);
    background-position: top right;
    background-repeat: repeat-x;
    background-size: 1em 0.3em;
    padding-top: .4em;
  }

  .contact_tool_container {
    display: flex;
    flex-direction: row;
    background-color: #f5f5f5;
    padding: 30px 10px;
  }

  .contact_tool_item {
    width: 50%;
    text-align: center;
    padding: 0 20px;
  }

@media screen and (max-width: 767px) {
	.sp_none_img {
		display: none;
	}
	
	.contact_tool_container{
		flex-direction: column;
		gap: 15px;
	}
	
	.contact_tool_item{
		width: 100%;
	}
}/* 動画 */
#intro-video {
  position: fixed;
  top: 0;
  left: 0;
  background: rgba(0,0,0,0.8);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 9999;
	transition: opacity 1s ease;
	background: #fff;
	opacity: 1;
	transition: opacity 0.5s ease;
}

#intro-video video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  pointer-events: none;
	opacity: 0;
  transition: opacity 0.3s ease;
}

#opening_close-btn {
  position: absolute;
  top: 20px;
  right: 20px;
  width: 40px;
  height: 40px;
  font-size: 28px;
  color: #fff;
  background: rgba(0,0,0,0.5);
  border: none;
  border-radius: 20%;
  cursor: pointer;
  z-index: 10000;
}