﻿@charset "utf-8";
/* BEC-SOFIT詳細案内 */

html *	{
	box-sizing: border-box;
}
body  {
	margin-top: 0;
	margin-bottom: 0;
	background-color: #f5f5f5;
	background-image: url(../button/bec-wall2022c.png);
	background-attachment: fixed;
}
/************* ヘッダー  *************/
header {
	max-width: 800px;
	margin: 0 auto;
	padding: 0px 0px 0px 0px;
	background: #8eb9ff;
}
header p {
	font-size: 12px;
	color: #ffffff;
	font-family: "ＭＳ Ｐゴシック",Osaka,sans-serif;
	line-height: 14px;
	letter-spacing: 3px;
	margin: 0;
	padding: 30px 25px 0px 0px;
	text-align: right;
}
header img {
	width: 226px;
	border: 0px;
	margin: 0px 570px 20px 0;
	padding: 0px;
}
.topline	{
	height: 7px;
	background-color: #014471;
	background-image: url(../button/line-blue.png);
	background-repeat: repeat;
	margin: 0;
}
.underline	{
	height: 4px;<p>
	background-color: #014471;
	background-image: url(../button/top-line.png);
	background-repeat: repeat;
	margin: 0;
}
/********** メインコンテナ **********/
.main-container	{
	width: 800px;
	text-align: center;
	margin: 0 auto;
	padding: 0;
	background: #ffffff;
	border-left: 1px solid #e0e0e0;
	border-right: 1px solid #e0e0e0;
	box-shadow: 0px 0px 4px 1px rgba(0,0,0,0.3);
}

/************* 特殊文字飾り **************/
.becsicon	 {
	font-size: 13px;
	color: #2222ff;
	text-align: left;
	line-height: 12px;
	font-weight: normal;
	letter-spacing: 1px;
	margin: 0 0 -5px -5px;
	padding: 0;
}
/*    */
.mark::before	{
	content: "\221E\221E\221E\221E\221E  ";
	color: #2222ff;
	font-size: 14px;
}
.mark::after	{
	content: "  \221E\221E\221E\221E\221E";
	color: #2222ff;
	font-size: 14px;
}

/*△△△△△* マーク(電話/車/住所/他)-文字 *△△△△△*/
ul#bec-icn16 {
	margin: 5px 10px 0px 10px;
	padding: 0;
}
ul#bec-icn16 li	{
	font-size: 12px;
	color: #000;
	font-weight: normal;
	text-align: left;
	text-decoration: none;
	line-height: 18px;
	list-style: none;
	margin: 0;
	padding: 0;
}
/* ?）柿 */
ul#bec-icn16 li#or {
	background: url(../button/image-arr-o.png)no-repeat;
	padding: 0px 0px 5px 25px;
}
/* 交）茶 */
ul#bec-icn16 li#traffic {
	background: url(../button/image-way-br.png)no-repeat;
	padding: 0px 0px 5px 25px;
}
/* →）青 */
ul#bec-icn16 li#bl {
	background: url(../button/listmark_22_b.png)no-repeat;
	padding: 0px 0px 5px 25px;
}
/* ◎）緑 */
ul#bec-icn16 li#gr {
	background: url(../button/image-wcr-g.png)no-repeat;
	padding: 0px 0px 5px 25px;
}
/* ＊）青 */
ul#bec-icn16 li#as-b {
	background: url(../button/listmark_30_b.png)no-repeat;
	padding: 0px 0px 5px 25px;
}
/* ＊）赤 */
ul#bec-icn16 li#as-r {
	background: url(../button/listmark_30_re.png)no-repeat;
	padding: 0px 0px 5px 25px;
}
/* TEL）青 */
ul#bec-icn16 li#tel {
	background: url(../button/image-tel-b.png)no-repeat;
	padding: 0px 0px 5px 25px;
}
/* ㎡）青 */
ul#bec-icn16 li#m2 {
	background: url(../button/image-m2-b.png)no-repeat;
	padding: 0px 0px 5px 25px;
}
/* 構）青 */
ul#bec-icn16 li#build {
	background: url(../button/image-build-b.png)no-repeat;
	padding: 0px 0px 5px 25px;
}
/* 設）青 */
ul#bec-icn16 li#room {
	background: url(../button/image-room-b.png)no-repeat;
	padding: 0px 0px 5px 25px;
}
/* 車）茶 */
ul#bec-icn16 li#car {
	background: url(../button/image-car-br.png)no-repeat;
	padding: 0px 0px 5px 25px;
}
/* 駐）青 */
ul#bec-icn16 li#gara {
	background: url(../button/image-car-b.png)no-repeat;
	padding: 0px 0px 5px 25px;
}
/* 〒）赤 */
ul#bec-icn16 li#re {
	background: url(../button/image-zip-r.png)no-repeat;
	padding: 0px 0px 5px 25px;
}
/* 人）緑*/
ul#bec-icn16 li#man {
	background: url(../button/image-man.png)no-repeat;
	padding: 0px 0px 5px 25px;
}
/* 歩）緑 */
ul#bec-icn16 li#run {
	background: url(../button/image-man-g.png)no-repeat;
	padding: 0px 0px 5px 25px;
}

