﻿@charset "UTF-8";

/* 大多喜ガス */
.page_title{background-image:url(../../gas/img/page_title.jpg);}

.main h3{background:#00a997;}
.main h3 span{display:inline-block;}
.main h4{border-bottom:solid 2px #00a997; margin-top:40px;}

a.gas_link{
	display:inline-block;
	margin-top:10px;
}
a.gas_link:before{
	content:'> ';
	color:#00a997;
}

.gas{
	padding-top:40px;
}
.gas h5{
	font-size:24px;
	padding-bottom:10px;
}
.gas .gas_inner{
	overflow:hidden;
}

.gas .gas_inner .image{
	width:36%;
	float:left;
	margin-top:20px;
}
.gas .gas_inner .text{
	width:62%;
	float:right;
	margin-top:20px;
}
.gas .gas_inner .text ol{}
.gas .gas_inner .text ol li{
	border:solid 1px #000;
	border-radius:6px;
	display:table;
	width:100%;
	margin-bottom:.5em;
}
.gas .gas_inner .text ol li span{
	display:table-cell;
	width:2em;
	text-align:center;
	color:#fff;
	background:#000;
	vertical-align:middle;
}

.gas .gas_inner .text ol li.gas01{
	border:solid 1px #da5751;
}
.gas .gas_inner .text ol li.gas01 span{
	background:#da5751;
}
.gas .gas_inner .text ol li.gas02{
	border:solid 1px #d7896a;
}
.gas .gas_inner .text ol li.gas02 span{
	background:#d7896a;
}
.gas .gas_inner .text ol li.gas03{
	border:solid 1px #f4d295;
}
.gas .gas_inner .text ol li.gas03 span{
	background:#f4d295;
}
.gas .gas_inner .text ol li.gas04{
	border:solid 1px #bfb47f;
}
.gas .gas_inner .text ol li.gas04 span{
	background:#bfb47f;
}
.gas .gas_inner .text ol li.gas05{
	border:solid 1px #59a282;
}
.gas .gas_inner .text ol li.gas05 span{
	background:#59a282;
}

.gas .gas_inner .text ol li p{
	display:table-cell;
	vertical-align:middle;
	padding:0.3em;
}

.gas .gas_inner h6{
	padding-bottom:8px;
	font-size:20px;
}
.gas .gas_inner h6:before{
	content:'■';
	color:#00a997;
}

.sp{display:none;}

/*ガストップ*/
.office_box{
	padding:30px 0;
	overflow:hidden;
	border-top:solid 1px #ccc;
}
.office_box img{
	width:360px;
	float:left;
	margin-right:40px;
}
.office_box dl{
	float:left;
}
.office_box dt{
	font-size:20px;
	font-weight:bold;
	padding-bottom:0.5em;
}
.office_box dt::before{
	content: "■";
	color:#b2dfca;
}
.office_box a{
	display:block;
	width:270px;
	background:#44c289;
	border:solid 2px #44c289;
	line-height:40px;
	color:#fff;
	text-align:center;
	margin-top:20px;
	text-decoration:none;
	border-radius:20px ;
	-moz-border-radius:20px ;
	-webkit-border-radius:20px ;
	padding-top:3px;
	transition:.3s;
}
.office_box a:hover{
	background:#fff;
	color:#44c289;
}

.gas_btn{
	padding-top:20px;
}
.gas_btn a{
	line-height:60px;
	text-decoration:none;
	padding:20px 2em 16px;
	transition:.3s;
	border:solid 2px #06a591;
	border-radius:12px;
	background:#06a591;
	color:#fff;
}
.gas_btn a:hover{
	background:#fff;
	color:#06a591;
}
.enefarm03{
	overflow:hidden;
	padding:40px 0;
	width:60%;
	margin:0 auto;
}
.enefarm03 img{
	width:48%;
	float:left;
}
.enefarm03 .gas_btn{
	width:50%;
	float:right;
}


/* ▼768px以下の場合に適用（iPad portrait以下）
---------------------------------------------------------------------- */
@media only screen and (max-width: 768px) {

.main h4{margin-top:20px;}

.gas{
	padding-top:20px;
}
.gas h5{
	font-size:18px;
}

.gas .gas_inner .image{
	width:100%;
	float:none;
	margin-top:0;
}
.gas .gas_inner .text{
	width:100%;
	float:none;
	margin-top:10px;
}

.gas .gas_inner h6{
	font-size:16px;
}
.gas .gas_inner h6:before{
	content:'■';
	color:#00a997;
}

.pc{display:none;}
.sp{display:block;}

.office_box{
	padding:20px 0;
	width:96%;
}
.office_box img{
	width:100%;
	float:none;
	margin-right:0;
}
.office_box dl{
	float:none;
	margin-top:10px;
}
.office_box dt{
	font-size:16px;
	font-weight:bold;
	padding-bottom:8px;
}
.office_box a{
	width:80%;
	margin:8px auto;
	line-height:36px;
}

.enefarm03{
	padding:20px 0;
	width:90%;
}
.enefarm03 img{
	width:100%;
	float:none;
}
.enefarm03 .gas_btn{
	width:100%;
	float:none;
}
	
}