@charset "shift_jis";
/* ----------------------------------------------------------------------------------------------------
画像とテキストfloat
---------------------------------------------------------------------------------------------------- */
/* ----------------------------------------------------------------------------------------------------
サイト全体に関わる記述
---------------------------------------------------------------------------------------------------- */
* {
	margin: 0;
	border: 0;
	padding: 0;
	vertical-align: bottom;
	list-style-type: none;
}
body {
	line-height: 1.4;
	color: #555555;
	font-weight: bold;
	font-family: sans-serif;
	-webkit-text-size-adjust: 100%;
}
body, h1, h2, h3, h4, h5, h6 { font-size: 14px; }
table { border-collapse: collapse; }
table th, table td {
	padding: 3px;
	vertical-align: top;
	border: 1px solid #555555;
	font-size: 12px;
}
table th {
	white-space: nowrap;
	background: #e5ebf1;
}
article, section, aside { clear: both; }
article:after, section:after, aside:after { clear: both; }
.font_color_gray01 { color: #555555; }
/* #555		本文フォントのカラー */
.font_color_gray02 { color: #ededed; }
/* #ededed	座布団(補足情報用) */
.font_color_gray03 { color: #b0b0b0; }
/* #b0b0b0;	フレーム */
.font_color_navy01 { color: #002f69; }
/* #002f69;	見出し・目立たせる表記(商品名・結論用など)  */
.font_color_navy02 { color: #004392; }
/* #004392;	装飾(見出しの座布団など) */
.font_color_blue01 { color: #e5ebf1; }
/* #e5ebf1;	座布団(補足情報用) */
.font_color_strong { color: #b43400; }
/* #b43400;	特に目立たせる表記(価格など) */
.font_color_attention { color: #fa2e0c; }
/* #fa2e0c;	強い注意喚起 */
.font_color_link { color: #0086d9; }
/* #0086d9;	テキストリンク */
.co2 {
	font-size: 10px !important;
	vertical-align: bottom !important;
	font-weight: normal;
}
.m3 {
	font-size: 8px !important;
	vertical-align: super !important;
	font-weight: normal;
}
.size-small { font-size: 11px; }
.attention {
	font-size: 11px;
	text-indent: -1em;
	margin-left: 1em;
}
.indent_1em {
	text-indent: -1em;
	margin-left: 1em;
}
/* 英語標記改行 */
.e_wb { word-break: break-all; }
/* ----------------------------------------------------------------------------------------------------
サイトのレイアウトに関わる記述
---------------------------------------------------------------------------------------------------- */
/*ヘッダー
---------------------------------------------------- */
header {
	width: 100%;
	height: 50px;
	padding-bottom: 10px;
	overflow: hidden;
	border-top: 5px solid #006fbe;
	border-bottom: none!important;
	background-color: #fff;
	background-image: none!important;
}
header .logo {
	padding: 7px 0 0 10px;
	float: left;
}
header .logo img {
	width: 100px;
	height: auto;
}
header .category {
	color: #006FBA;
	float: left;
	font-size: 11px;
	font-weight: bold;
	margin-left: 5px;
	margin-top: 27px;
}
header .button {
	width: 60px;
	height: 31px;
	margin-top: 10px;
	float: right;
	display: block;
	background: url(/sp/common/img/btn_slidemenu.png) center center no-repeat;
	background-size: 35px auto;
}
#recommendBnrArea {
margin: 0;
width: 100%;
overflow: hidden;
line-height: 0;
}
#recommendBnr {
margin-top: 0;
background-color: #cccfd1;
padding: 10px 3%;
text-align: center;
line-height: normal;
}
#recommendBnr img {
width: 100%;
height: auto;
}
/*サイト内検索
---------------------------------------------------- */
#search_wrap {
	width: 300px;
	margin: 0 auto 30px auto !important;
	overflow: hidden;
}
#search_wrap #searchField input {
	display: block;
	height: 38px;
	width: 185px;
	color: #555555;
	background: url(/sp/common/css/../img/ico_searchG.png) 7px center no-repeat;
	background-size: 14px 17px;
	padding: 0 0 0 30px;
	border: solid 2px #d7d7d7;
	float: left;
	font-size: 14px;
	font-weight: bold;
}
#search_wrap #searchSubmit input {
	display: block;
	float: right;
	width: 70px;
	height: 42px;
	line-height: 42px;
	text-align: center;
	border-radius: 8px;
	font-size: 16px;
	color: #fff;
	background: -moz-linear-gradient(50% 100% 90deg, #09469c 0%, #09469c 50%, #1251a0 51%, #1556a2 100%);
	background: -webkit-linear-gradient(90deg, #09469c 0%, #09469c 50%, #1251a0 51%, #1556a2 100%);
	background: -webkit-gradient(linear, 50% 100%, 50% 0%, color-stop(0, #09469c), color-stop(0.5, #09469c), color-stop(0.51, #1251a0), color-stop(1, #1556a2));
	background: -o-linear-gradient(90deg, #09469c 0%, #09469c 50%, #1251a0 51%, #1556a2 100%);
	background: -ms-linear-gradient(90deg, #09469c 0%, #09469c 50%, #1251a0 51%, #1556a2 100%);
	background: linear-gradient(0deg, #09469c 0%, #09469c 50%, #1251a0 51%, #1556a2 100%);
}
#search_wrap div.SS_suggest {
	font-weight: normal;
	z-index: 9;
	display: none;
	position: absolute;
	border-bottom: 1px solid #CCC;
	border-right: 1px solid #CCC;
	border-left: 1px solid #CCC;
	width: 200px;
}
#search_wrap div.SS_suggest div.SS_suggestItemOff {
	background-color: #FFF;
	border-top: 1px solid #CCC;
	padding: 2px 0px 2px 0px;
	width: 100%;
}
#search_wrap div.SS_suggest div.SS_suggestItemOn {
	background-color: #ECF5FA;
	border-top: 1px solid #CCC;
	padding: 2px 0px 2px 0px;
	width: 100%;
}
#search_wrap div.SS_suggest span.SS_suggestKey {
	font-size: 110%;
	padding-left: 4px;
	line-height: 1.5;
}
#search_wrap div.SS_suggest span.SS_suggestRate { width: 100px; }
/*サイト内検索(サイド)
---------------------------------------------------- */
#side_search_wrap {
	padding: 5% 3%;
	width: 94%;
	overflow: hidden;
	text-align: center;
	height: 100%;
	border: none;
}
#side_search_wrap #side_searchField input {
	display: block;
	height: 38px;
	width: 185px;
	color: #555555;
	background: url(/sp/common/css/../img/ico_searchG.png) 7px center no-repeat;
	background-size: 14px 17px;
	padding: 0 0 0 30px;
	border: solid 2px #d7d7d7;
	font-size: 14px;
	font-weight: bold;
	margin: 0 auto 10;
}
#side_search_wrap #side_searchSubmit { margin-top: 10px; }
#side_search_wrap #side_searchSubmit input {
	display: block;
	width: 220px;
	height: 42px;
	line-height: 42px;
	text-align: center;
	margin: 0 auto;
	border-radius: 8px;
	font-size: 16px;
	color: #fff;
	background: -moz-linear-gradient(50% 100% 90deg, #09469c 0%, #09469c 50%, #1251a0 51%, #1556a2 100%);
	background: -webkit-linear-gradient(90deg, #09469c 0%, #09469c 50%, #1251a0 51%, #1556a2 100%);
	background: -webkit-gradient(linear, 50% 100%, 50% 0%, color-stop(0, #09469c), color-stop(0.5, #09469c), color-stop(0.51, #1251a0), color-stop(1, #1556a2));
	background: -o-linear-gradient(90deg, #09469c 0%, #09469c 50%, #1251a0 51%, #1556a2 100%);
	background: -ms-linear-gradient(90deg, #09469c 0%, #09469c 50%, #1251a0 51%, #1556a2 100%);
	background: linear-gradient(0deg, #09469c 0%, #09469c 50%, #1251a0 51%, #1556a2 100%);
}
#side_search_wrap div.SS_suggest {
	font-weight: normal;
	z-index: 9;
	display: none;
	position: absolute;
	border-bottom: 1px solid #CCC;
	border-right: 1px solid #CCC;
	border-left: 1px solid #CCC;
	width: 200px;
	padding-left: 0;
}
#side_search_wrap div.SS_suggest div.SS_suggestItemOff {
	background-color: #FFF;
	border-top: 1px solid #CCC;
	padding: 2px 0px 2px 0px;
	width: 100%;
}
#side_search_wrap div.SS_suggest div.SS_suggestItemOn {
	background-color: #ECF5FA;
	border-top: 1px solid #CCC;
	padding: 2px 0px 2px 0px;
	width: 100%;
}
#side_search_wrap div.SS_suggest span.SS_suggestKey {
	font-size: 110%;
	padding-left: 4px;
	line-height: 1.5;
}
#side_search_wrap div.SS_suggest span.SS_suggestRate { width: 100px; }
/*----------------------------------------------------------------------------------------------------
○○ TOPページに戻る
---------------------------------------------------------------------------------------------------- */
#btn_back {
	margin-top: 60px;
	padding-bottom: 30px;
}
#btn_back a {
	height: 60px;
	line-height: 60px;
	background: url(/sp/img/btn_icon_arrow_reflect.png) 3% center no-repeat #e7ecf2;
	background-size: 7px auto;
	padding-left: 8%;
	display: block;
	border-top: 1px solid #cacfd3;
	border-bottom: 1px solid #cacfd3;
	text-decoration: none;
	color: #002f69;
}
/*----------------------------------------------------------------------------------------------------
フッター
---------------------------------------------------------------------------------------------------- */
footer { background: #fff; }
#footerNav a, #footer_wrap a {
	text-decoration: none;
	color: #fff;
}
#footerNav ul {
	display: table;
	width: 100%;
}
#footerNav ul li { display: table-cell; text-align: center;
}
#footerNav ul li:nth-child(-n+3) { width: 25%; }
#footerNav ul li a {
	position: relative;
	display: block;
	line-height: 1;
}
#footerNav ul li img {
	width: 100%;
	height: auto;
}
#footerNav ul li p {
	color: #fff;
	width: 100%;
	position: absolute;
	font-size: 10px;
	display: block;
	text-align: center;
	font-weight: bold;
	line-height: 1.1;
 }