/*------　地図　------*/
div#mapbase {
	background-color: #ffffff;
	border: 2px solid #f1f1f1;
	margin: 0;
	padding: 1px;
}

/*****************　　　写真案紹介　　　*****************/
/*****************　フロート式画像ナビ　*****************/
/*****************　　　　　　　　　　　*****************/

/*** エリア設定  ***/
ul#bec-imgfog	{
	max-width: 800px;
	padding: 0;
	margin: 0 0 5px 6px;
}

/******* 画像処理on文字250-3列Box □□□*******/
ul#bec-imgfog li#p31	{
	position: relative;
	float: left;
	width: 256px;
	height: 190px;
	padding: 0;
	margin: 4px 8px 4px 0px;
	overflow: hidden;
	display: inline-block;
	list-style: none;
	border: 1px solid #e0e0e0;
	box-shadow: 1px 1px 4px 1px rgba(0,0,0,0.3);
}
/*** 建物画像 ***/
ul#bec-imgfog li#p31	img	{
	width: 256px;
	height: 190px;
	border: 0;
	margin: 0;
	padding: 0;
}
ul#bec-imgfog li#p31	a:hover	{
	color: #ff0000;
	text-decoration: none;
}
/*** 画像mask ***/
ul#bec-imgfog li#p31	a	{
	position: absolute;
	left: 0;
	bottom: 0;
	width: 256px;
	height: 200px;
	text-align: center;
	text-decoration: none;
	background-image: url(../button/grad-v300_200-1.png);
	background-repeat: repeat-x;
	margin: 0;
	padding: 0;
}
ul#bec-imgfog li#p31	a:hover	{
	text-decoration: underline;
	opacity: 1.0;
}
/******* 画像処理on文字250-4列Box □□□□*******/
ul#bec-imgfog li#p41	{
	position: relative;
	float: left;
	width: 190px;
	height: 190px;
	padding: 0;
	margin: 4px 8px 4px 0px;
	overflow: hidden;
	display: inline-block;
	list-style: none;
	border: 1px solid #e0e0e0;
	box-shadow: 1px 1px 4px 1px rgba(0,0,0,0.3);
}
/*** 建物画像 ***/
ul#bec-imgfog li#p41	img	{
	width: 190px;
	height: 190px;
	border: 0;
	margin: 0;
	padding: 0;
}
ul#bec-imgfog li#p41	a:hover	{
	color: #ff0000;
	text-decoration: none;
}
/*** 画像mask ***/
ul#bec-imgfog li#p41	a	{
	position: absolute;
	left: 0;
	bottom: 0;
	width: 190px;
	height: 200px;
	text-align: center;
	text-decoration: none;
	background-image: url(../button/grad-v300_200-1.png);
	background-repeat: repeat-x;
	margin: 0;
	padding: 0;
}
ul#bec-imgfog li#p41	a:hover	{
	text-decoration: underline;
	opacity: 1.0;
}
/******* 画像処理on文字120-6列Box □□□□□□*******/
ul#bec-imgfog li#p61	{
	position: relative;
	float: left;
	width: 124px;
	height: 190px;
	padding: 0;
	margin: 4px 8px 4px 0px;
	overflow: hidden;
	display: inline-block;
	list-style: none;
	border: 1px solid #e0e0e0;
	box-shadow: 1px 1px 4px 1px rgba(0,0,0,0.3);
}

