@charset "utf-8";
/* CSS Document */
@media print,screen and (min-width:960px) {
	.graphWrapBox__graphBox__head__csvdl {
		margin-left: 20px;
		background: url(../images/common/icn_csvdownload.svg) no-repeat center center / 32px auto;
		display: inline-block;
		height: 46px;
		width: 32px;
		vertical-align: middle;
		text-indent: -9999px;
	}
	/*.mobile .graphWrapBox__graphBox__head__csvdl, .android .graphWrapBox__graphBox__head__csvdl {
		display: none;
	}*/
	
	/* Design Color */
	/* Running Cost */
	.design02 .graphWrapBox__graphBox__head__csvdl--runningcost {
		background: url(../images/common/icn_csvdownload_pink.svg) no-repeat center center / 32px auto;
	}
	/* Driving Time */
	.design02 .graphWrapBox__graphBox__head__csvdl--time {
		background: url(../images/common/icn_csvdownload_orange.svg) no-repeat center center / 32px auto;
	}
	/* C02 emission */
	.design02 .graphWrapBox__graphBox__head__csvdl--co2 {
		background: url(../images/common/icn_csvdownload_green.svg) no-repeat center center / 32px auto;
	}

}
@media print,screen and (min-width:960px) and (orientation:landscape) {
	/*
	----------------------------------------- Common */
	.pcOnly {
		display: none;
	}
	
	a.btn,
	a img{
		transition: all .3s linear;
	}
	a.btn:hover,
	a:hover img{
		opacity: .7;
	}
	
	a:link[href^="tel:"] {
		color: #333;
	}
	
	/*
	----------------------------------------- Contents */
	/* Common */
	.contentsWrapper {
		position: relative;
	}

	/* Main Menu */
	.pageTitelBox {
		height: 88px;
		padding-top: 15px;
		/*padding: 25px 0 20px;*/
		padding-left: 30px;
	}
	.hlLv01 {
		text-align: left;
		font-size: 3.2rem;
	}
	.hlLv01--mainmenu::before,
	.design02 .hlLv01--mainmenu::before {
		display: inline-block;
		width: 60px;
		height: 60px;
		margin-right: 20px;
		vertical-align: middle;
	}

	.mainmenu__list {
		display: flex;
		-webkit-flex-direction: row; /* Safari */
		flex-direction:         row;
		-webkit-justify-content: space-between; /* Safari */
		justify-content:         space-between;
		-webkit-flex-wrap: wrap; /* Safari */
		flex-wrap:         wrap;
		height: calc(100vh - 100px - 88px);
		min-height: 400px;
		padding: 20px 20px 0;
	}
	.ipad.safari .mainmenu__list {
		height: calc(100vh - 100px - 88px - 56px);
	}
	.mainmenu__list__item {
		display: flex;
		height: 46%;
		width: 49%;
	}
	.mainmenu__list__item a {
		padding-left: 5%;
		font-size: 3rem;
		letter-spacing: .05em;
	}
	.mainmenu__list__item a::before {
		margin-right: 20px;
		width: 80px;
		height: 80px;
	}

	/* News Box */

	/*.newsListBox {
		display: block;
	}*/
	.hlLv01--news::before {
		display: inline-block;
		background: 64px auto;
		width: 64px;
		height: 64px;
		margin-right: 20px;
	}
	.newsList_table_wrap {
		height: calc(100% - 88px - 90px);
	}
	.newsListFoot__close {
		font-size: 1.8rem;
	}
	.newsListFoot__close::before {
		font-size: 6rem;
	}

	/* Maintenance Box */
	.maintenanceBox {
		height: 100%;
	}
	.pageTitelBox--maintenance,
	.design02 .pageTitelBox--maintenance  {
		padding-top: 25px;
		height: calc(50% - 45px);
		display: flex;
		align-items: center;
		justify-content: center;
	}
	.maintenanceTitle {
		text-align: center;
		font-size: 3.2rem;
		font-weight: bold;
	}
	.maintenanceTitle::before {
		background-size: 184px auto;
		height: 151px;
		width: 184px;
		display: inline-block;
		margin-right: 20px;
		vertical-align: middle;
	}

	.maintenanceTitle__txt {
		display: inline;
	}

	.maintenanceBox__contents {
		display: flex;
		-webkit-align-items: center;
		align-items: center;
		margin: 0 4%;
		background: #FFF url(../images/common/icn_mainte_bg.svg) no-repeat 97% center / auto 80%;
		padding: 4%;
		height: calc(50% - 45px);
	}
	.maintenanceTitle__sp {
		display: none;
	}
	.maintenanceBox__contents__item--01 {
		width: 35%;
		min-width: 280px;
	}
	.maintenanceBox__contents__item__callInfo__title {
		background-color: #E9E9DE; 
		font-size: 2.8rem;
		padding: 1.4rem;
		margin-bottom: 3rem;
	}
	.maintenanceBox__contents__item__callInfo__data--companyname {
		font-size: 3rem;
	}
	.maintenanceBox__contents__item__callInfo__data--tel {
		font-size: 4rem;
		line-height: 1;
	}
	.maintenanceBox__contents__item--02 {
		text-align: left;
		margin-top: 0;
		margin-left: 4%;
	}
	.maintenanceBox__contents__item__callcenterName {
		font-size: 2.2rem;
		line-height: 1;
	}
	.maintenanceBox__contents__item__freedial {
		font-size: 3.4rem;
		margin-bottom: 5px;
	}
	.maintenanceBox__contents__item__freedial::before {
		width: 55px;
		height: 36px;
		background-size: 55px auto;
		margin-right: 10px;
	}
	.maintenanceBox__contents__item__centerinfo {
		font-size: 1.8rem;
	}

	.maintenanceBoxFoot__close {
		font-size: 1.8rem;
	}
	.maintenanceBoxFoot__close::before {
		font-size: 6rem;
	}
	
	/* News Tip */
	.newsTipBox {
		font-size: 2.6rem;
	}
	
	
	/************* Graph Contents *************/
	/* Graph Common */
	.lnavBox {
		background-color: transparent;
		padding-top: none;
	}
	.lnavWrap {
		display: flex;
	}
	.lnav__item {
		width: 25%;
		margin-left: 3px;
	}
	.lnav__item:first-child {
		margin-left: 0;
	}
	.lnav__item a {
		padding: 22px 0;
	}
	.lnav__item a img {
		height: 40px;
		width: auto;
	}

	/* Wind Speed */
	.hlLv01--graphtitle {
		margin-top: 5px;
	}
	.hlLv01--graphtitle::before {
		display: inline-block;
		background-size: 46px;
		width: 46px;
		height: 48px;
		margin-right: 15px;
		vertical-align: middle;
	}
	.pageTitelBox__ecodrive {
		display: none;
		width: 160px;
		height: 70px;
		font-size: 1.2rem;
		top: 10px;
		right: 10px;
		padding-top: 7px;
	}
	.pageTitelBox__ecodrive::before {
		display: inline-block;
		background-size: 53px auto;
		width: 53px;
		height: 56px;
		font-size: 1.2rem;
		margin: 0 10px 0 0;
		vertical-align: middle;
	}
	.pageTitelBox__ecodrive__txt {
		display: inline-block;
		vertical-align: middle;
	}

	.graphWrapBox {
		height: calc(100vh - 100px - 88px);
		min-height: 400px;
		padding: 2%;
		display: flex;
		-webkit-flex-direction: row; /* Safari */
		flex-direction:         row;
	}
	.ipad.safari .graphWrapBox {
		height: calc(100vh - 100px - 88px - 56px);
	}
	.graphWrapBox__graphBox {
		height: 100%;
		margin: 0;
		width: 60%;
	}
	.graphWrapBox__graphBox__head {
		padding: 7px 0;
	}
	
	.graphWrapBox__valueBox {
		height: 100%;
		width: 38%;
		display: flex;
		-webkit-flex-direction: column; /* Safari */
		flex-direction:         column;
	}
	.graphWrapBox__valueBox__inner {
		margin: 0;
		-webkit-flex-direction: column; /* Safari */
		flex-direction:         column;
		height: calc(100% - 2% - 88px);
	}
	.graphWrapBox__valueBox__inner__item {
		height: 48%;
		width: 100%;
	}
	.graphWrapBox__valueBox__inner__item__value {
		font-size: 4rem;
		height: calc(100% - 40px);
	}
	.graphWrapBox__valueBox__inner__item__value__inner {
		/* border-bottom: #333 solid 3px; */
	}

	.graphWrapBox__valueBox__inner__item__lavel {
		font-size: 2.4rem;
		height: 40px;
		line-height: 40px;
	}
	
	/* Running Cost */
	/* Design Color */
	.design02 .graphWrapBox__graphBox__head__csvdl--runningcost {
		background: url(../images/common/icn_csvdownload_pink.svg) no-repeat center center / 32px auto;
	}

	.graphWrapBox__valueBox__inner__item--runningcost__value {
		font-size: 7rem;
	}
	.graphWrapBox__valueBox__inner__item--runningcost__value__fss {
		font-size: 5rem;
	}
	.graphWrapBox__valueBox__inner__item--electric__value {
		font-size: 6rem;
	}
	.graphWrapBox__valueBox__inner__item--electric__value__fss {
		font-size: 4rem;
	}
	
	/* Driving Time */
	/* Design Color */
	.design02 .graphWrapBox__graphBox__head__csvdl--time {
		background: url(../images/common/icn_csvdownload_orange.svg) no-repeat center center / 32px auto;
	}
	
	.graphWrapBox__valueBox__inner__item--time {
		height: 32%;
	}
	.graphWrapBox__valueBox__inner__item--time__value__inner {
		border-bottom: none;
		padding-right: 0;
	}
	.graphWrapBox__valueBox__inner__item--time__value__inner__line {
		/*border-bottom: #333 solid 3px;*/
	}
	.graphWrapBox__valueBox__inner__item--time__value {
		font-size: 4rem;
	}
	.graphWrapBox__valueBox__inner__item--time__value__fss {
		font-size: 2rem;
	}
	
	/* C02 emission */
	/* Design Color */
	.design02 .graphWrapBox__graphBox__head__csvdl--co2 {
		background: url(../images/common/icn_csvdownload_green.svg) no-repeat center center / 32px auto;
	}

	.graphWrapBox__valueBox__inner__item--co2 {
		height: 100%;
	}
	.graphWrapBox__valueBox__inner__item--co2__value__inner {
		border-bottom: none;
	}
	.graphWrapBox__valueBox__inner__item--co2__value__fsl {
		font-size: 8rem;
		display: inline-block;
		/*border-bottom: #333 solid 3px;*/
		margin-right: 0;
	}
	.graphWrapBox__valueBox__inner__item--co2__value__fss {
		display: block;
		font-size: 4rem;
		/*border-bottom: #333 solid 1px;*/
		margin-top: 10px;
		line-height: 1.4;
	}


	/* Wind Speed */
	.graphWrapBox__graphBox__graph--windspeed {
		height: 100%;
		padding: 0 6%;
	}
	.graphWrapBox__graphBox__graph__inner__graphBody--windspeed {
		height: 100%;
	}

	.graphWrapBox__valueBox__inner__item--windspeed__value {
		font-size: 7rem;
	}
	.graphWrapBox__valueBox__inner__item--windspeed__value__fss {
		font-size: 4.6rem;
	}
	.graphWrapBox__valueBox__inner__item--windspeed__setValue {
		font-size: 5rem;
	}
	.graphWrapBox__valueBox__inner__item--windspeed__setValue__fss {
		font-size: 3.2rem;
	}
	
	/* Attention Box */
	.attentionBox {
		height: calc(100% + 88px);
		top: -88px;
	}
	.attentionBox--index {
		height: 100%;
		margin-top: 88px;
	}
	.attentionBox__icn {
		width: 50%;
	}
	.attentionBox__icn img {
		width: 100%;
	}
	.attentionBox__title {
		text-align: center;
		font-size: 6rem;
		padding-top: 4rem;
	}
	.attentionBox__txt {
		text-align: center;
		font-size: 3rem;
		margin-top: 4rem;
	}
	/* Loader */
	.loader {
	  margin: 80px auto;
	  font-size: 25px;
	}
}
@media print,screen and (min-width:1400px) {
	.mainmenu__list__item a {
		padding-left: 10%;
		font-size: 4rem;
		letter-spacing: .1em;
	}
}
