/*Responsive*/
	.engine-noPC{display: none;}
	.engine-noPCi{display: none;}
	.engine-noSP{display: block;}
	.engine-noSPi{display: inline;}

@media(max-width: 768px){

	img{max-width:100%; height:auto;}
	iframe{max-width:100%;}
	
	.engine-table{width: auto;}
	.engine-noPC{display: block;}
	.engine-noPCi{display: inline-block;}
	.engine-noSP{display: none;}
	.engine-noSPi{display: none;}

	.e-w980{width: 96%; margin-left: auto; margin-right: auto;}
	.e-w75{width: 90%; margin-left: auto; margin-right: auto;}
	.e-w25{width: 90%;}
	.e-w64{width: 90%;}
	
	.FR{float: none;}
	
	.spmenu{display: block; padding: 16px;}
	.spmenu em{display: inline-block; vertical-align: top; margin-left: 8px;}
	.spmenu em a{color: #333; text-decoration: none;}
	/*///////////////////*/
/*2021*/
.engine-single-spec-eGX .engine-table tr th, .engine-single-spec-eGX .engine-table tr td{white-space:normal}
.engine-menus {
	overflow-y: scroll;
	max-height: 100vh;
	}
.engines-menu {
	display: flex;
	flex-direction: column-reverse;
	}
  .engines-menu ul li i.fa{
    display: none;
  }
.engines-menu ul {
  display: none;
}
	.engines-menu.active ul {
		display: block;
    margin-left: 16px;
	}
	.engines-menu.active ul div{
    padding: 8px 0;
  }
	
.engines-menu ul li {
padding: 16px 0;
	border-bottom: 1px solid #eee;
	align-items: flex-start;
}
	.engines-menu ul li.engine-noSP{display: none;}
.engines-menu ul ul{
 display: block;
	position: static;
  margin: 0 auto;
	box-shadow: none;
}
.engines-menu ul li:hover ul{
	display: block;
}
.engines-menu ul ul li:last-of-type{
border: 0;}
.engines-menu ul ul li:hover{
	background: #f0f0f0;
}
.engines-menu ul ul li a{
	padding:8px 8px;
}
	

	
	/* ---------engine common header----------- */
.engine-common-header{ display: none; padding: 0 0 8px;}
.engine-common-header .e-w980 h1{ display: block; width: 100%; text-align: center;}
.engine-common-header .e-w980  h1 a{display: table; width: auto; margin: auto}
.engine-common-header h1 span{ display: table-cell; padding: 0 8px 0 0;}
.engine-common-header h1 strong{ display: table-cell;}
	
.engine-header-banners{ display: none;}
.engine-header-banners ul{display: flex; justify-content: space-between; flex-wrap: wrap;}
.engine-header-banners li{ flex: 0 0 49.5%; line-height: 1.1; margin-bottom: 8px; }
/* ---------engine banners---------- */
.engine-banners{ padding: 24px 16px;}
.engine-banners .engine-header-banners{ display: block; text-align: center; padding: 8px;}
.engine-banners .engine-header-banners li{ flex: 0 0 100%; margin-bottom: 16px;}

/* ---------engine menu---------- */
.engine-menus{ }
.engine-menus .e-w980{ display: block; width: 100%;}
.engine-menu{ display: flex; flex-wrap: wrap; flex: none; justify-content: space-between;padding: 0 0; height: auto; border: 0; border-bottom: 1px solid #a9a6a3;border-top: 1px solid #a9a6a3; width: 100%;}
.engine-menu li{ border-right: 1px solid #a9a6a3; padding:0 0; flex: auto; text-align: center;}
.engine-menu li:last-child{border: 0;}
.engine-menu li a{display: block; height: 100%; padding: 8px;}
.engine-menu li span{font-size: 0.8em; display: none;}
.engine-menu-lineup{flex:none; border-left: 0;  border-right: 0; padding: 0 0;}
.engine-menu-lineup p{text-align: center; background: none; font-weight: bold; font-size: 1.2em; height: auto; line-height: 1.1; height: 100%;}
	.engine-menu-lineup p a{display: block; padding: 8px 0;}
	
	.engine-crumbs,
	.engine-crumbs p{display: none;}
	
	.e-Flex{display: block; justify-content: space-between;}
.e-Flex-Rev{flex-direction: row-reverse;}
.e-Flex .e-w75{ width: auto; flex: none;}
.e-Flex .e-w25{ width: auto; flex: none;}
	
	.engine-search-top{ flex: none; margin-bottom: 16px;}
	.engine-search-top h2{ border-radius: 4px;}
	.engine-search-top #engine-search form{display: none;}
	.engine-search-top.show #engine-search form{display: block;}
	.engine-search-top.show h2{ border-radius: 4px 4px 0 0;}
	
	.engine-search .engine-search-items { display: flex; flex-wrap: wrap; justify-content: flex-start; }
 .engine-search .engine-search-item{ padding: 0 24px 16px 0; flex: 0 0 100%; }
	.engine-search .engine-search-item select{width: 100%;}
	.engine-search .engine-search-item-checks{width: 100%; flex: auto}
	
	/**/
	.engine-listing-3 .engine-box{flex: none; width: 100%; text-align: center;}
	
	
.engine-listing-3{}
.engine-listing-4 .engine-box{ flex: 0 1 49%;}
x.engine-box{ border: 1px solid #eee; margin: 0 0 40px 0; padding: 16px; position: relative;}
.engine-box .thums{ display: block; text-align: center;}
	.engine-box h2{font-size: 1em;}
	.engine-box ul{text-align: left; }
	.engine-box li{ min-width: 40%;}
	.engine-nonbox{flex: none; width: 100%; text-align: center; padding: 0 0 40px;}

	.engine-box ul.engine-series-items{height: auto;position: static; padding: 0; background: none;}
	
	.engine-listing-small .engine-box{display: table; flex-wrap: wrap; align-items: center;} 	
	.engine-listing-small .engine-box .thums{  flex: none; display: table-cell; width: 50px; padding: 0 2px; max-width: 50px;}
	.engine-listing-small .engine-box h1{font-size: 1.2em; padding: 0 8px; flex: none;display: table-cell; width: 85%; min-width: 160px;}
	.engine-listing-small .series_batch {flex:none;display: table-cell; width: 60px;}
	.engine-listing-small .deg360_batch{position: absolute; right: 1px; top: 1px;}
	.engine-listing-small .engine-box-single ul {display: none;}
	.engine-listing-small .engine-box-single p{width: auto; text-align: right; flex: 0 0 100%; display: none;} 	
	.engine-listing-small .engine-box-single p a{ background: none; color: #333;}	
	
	.engine-listing-small .engine-box-blank{display: none;}
	
	.engine-listing-icon li{margin-bottom: 4px;}
	.engine-listing-view{text-align: center;}
	.engine-listing-view li{font-size: 0.85em;}
	
	.engine-series-items li a{text-decoration: none; display: block; padding: 8px 8px; border: 1px solid #ddd; margin-bottom: 4px; text-align: center;}
	
	.engine-contact{}
.engine-contact h1{}
.engine-contact h2{}
.engine-contact h2 a{padding: 8px 16px; font-size: 1.6em; }
	
	.engine-contact .e-w64{width: 98%;}
	.engine-contact-container .e-w75{width: 96%;}
	.engine-form-block{ padding: 8px; display: block;}
.engine-form-block:nth-child(odd){background: #fcfcfc;}
.engine-form-q{ display: block; width: auto; padding: 0 0 8px;}
.engine-form-a{ display: block; padding-left: 0;}

	
	.engine-contents{padding: 0;}
	
/* ---------engine series---------- */
.engine-series-main{ padding: 0 0 24px; }
	
.engine-series-main .e-w980{display: flex; height: auto; flex-direction: column-reverse;}
.engine-series-main-img{ text-align: center; position: relative; flex:none; line-height: 0; border-bottom: 1px solid #fff;}
.engine-series-main-img-r{}
.engine-series-main-img img{  }
.engine-series-main-txt { flex:none; padding-bottom: 1em;}
.engine-series-main-txt-r{}
.engine-series-main-txt h1{ font-size: 40px; font-weight: 600;line-height: 1.2; padding: 16px 0;}
.engine-series-main-txt h1 span{ font-size: 20px; display: inline;}
.engine-series-main-txt h2{ text-align: left; font-size: 18px;}
.engine-series-main-txt p{}
	
.engine-series-container{ margin: 0 0 16px;}
.engine-series-features{}
.engine-series-features ul{ font-size: 1.2em; margin: 0 0 0 0; display: flex; flex-wrap: wrap; justify-content: space-between;}
.engine-series-features li{ width: 100%; padding: 0 0 24px; flex: 0 0 100%;}
.engine-series-features li span{ display: block; padding-right: 0; font-weight: 600;;}
.engine-series-features li span+em{ display: block; padding-left: 1.5em;}
.engine-series-features li.e-w100{width: 100%; flex: none; flex: 0 0 100%;}
	
	.engine-single-container{margin: 0 0 40px;}
  .engine-single-features{padding:0 4%;}
	.engine-single-features li{width: auto; flex: none;}
	
	
 
 .e-LocalNavi li{ margin: 0; font-size: 0.9em;}
 .e-LocalNavi li:last-child{margin-left: 16px;}
 
table.stores-box{ width: 100%;}
 .stores-box thead{display: none;}
table.stores-box tr{ display: flex; flex-wrap: wrap; border-bottom: 1px solid #ccc; padding: 8px 0;}
table.stores-box th{ font-size: 10px; padding: 4px; flex: 1 1 auto; text-align: center;}
table.stores-box td{ border: 0; flex: 0 0 auto; padding: 1px 4px; font-size: 12px; line-height: 2}
 table.stores-box td.s_add{flex: 0 0 100%;}
 table.stores-box td.s_addxxx br{ display: none;}
 table.stores-box td.s_tel br{ display: none;}
 table.stores-box td.s_tel{ flex: 0 0 100%;}
 .fa-fax{margin-left: 16px;}
 .s_time::before{content: "営業時間 : ";} 
 .s_holiday::before{content: "　休業日 : ";} 
 table.stores-box td a{text-decoration: underline;}
	table.stores-box td.s_pref,
table.stores-box td.s_name{font-weight: 
 bold;}
 
	/*features*/
.engine-features-container{ margin: 0 0 10px; word-break: break-all; }
.engine-features .engine-h1{ font-size: 1.2em; font-weight: 500;}
.engine-features ul{ font-size: 1.2em; margin: 0 0 1.5em 0; display: flex; flex-wrap: wrap; justify-content: space-between;}
.engine-features li{ display: block; width: auto; padding: 0 0 24px; flex: 0 0 50%;}
.engine-features p{font-size: 1.1em; margin-bottom: 1em;}
.engine-features-flexbox{display: block; justify-content:space-between; }
.engine-features-flexbox_rev{ flex-direction: row-reverse; }
.engine-features-flex{ padding: 0 8px; }
.engine-features-flex9{ flex: 0 0 100%;}
.engine-features-flex8{ flex: 0 0 100%;}
.engine-features-flex7{ flex: 0 0 100%;}
.engine-features-flex6{ flex: 0 0 100%;}
.engine-features-flex5{ flex: 0 0 100%;}
.engine-features-flex4{ flex: 0 0 100%;}
.engine-features-flex3{ flex: 0 0 100%;}
.engine-features-flex2{ flex: 0 0 100%;}
.engine-features-flex2{ flex: 0 0 100%;}
	
	.engine-pager-prevnext{ padding: 40px 0 24px; margin-bottom: 16px;}
	.engine-pager-prevnext li{ margin-bottom: 16px;}
	.engine-features-table{}
.engine-features-table em{ display: block; vertical-align: top; padding-right: 16px; white-space: nowrap;}
.engine-features-table span{ display: block; vertical-align: top; word-break: break-all;}

	
.menseki{height: 50vh;}
	
/* ---------engine single---------- */
.engine-single-main{ padding:40px 0  24px 0; }
.engine-single-main .e-w980{ flex-wrap: wrap; justify-content: space-around;}
.engine-single-main .e-w980 div{ flex: 0 0 100%; padding: 8px;}
.engine-single-main h1{ font-size: 30px; ;}
.engine-single-main ul{  padding: 8px 0;}
.engine-single-main ul li{}
.engine-single-main ul li.icon-deg360_batch{ }
.engine-single-main ul li.icon-deg360_batch img{width: 60px;}
.engine-single-main p.engin-image{ flex: 0 0 100%;text-align: center; padding: 8px; }
.engine-single-main p.engin-graph{ flex: 0 0 100%; }
.engine-single-main p.engin-graph i{position: absolute; right: 8px; bottom: 8px;}

.engine-single-main::after{content: ""; background:url(/engines/images/common/bg_giza_b_s.gif) top; position: absolute; width: 100%; height: 5px; bottom: 0; left: 0; z-index: 2;}

	.engine-table th{ padding: 8px 8px; background: #f0f0f0; border-bottom: 1px solid #fff; border-right: 1px solid #fff;}
.engine-table td{ padding: 8px 8px; background: #f3f0f0; border-bottom: 1px solid #fff;}

	.engine-single-links{}
	.engine-single-links a{ margin-bottom: 16px; display: block; min-width: 80%;}
	
	.engine-single-features ul{display: block;}
	.engine-single-features li{display: block;}
	.engine-single-features li span{display: block;}
		.engine-single-features li span+em{display: block; padding-left: 1.5em;}
	
	.eGX-Links p{width: 300px;}
	.engine-single-spec-eGX .pl1{padding-left: 1em;}
	.engine-single-main-eGX h1{display: block;}
	.engine-single-main-eGX h2{font-size:16px; text-align: center}	
	.engine-single-main-eGX ul{display: block;}
	.engine-single-main-eGX ul li{margin: 0 0 8px;}
	/* ---------engine top slider---------- */
.engine-top-slide{ height: 160px; overflow: hidden; position: relative; display: none;}
.engine-top-slide h1{line-height: 1.2;}
.engine-top-slider-history h1{ white-space: normal; font-size: 24px; bottom: 8px; left: 8px;}
.engine-top-slider-history h1 em{ font-size: 16px;}
.engine-top-slider-history span{width: 25%; height: 100%;}
.engine-top-slider-tech h1{white-space: normal; font-size: 30px; text-align: right;}
.engine-top-slider-tech h1 em{ font-size: 16px;}

.engine-top-slider-first h1 img{ margin: auto; width: 50%; position: relative; opacity: 0;}
.engine-top-slider-first.currents h1 img{	animation: first 1.5s ease-out forwards;}

	
.engine-top-slider-global{ }
.engine-top-slider-global h1{ white-space: normal; font-size: 32px; left: 0;}
.engine-top-slider-global h1 em{ font-size: 14px;}
.engine-top-slider-global img{height: 100%;}
	
.engine-top-slider-gx50 h1{ font-size: 18px;bottom: 1%; right: 0; width: 100%; text-align: center;}
.engine-top-slider-gx50 h1 em{ font-size: 18px;}
.engine-top-slider-gx50 img{ position: relative; left: 0; top: -20%; width: auto; z-index: 1;}
.engine-top-slider-gx50.currents h1{ 	animation: gx50-h1 4.5s ease-out forwards;}
x.engine-top-slider-gx50.currents h1 em{ 	animation: gx50-h1-em 4.5s ease-out forwards;}
.engine-top-slider-gx50.currents img{	animation: gx50-img 4.5s ease-out forwards;}

	.engine-PageTop{right: -1px; bottom: -1px; font-size: 20px; border: 1px solid #333; }
	.engine-PageTop a{padding: 4px 10px; background: #fff;}
	.engine-PageTop em{display: none;}

	#colorbox,
	#cboxWrapper,
	#cboxWrapper *{max-width: 100vw;}
	.cboxPhoto{max-width: 100%;}
	.engin-Btn, div a.engin-Btn, a.engin-Btn{
	margin-bottom: 16px;
	}
}

@media(max-width: 736px){

@keyframes first {
    0%  { width:50%;  opacity: 0; }
    20% { width:50%; opacity: 1; }
    80% { opacity: 1; }
    90%{ width:80%; max-width: none;  opacity: 1; }
    100%{ width:100%; max-width: none;  opacity: 0; }
}
	@keyframes gx50-h1 {
    0%  { opacity: 0; bottom:2%; right: -0;}
    10%  { opacity: 0;bottom:2%;}
    30%  { opacity: 1;bottom:4%; right: 0px;}
    90%  { opacity: 1;bottom: 6%; right: 0px;}
    100%{ opacity: 0; bottom: 0%; right: 0px;}
}
@keyframes gx50-img {
    0%  { left: -240px; opacity: 1; }
    20% { left: 0; }
    90% { opacity: 1; left: 16px; }
    100%{ opacity: 0; left: -80px; }
}
	
	.engine-top-slider-gooddesign h1{ position: absolute; width: 100%; }
	.engine-top-slider-gooddesign h1 em{display: none;}
	.engine-top-slider-gooddesign img{ height: 140%; width: auto;}
	
@keyframes global-h1 {
    0%  { bottom: -100%; }
    20% { bottom: 16px; }
    22% { bottom: 8px; }
    50% { bottom: 8px; color: #fff; }
    56% { bottom: 8px; color: #f00; }
    64% { bottom: 8px; color: #fff; }
    68% { bottom: 8px; }
    70% { bottom: 8px;  opacity: 1;}
    80% { bottom: 1.5em;  opacity: 1;}
    100%{ bottom: 3em; opacity: 0; }
}
@keyframes global-img {
    0%  { right: 0; top: 0;opacity: 0; width: 100%; }
    20% { right: 0; top: 0;opacity: 1;}
    30% { right: 0; top: 0;opacity: 1;}
    70% { opacity: 1; width: 105%;}
    90% { top:0;opacity: 0;}
    100%{ opacity: 0;}
}

	
@keyframes history-h1 {
    0%  { left: -50%; }
    10% { left: 16px; }
    12% { left: 8px; }
    90% { left: -1px;  opacity: 1;}
    100%{ left: -100%; opacity: 0; }
}
@keyframes history-img {
    0%  { right: -100%; bottom: 0;  }
    10% { right: 10px; bottom: 0;}
    12% { right: 0; bottom: 0;}
    90% { right: -50px; bottom: 0; }
    100%{ right: -50%;  }
}
@keyframes history-span {
    0%  { left: -100%; top: -100%; }
    15% { left: 0px; top: 0;}
    54% { left: 0px; top: 0;}
    80% { left: 0px; top: 0;}
    100%{ left: -100%;  }
}
	
@keyframes history-tech {
    0%  { font-size: 0; opacity: 0; bottom: 0; }
    10%  { font-size: 0; opacity: 0; }
    25%  { font-size: 24px; opacity: 1; }
    30%  { font-size: 24px; opacity: 1;  bottom: 0;}
    85%  { opacity: 1; }
    100%  { font-size: 24px; opacity: 0;  bottom: 1em;}
}
@keyframes history-tech-em {
    0%  { font-size: 16px; opacity: 0; }
    40%  { font-size: 16px; opacity: 0; }
    50%  { font-size: 16px; opacity: 1; }
    85%  { opacity: 1; }
    100%  { font-size: 16px; opacity: 0; }
}

}
	
	

@media(max-width: 480px){
		.engine-listing-4 .engine-box{ flex: 0 1 100%;}
	}



/*---------------PRINT---------------*/
.engines-PrintPreview #honda_header,
.engines-PrintPreview .engine-common-header,
.engines-PrintPreview .engine-menus,
.engines-PrintPreview .engine-crumbs,
.engines-PrintPreview .engine-contact,
.engines-PrintPreview .engine-series-container,
.engines-PrintPreview .engine-banners
{ display: none;}
.engines-PrintPreview .engine-single-main {
	background: none;
	padding: 16px;
	margin: 0;
}
.engines-PrintPreview .engine-single-main h1{ font-size: 30px;}
.engines-PrintPreview .engine-single-main ul{display: none;}
.engines-PrintPreview .engine-single-main .e-w980
{flex-wrap: wrap; justify-content: space-around; align-items: flex-start;}
.engines-PrintPreview .engine-single-main .e-w980 div{
	flex: 0 0 100%; text-align: center;
}
.engines-PrintPreview .engine-single-main .e-w980 p.engin-image{
	flex: 0 0 48%; text-align: center;
}
.engines-PrintPreview .engine-single-main .e-w980 p.engin-graph{
	flex: 0 0 28%; text-align: center;
}
.engines-PrintPreview .e-w980{width: 90%;}
.engines-PrintPreview .engine-single-main p.engin-graph i{display: none;}

@media print{

#honda_header,
.engine-common-header,
.engine-menus,
.engine-crumbs,
.engine-contact,
.engine-banners
{ display: none;}
.engine-single-main {
	background: none;
	padding: 16px;
	margin: 0;
}
.engine-single-main h1{ font-size: 30px;}
.engine-single-main ul{display: none;}
.engine-single-main li{  display:inline-block; margin: 0 8px;}
.engine-single-main .e-w980{ display: table; width: auto; margin: auto;}
.engine-single-main .e-w980 div{ display: table-cell; padding: 20px; vertical-align: middle;}
.engine-single-main .e-w980 p.engin-image{display: table-cell; padding: 20px; width: 250px;vertical-align: middle;}
.engine-single-main .e-w980 p.engin-graph{ display: table-cell; padding: 20px; width: 200px;}
.e-w980{width: 90%;}
.engine-single-main p.engin-graph i{display: none;}
.engine-single-container{padding: 0 0 40px; margin: 0;}
.engine-single-features p{font-size: 13px; padding: 0 0 8px;}
.engine-h1{margin-bottom: 20px; font-size: 16px;}
.engin-Btn{display: none;}
	.engine-series-container{margin: 0 0 24px;}
.engine-series-features li{flex: 0 0 100%; padding: 0 0 8px; font-size: 13px;}
.engine-listing-small .engine-box p{display: none;}
.engine-listing-view{display: none;}
}