/*** 建物画像 ***/
ul#bec-imgfog li#p61	img	{
	width: 124px;
	height: 190px;
	border: 0;
	margin: 0;
	padding: 0;
}
ul#bec-imgfog li#p61	a:hover	{
	color: #ff0000;
	text-decoration: none;
}
/*** 画像mask ***/
ul#bec-imgfog li#p61	a	{
	position: absolute;
	left: 0;
	bottom: 0;
	width: 124px;
	height: 200px;
	text-align: center;
	text-decoration: none;
	background-image: url(../button/grad-v300_200-1.png);
	background-repeat: repeat-x;
	margin: 0;
	padding: 0;
}
ul#bec-imgfog li#p61	a:hover	{
	text-decoration: underline;
	opacity: 1.0;
}
/******* 画像処理共通文字 *******/
.p-mask	{
	font-size: 12px;
	color: #0000ff;
	text-align: center;
	font-weight: 400;
	line-height: 14px;
	text-decoration: none;
	margin: 185px 7px 0px 7px;
}

.home-end	{
	clear: both;
}
/*------　文字枠　------*/
.bec-indexbody	{
	text-align: left;
	background-color: #ffffe1;
	border: 1px solid #aaaaaa;
	padding: 10px;
	margin: 0 2px 2px 2px;
	-webkit-box-shadow: 2px 2px 4px #d2d2d2;
	-moz-box-shadow: 2px 2px 4px #d2d2d2;;
	box-shadow: 2px 2px 4px #d2d2d2;
	border-radius: 5px;
}
/******************* 掲示板BOX *********************/
.bec-combox-b {
	width: 100%;
	margin: 0px;
	padding: 6px 15px 6px 15px;
	border-bottom: 1px solid #8080ff;
	background-image: url(../button/bec-wall2022b.png);
}
.bec-combox-br {
	width: 100%;
	margin: 0px;
	padding: 6px 15px 6px 15px;
	border-bottom: 1px solid #d3c6b3;
	background-image: url(../button/bec-wall2022br.png);
}
/************ 区切り線およびヘッダーLINE ************/
/*-----------　帯タイプ線（青） ----------*/
.dotted-mask-b	{
	width: 800px;
	text-align: center;
	margin: 5px 0 5px 0;
	padding: 0;
	border-top: 1px solid #8080ff;
	border-radius: 0px;
	background-image: url(../button/dotted_mask_b.png);
	background-repeat: repeat-x;
}
.dotted-mask-b h3	{
	font-size: 12px;
	font-family: "ＭＳ Ｐゴシック",Osaka,sans-serif;
	color: #666666;
	text-align: center;
	font-weight: normal;
	line-height: 14px;
	letter-spacing: 2px;
	display: inline-block;
	background-color: #ffffff;
	border: 0px solid #;
	border-radius: 10px 10px 0px 0px;
	margin:  7px 0 0 0;
	padding: 3px 30px 5px 30px;
}
/*-----------　帯タイプ線（緑） ----------*/
.dotted-mask-g	{
	width: 800px;
	text-align: center;
	margin: 5px 0 5px 0;
	padding: 0;
	border-top: 1px solid #00df8c;
	border-radius: 0px;
	background-image: url(../button/dotted_mask_g.png);
	background-repeat: repeat-x;
}
.dotted-mask-g h3	{
	font-size: 12px;
	font-family: "ＭＳ Ｐゴシック",Osaka,sans-serif;
	color: #666666;
	text-align: center;
	font-weight: normal;
	line-height: 14px;
	letter-spacing: 2px;
	display: inline-block;
	background-color: #ffffff;
	border: 0px solid #;
	border-radius: 10px 10px 0px 0px;
	margin:  6px 0 0 0;
	padding: 2px 20px 0px 20px;
}
/*-----------　帯タイプ線（赤） ----------*/
.dotted-mask-r	{
	width: 800px;
	text-align: center;
	margin: 5px 0 5px 0;
	padding: 0;
	border-top: 1px solid #de0273;
	border-radius: 0px;
	background-image: url(../button/dotted_mask_r.png);
	background-repeat: repeat-x;
}
.dotted-mask-r h3	{
	font-size: 12px;
	font-family: "ＭＳ Ｐゴシック",Osaka,sans-serif;
	color: #666666;
	text-align: center;
	font-weight: normal;
	line-height: 14px;
	letter-spacing: 2px;
	display: inline-block;
	background-color: #ffffff;
	border: 0px solid #;
	border-radius: 10px 10px 0px 0px;
	margin:  4px 0 0 0;
	padding: 1px 20px 0px 20px;
}
/*-------------- ドット線（グレー） -------------*/
.dotted-line-bk {
	line-height: 12px;
	font-size: 12px;
	color: #666666;
	font-family: "ＭＳ Ｐゴシック",Osaka,sans-serif;
	text-align: center;
	letter-spacing: 3px;
	border-top: 3px dotted #6c6bff;
	border-left: 3px dotted #6c6bff;
	border-right: 3px dotted #6c6bff;
	border-radius: 15px 15px 0px 0px;
	margin: 10px 5px 0px 5px;
	padding: 5px 0 0 0;
}
/*-------------- ドット線（緑） -------------*/
.dotted-line-gr {
	line-height: 12px;
	font-size: 12px;
	color: #01cd81;
	font-family: "ＭＳ Ｐゴシック",Osaka,sans-serif;
	text-align: center;
	letter-spacing: 3px;
	border-top: 3px dotted #01cd81;
	border-left: 3px dotted #01cd81;
	border-right: 3px dotted #01cd81;
	border-radius: 15px 15px 0px 0px;
	margin: 10px 5px 0px 5px;
	padding: 5px 0 0 0;
}
/*-------------- ドット線（青） -------------*/
.dotted-line-bl {
	line-height: 12px;
	font-size: 12px;
	color: #6c6bff;
	font-family: "ＭＳ Ｐゴシック",Osaka,sans-serif;
	text-align: center;
	letter-spacing: 3px;
	border-top: 3px dotted #6c6bff;
	border-left: 3px dotted #6c6bff;
	border-right: 3px dotted #6c6bff;
	border-radius: 15px 15px 0px 0px;
	margin: 10px 5px 0px 5px;
	padding: 5px 0 0 0;
}
/*-------------- ドット線（赤） -------------*/
.dotted-line-re {
	line-height: 12px;
	font-size: 12px;
	color: #be0066;
	font-family: "ＭＳ Ｐゴシック",Osaka,sans-serif;
	text-align: center;
	letter-spacing: 3px;
	border-top: 3px dotted #be0066;
	border-left: 3px dotted #be0066;
	border-right: 3px dotted #be0066;
	border-radius: 15px 15px 0px 0px;
	margin: 10px 5px 0px 5px;
	padding: 5px 0 0 0;
}
/***************　文字　***************/
.memo-bk10	{
	font-size: 10px;
	color: #000000;
	font-family: "ＭＳ Ｐゴシック",Osaka,sans-serif;
	line-height: 14px;
	margin: 2px 3px 2px 3px;
	text-align: left;
}
.memo-g10	{
	font-size: 10px;
	color: #666666;
	font-family: "ＭＳ Ｐゴシック",Osaka,sans-serif;
	line-height: 14px;
	margin: 2px 3px 2px 3px;
	text-align: left;
}
.memo-bl10	{
	font-size: 10px;
	color: #004dff;
	font-family: "ＭＳ Ｐゴシック",Osaka,sans-serif;
	line-height: 14px;
	margin: 2px 3px 2px 3px;
	text-align: left;
}
.memo-rb10	{
	font-size: 10px;
	color: #990000;
	font-family: "ＭＳ Ｐゴシック",Osaka,sans-serif;
	line-height: 14px;
	margin: 2px 3px 2px 3px;
	text-align: left;
}
.memo-bk	{
	font-size: 12px;
	color: #000000;
	font-family: "ＭＳ Ｐゴシック",Osaka,sans-serif;
	line-height: 18px;
	margin: 5px 10px 5px 10px;
	text-align: left;
}
.memo-g	{
	font-size: 12px;
	color: #666666;
	font-family: "ＭＳ Ｐゴシック",Osaka,sans-serif;
	line-height: 16px;
	margin: 5px 10px 5px 20px;
	text-align: left;
}
.memo-bl	{
  font-size: 12px;
	color: #004dff;
	font-family: "ＭＳ Ｐゴシック",Osaka,sans-serif;
	line-height: 16px;
	margin: 5px 10px 5px 10px;
	text-align: left;
}
.memo-re	{
  font-size: 12px;
	color: #ff0000;
	font-family: "ＭＳ Ｐゴシック",Osaka,sans-serif;
	line-height: 16px;
	margin: 5px 10px 5px 10px;
	text-align: left;
}
.memo-bl-titel	{
  font-size: 13px;
	color: #004dff;
	font-family: "ＭＳ Ｐゴシック",Osaka,sans-serif;
	line-height: 15px;
	text-align: left;
	margin: 5px 0 5px 30px;
}