#footerNav ul li:nth-child(2) p, #footerNav ul li:nth-child(3) p { bottom: 19%; }
#footerNav ul li:nth-child(1) p, #footerNav ul li:nth-child(4) p { bottom: 14%; }
#footer_wrap {
	padding: 0 3%;
	color: #fff;
	text-align: center;
	background: #034e88; /* Old browsers */
	background: -moz-linear-gradient(top, #034e88 0%, #0064af 15%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #034e88), color-stop(15%, #0064af)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, #034e88 0%, #0064af 15%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, #034e88 0%, #0064af 15%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top, #034e88 0%, #0064af 15%); /* IE10+ */
	background: linear-gradient(to bottom, #034e88 0%, #0064af 15%); /* W3C */
 filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#034e88', endColorstr='#0064af', GradientType=0 ); /* IE6-9 */
}
#footer_wrap .nav {
	padding: 24px 0 12px 0;
	text-align: right;
}
#footer_wrap .nav li {
	padding: 0 18px 0 0;
	font-size: 12px;
	display: inline-block;
	margin-right: 15px;
	background: url(/sp/img/btn_icon_pc_white.png) right center no-repeat;
	background-size: 11px auto;
}
#footer_wrap .nav li:last-child { margin-right: 0; }
#footer_wrap .copyright {
	font-size: 9px;
	text-align: center;
	padding: 12px 0;/* border-top: 2px solid #035b9b; 201412_delete*/
}
/* ----------------------------------------------------------------------------------------------------
スライドメニュー
---------------------------------------------------------------------------------------------------- */
.contentslist dl .hd_home, .contentslist dl .hd_ene, .contentslist dl .hd_support, .contentslist dl .hd_recruit, .contentslist dl .hd_www {
	color: #fff;
	text-shadow: none;
	height: auto;
	border: 0;
}
.contentslist dl .hd_home { background-color: #006eb6; }
.contentslist dl .hd_ene { background-color: #059549; }
.contentslist dl .hd_www { background-color: #004391; }
.contentslist dl .hd_support { background-color: #b33400; }
.contentslist dl .hd_recruit { background-color: #5393d0; }
.contentslist dl dd div:last-child { padding-left: 20px; }
.contentslist dl .hd_contentslist { padding: 0; }
.contentslist dl .hd_contentslist div {
	padding-left: 36px !important;
	font-size: 12px;
	letter-spacing: -1px;
	height: 36px;
	border-top-left-radius: 8px;
	border-top-right-radius: 8px;
	background: url(/sp/common/img/hd_contentslist.png) 9px center no-repeat, -moz-linear-gradient(50% 100% 90deg, #efefef 0%, #dddddd 50%, #eeeeee 51%, white 100%);
	background: url(/sp/common/img/hd_contentslist.png) 9px center no-repeat, -webkit-linear-gradient(90deg, #efefef 0%, #dddddd 50%, #eeeeee 51%, white 100%);
	background: url(/sp/common/img/hd_contentslist.png) 9px center no-repeat, -webkit-gradient(linear, 50% 100%, 50% 0%, color-stop(0, #efefef), color-stop(0.5, #dddddd), color-stop(0.51, #eeeeee), color-stop(1, white));
	background: url(/sp/common/img/hd_contentslist.png) 9px center no-repeat, -o-linear-gradient(90deg, #efefef 0%, #dddddd 50%, #eeeeee 51%, white 100%);
	background: url(/sp/common/img/hd_contentslist.png) 9px center no-repeat, -ms-linear-gradient(90deg, #efefef 0%, #dddddd 50%, #eeeeee 51%, white 100%);
	background: url(/sp/common/img/hd_contentslist.png) 9px center no-repeat, linear-gradient(0deg, #efefef 0%, #dddddd 50%, #eeeeee 51%, white 100%);
	background-size: 20px auto, 100% 100%;
}
.contentslist dd.siteBackBtn {
	background-color: #cecece;
	padding: 8px;
}
.slidemenu .contentslist dl dd.siteBackBtn a {
	background: #FFF;
	padding: 0;
}
.slidemenu .contentslist dl dd.siteBackBtn a div {
	background: url(/sp/common/img/btn_icon_arrowLeft.png) 3% center no-repeat;
	background-size: 7px auto;
	padding: 10px 8px 10px 9%;
	box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-o-box-sizing: border-box;
}
.menu-button-left {
	left: 0;
	border-right: 1px solid #ddd;
}
.menu-button-right {
	right: 0;
	border-left: 1px solid #ddd;
}
.slidemenu-left { left: 0; }
.slidemenu-right { right: 0; }
.slidemenu {
	background-color: #fff;
	box-shadow: 3px 0 8px 0 rgba(0, 0, 0, 0.2) inset;
	top: 0;
	width: 240px;
	position: fixed;
	visibility: hidden;
	z-index: -1;
}
.slidemenu .slidemenu-header {
	position: relative;
	z-index: 2;
	box-shadow: 4px 1px 5px rgba(0, 0, 0, 0.3);
	padding-left: 10px;
	font-size: 12px;
	line-height: 40px;
	height: 40px;
	text-decoration: none;
	color: #002f69;
	background: -moz-linear-gradient(50% 100% 90deg, #efefef 0%, #dddddd 50%, #eeeeee 51%, white 100%);
	background: -webkit-linear-gradient(90deg, #efefef 0%, #dddddd 50%, #eeeeee 51%, white 100%);
	background: -webkit-gradient(linear, 50% 100%, 50% 0%, color-stop(0, #efefef), color-stop(0.5, #dddddd), color-stop(0.51, #eeeeee), color-stop(1, white));
	background: -o-linear-gradient(90deg, #efefef 0%, #dddddd 50%, #eeeeee 51%, white 100%);
	background: -ms-linear-gradient(90deg, #efefef 0%, #dddddd 50%, #eeeeee 51%, white 100%);
	background: linear-gradient(0deg, #efefef 0%, #dddddd 50%, #eeeeee 51%, white 100%);
}
.slidemenu .slidemenu-body {
	height: 100%;
	overflow: hidden;
	position: relative;
	z-index: 2;
}
.slidemenu .slidemenu-body .slidemenu-content { position: relative; }
.slidemenu .contentslist dl { border: 0; }
.slidemenu .contentslist dl dt { font-size: 12px; }
.slidemenu .contentslist dl dd { border-bottom-color: rgba(0, 0, 0, 0.2); }
.slidemenu .contentslist dl dd div:last-child { padding-left: 10px; }
.slidemenu .contentslist dl a { background-color: transparent; }
/* ----------------------------------------------------------------------------------------------------
ボタン パターン
---------------------------------------------------------------------------------------------------- */
/*罫線
---------------------------------------------------- */
.btn01 {
	padding: 0 !important;
	border: 1px solid #c8c8c8;
	border-bottom: 0;
}
.btn01 li, .btn01 dt, .btn01 dd { border-bottom: 1px solid #c8c8c8; }
.btn01 dt, .btn01 a {
	display: table;
	width: 100%;
	height: 48px;
	line-height: 1.2;
	padding: 6px 0;
	text-decoration: none;
	color: #002f69;
}
.btn01 dt div, .btn01 a div {
	display: table-cell;
	padding-left: 6px;
	vertical-align: middle;
}
.btn01 dt div span, .btn01 a div span {
	font-size: 12px;
	color: #555555;
	line-height: 1.2;
	padding-top: 0.25em;
	padding-bottom: 0.25em;
}
.btn01 dt div:first-child img, .btn01 a div:first-child img { zoom: 0.5; }
.btn01 dt div:last-child, .btn01 a div:last-child {
	width: 100%;
	padding-left: 9px;
	padding-right: 3%;
}
.btn01 a {
	background: url("/sp/common/css/../img/btn_icon_pc_gray.png") 95% center no-repeat white;
	background-size: 11px auto;
}
.btn01 a:not([href^="http://"]), .btn01 a[href^="http://i-preview.info/client/og/sp/"], .btn01 a[href^="https://home.osakagas.co.jp/sp/"], .btn01 a[href^="http://faq.osakagas.jp/osakagas/smart/"], .btn01 a[href^="https://ene.osakagas.co.jp/sp/"], .btn01 a[href^="http://www.kantan-grill.jp/sp/"], .btn01 a[href^="http://hidetaku.jp/sp/"], .btn01 a[href^="http://home-stage.osakagas.co.jp/"], .btn01 a[href^="http://home-stage.osakagas.co.jp:8082"], .btn01 a[href^="https://www.osakagas.co.jp/sp/"] {
	background: url(/sp/img/btn_icon_arrow.png) 95% center no-repeat white;
	background-size: 7px auto;
}
section .more a div:last-child, aside .more a div:last-child { padding-right: 10%; }
section .more a, aside .more a {
	height: inherit;
	color: #555555;
	text-align: right;
	padding: 0;
}
section .more a div, aside .more a div { font-size: 12px; }
#contents > section {
	margin-top: 0;

	margin-bottom: 40px;
}
.block_padding {
	padding-left: 3%;
	padding-right: 3%;
}
.block_hd_navy {
	background-color: #004392;
	color: #fff;
	padding: 6px 3%;
	margin-bottom: 15px;
	clear: both;
}
.block_hd_gray {
	background-color: #b0b0b0;
	color: #fff;
	padding: 6px 3%;
	margin-bottom: 15px;
	clear: both;
}
.block_hd_orange {
	background-color: #F5E7D8;
	color: #666666;
	padding: 6px 3%;
	margin-bottom: 15px;
	clear: both;
}
.block_hd_litegray {
	background-color: #ededed;
	color: #002f69;
	padding: 6px 3%;
	margin-bottom: 15px;
	clear: both;
}
.block_hd_line {
	color: #002f69;
	border-bottom: 3px solid #b5c8d7;
	padding: 2px 0 !important;
	margin-bottom: 10px;
	clear: both;
	font-size: 16px;
}
.block_hd_line span {
	font-size: 12px;
	vertical-align: top;
}
.block_hd_line_p {
	color: #BE4E6B;
	border-bottom: 3px solid #DBA5AF;
	padding: 2px 0 !important;
	margin-bottom: 10px;
	clear: both;
	font-size: 16px;
}
.block_hd_line_p span {
	font-size: 12px;
	vertical-align: top;
}
.copy {
	font-size: 16px;
	color: #002f69;
}
.copy span {
	font-size: 12px;
	vertical-align: top;
}
.copy span.va_b {
	font-size: 12px;
	vertical-align: text-bottom;
}
.copy_s {
	font-size: 14px;
	color: #002f69;
}
.copy_gray {
	font-size: 16px;
	color: #666;
}
.img { text-align: center; }
.img img { vertical-align: middle; }
.txt { margin-top: 10px; }
.txt a {
	color: #0086d9;
	background: url("/sp/common/css/../img/btn_icon_pc_gray.png") 95% center no-repeat;
	background-size: 11px auto;
}
.txt a:not([href^="http://"]), .txt a[href^="http://i-loop.co.jp/client/og/sp/"], .txt a[href^="https://home.osakagas.co.jp/sp/"], .txt a[href^="http://faq.osakagas.jp/osakagas/smart/"] {
	background: none;
	padding-right: 0;
}
.txt a[target=_blank] {
	background: url("/sp/common/css/../img/btn_icon_blank.png") 95% center no-repeat;
	background-size: 11px auto;
	padding-right: 25px;
}
/*ページタイトル
---------------------------------------------------- */
#pagetitle {
	width: 100%;
	margin-bottom: 20px;
	display: table;
}
#pagetitle h1.txt {
	width: 100%;
	padding-top: 5%;
	padding-right: 3%;
	padding-bottom: 5%;
	padding-left: 3%;
	margin-bottom: 20px;
	border-top: 1px solid #C8C8C8;
	border-bottom: 1px solid #C8C8C8;
	display: table-cell;
	vertical-align: middle;
	font-size: 18px;
	color: #002f69;
	line-height: 1.2;
	font-weight: bold;
}
#pagetitle h1.txt span {
	font-size: 12px;
	vertical-align: middle;
	line-height: 2;
}
#pagetitle h1.img img {
	width: 100%;
	height: auto;
	border-top: 1px solid #c8c8c8;
	border-bottom: 1px solid #c8c8c8;
}
#pagetitle > div { display: table-row; }
#pagetitle h1 + #snsArea_sp ul { padding: 20px 3% 0; }
#pagetitle > div > * { margin: 0; }
#pagetitle > div .img { padding-top: 15px; }
#pagetitle > div .copy {
	font-size: 18px;
	padding: 10px 3% 0 3%;
	color: #555555;
}
#pagetitle > div .txt { padding: 20px 3% 0 3%; }
#pagetitle > div .txt span { font-size: 12px; }
/*内ページ用
---------------------------------------------------- */
.innerpage .img, .innerpage .copy, .innerpage .txt {
	margin-top: 5px;
	margin-bottom: 5px;
}
.innerpage .tit {
	font-size: 18px;
	color: #002F69;
}