/******** MINIボタン・ナビゲーション *********/
ul.listbt	{
	font-size: 14px;
	text-align: center;
	padding: 0px;
	margin: 0px;
}
ul.listbt li	{
	width: 160px;
	line-height: 31px;
	list-style-type: none;
	padding: 0px;
	margin: 5px 10px 10px 24px;
	-webkit-box-shadow: 2px 2px 4px #d2d2d2;
	-moz-box-shadow: 2px 2px 4px #d2d2d2;;
	box-shadow: 2px 2px 4px #d2d2d2;
	border-radius: 4px;
	border: solid 1px #005087;
}
ul.listbt li a:link	{
	color: #ffffff;
	text-decoration: none;
	display: block;
	background-color: #017acd;
}
ul.listbt li a:visited	{
	color: #ffffff;
	text-decoration: none;
	display: block;
	background-color: #017acd;
}
ul.listbt li a:hover	{
	background-color: #005087;
}

/********** Free 角丸Box枠 ***********/
/** グレー **/
.b-line-gr01	{
	border: solid 1px #aaaaaa;
	border-radius: 6px;
	background-color: #fbfbfb;
	margin: 7px 10px 7px 10px;
	padding: 7px;
}
/** グレーBox内カラー無し **/
.b-line-gr03	{
	border: solid 1px #aaaaaa;
	border-radius: 6px;
	background-color: #;
	margin: 7px 10px 7px 10px;
	padding: 7px;
}
/** オレンジ **/
.b-line-or01	{
	border: solid 1px #ff6600;
	border-radius: 6px;
	background-color: #fbfbfb;
	margin: 7px 10px 7px 10px;
	padding: 7px;
}
/** 青 **/
.b-line-b01	{
	border: solid 1px #1f6bff;
	border-radius: 6px;
	background-color: #fbfbfb;
	margin: 7px 10px 7px 10px;
	padding: 7px;
}

/*------　スペース　-------*/
.space-5	{
	width: 200px;
	height: 5px;
	border-style: none;
	margin-top: 0px;
	margin-bottom: 0px;
}
.space-1	{
	width: 200px;
	height: 1px;
	border-style: none;
	margin-top: 0px;
	margin-bottom: 0px;
}
.space-2	{
	width: 200px;
	height: 2px;
	border-style: none;
	margin-top: 0px;
	margin-bottom: 0px;
}

div#m-footer	{
	clear: both;
	height:5px;
	margin: 0;
}

hr {
	border: none;
	height: 2px;
	background: linear-gradient(90deg,rgba(184,151,242,0.1)0%,rgba(184,151,242,1)50%,rgba(184,151,242,0.1)100%);
}
/*------　フッター　-------*/

.bec-footer	{
	width: 100%;
	display: inline-block;
	text-align: center;
	background-image: url(../button/bec-wall2022b.png);
	margin: 0;
	padding: 3px 10px 0 10px;
}
.endline	{
	height: 7px;
	background-color: #014471;
	background-image: url(../button/bottom-line-blue.png);
	background-repeat: repeat-x;
	margin: -5px 0 0 0;
}

