@charset "utf-8";
/* ===================================================================
CSS information

 file name  :  location.css
 style info :  スタイル指定
=================================================================== */

p {
	font-family:游ゴシック体, 'Yu Gothic', YuGothic, 'ヒラギノ角ゴシック Pro', 'Hiragino Kaku Gothic Pro', メイリオ, Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
	color:#4c4948;
}

section.pt230 {
	padding-top:230px;
}

#main img.fixImg {
	position:fixed;
	top:0;
	left:0;
	right:0;
	z-index:-1;
}
.txt {
	font-size: 15px;
	color: #262626;
	line-height: 2.5;
	position:relative;
}
.img {
	margin: -6% 0 30px;
}

/*----------conts----------*/
.point {
	display:inline-block;
}

#conts .bgWrap {
    background: url(../../../img/pages/lifeInfo/info_bg.png) no-repeat;
	background-size:100% auto;
}
#conts .contsWrap {
	max-width:1032px;
	margin:0 auto;
	text-align:right;
}
#conts .contsWrap > .point {
	margin:60px 26px 50px 0;
}

#conts .contsWrap .shopping,
#conts .contsWrap .medical,
#conts .contsWrap .park {
	text-align:left;
	margin-bottom:40px;
}
#conts .contsWrap .shopping {
	margin-right:26px;
}
#conts .contsWrap .education {
	text-align:left;
	margin-left:26px;
}
#conts .contsWrap .medical,
#conts .contsWrap .park {
	display:inline-block;
}
#conts .contsWrap .shopping {
	text-align:right;
}
#conts .contsWrap .shopping div,
#conts .contsWrap .medical div,
#conts .contsWrap .park div,
#conts .contsWrap .education div {
	text-align:left;
}
#conts .contsWrap .shopping h3,
#conts .contsWrap .medical h3,
#conts .contsWrap .park h3,
#conts .contsWrap .education h3 {
	font-family: "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "ヒラギノ明朝 ProN W2", "HiraMinProN-W2", "HG明朝B", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
	color:#333;
    font-size: 1.2em;
    font-weight: normal;
    margin-bottom: 15px;
}
#conts .contsWrap .shopping p,
#conts .contsWrap .medical p,
#conts .contsWrap .park p,
#conts .contsWrap .education p {
    font-size: 0.9em;
    margin-bottom: 15px;
    line-height: 1.8;
}
#conts .contsWrap ul li {
	max-width:248px;
	display:inline-block;
	vertical-align:top;
	margin-right:10px;
}
#conts .contsWrap ul li:last-child {
	margin-right:0 !important;
}
/*-shopping-*/
#conts .contsWrap .shopping div {
	max-width:766px;
	display:inline-block;
}

/*-medical-*/
#conts .contsWrap .medical {
	margin-right:20px;
}
#conts .contsWrap .medical div {
	display:inline-block;
}
#conts .contsWrap .medical ul {
	max-width:766px;
	display:inline-block;
}

/*-park-*/
#conts .contsWrap .park div {
	display:inline-block;
}
#conts .contsWrap .park ul {
	max-width:766px;
	display:inline-block;
}

/*-education-*/
#conts .contsWrap .education div {
	max-width:766px;
	display:inline-block;
}


/*-----school-----*/

#conts .contsWrap .school {
	margin:60px 0;
	text-align:center;
}
#conts .contsWrap .school .point {
	margin-right:20px;
}
#conts .contsWrap .school ul {
    display: inline-block;
}
#conts .contsWrap .school ul li {
    max-width: 302px;
    display: inline-block;
	vertical-align:top;
}
#conts .contsWrap .school ul li p {
	text-align:left;
	font-size:0.8em;
	line-height:2;
}
#conts .contsWrap .school ul li p.name {
	font-size:1em;
	text-align:center;
	margin:15px 0;
	line-height:1.5;
}
#conts .contsWrap .school ul li p.name span {
	text-align:center;
}

#conts .contsWrap > ul li .caption,
#conts .contsWrap .urawaArea ul li .caption {
    margin: 2px 0 4px;
}
#conts .contsWrap > ul li .caption span,
#conts .contsWrap .urawaArea ul li .caption span {
	font-size:1.2em;
	font-weight:bold;
}
#conts .contsWrap > .caption {
	padding:0 5px;
}

/*-----point-----*/

.point {
	background:url(../../../img/elements/point_bg.jpg) 0 0 repeat;
	max-width:325px;
	position:relative;
	border-radius:3px;
	-webkit-box-shadow: 0 1px 10px #777;
	-moz-box-shadow: 0 1px 10px #777;
	box-shadow: 0 1px 10px #777;
	color:#333;
	padding:40px 25px;
	vertical-align:top;
	z-index:1;
}
.point p {
	text-align:left;
    font-size: 0.9em;
    letter-spacing: 0.08em;
    line-height: 2;
}
.point strong {
    display: block;
	font-family: "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "ヒラギノ明朝 ProN W2", "HiraMinProN-W2", "HG明朝B", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
	text-align:center;
    font-size: 1.4em;
    font-weight: normal;
    line-height: 1.5;
    margin-bottom: 20px;
}
.point::before {
	content:'';
	display:block;
	width:27px;
	height:27px;
	background: url(../../../img/elements/point_flame.png) no-repeat;
	position:absolute;
	top:10px;
	left:10px;
	z-index:10;
}
.point::after {
	content:'';
	display:block;
	width:27px;
	height:27px;
	-moz-transform: rotate(90deg);
	-webkit-transform: rotate(90deg);
	-o-transform: rotate(90deg);
	-ms-transform: rotate(90deg);
	background: url(../../../img/elements/point_flame.png) no-repeat;
	position:absolute;
	top:10px;
	right:10px;
	z-index:10;
}
.point p::before {
	content:'';
	display:block;
	width:27px;
	height:27px;
	-moz-transform: rotate(180deg);
	-webkit-transform: rotate(180deg);
	-o-transform: rotate(180deg);
	-ms-transform: rotate(180deg);
	background: url(../../../img/elements/point_flame.png) no-repeat;
	position:absolute;
	bottom:10px;
	right:10px;
	z-index:10;
}
.point p::after {
	content:'';
	display:block;
	width:27px;
	height:27px;
	-moz-transform: rotate(270deg);
	-webkit-transform: rotate(270deg);
	-o-transform: rotate(270deg);
	-ms-transform: rotate(270deg);
	background: url(../../../img/elements/point_flame.png) no-repeat;
	position:absolute;
	bottom:10px;
	left:10px;
	z-index:10;
}

/*----------map----------*/

#areaguideArea .mapblock {
	text-align: center;
}


#areaguideArea .mapblock #mNav {
	height: 45px;
	background:#999;
}

#areaguideArea .mapblock #mNav ul {
	margin: 0 auto;
	text-align: center;
	border-left-width: 1px;
	border-left-style: solid;
	border-left-color: #FFF;
	font-size: 0px;
}

#areaguideArea .mapblock{
	cursor:pointer;
}
#areaguideArea .mapblock #mNav ul li:first-child {
	border-left-width: 1px;
	border-left-style: solid;
	border-left-color: #FFF;
}
#areaguideArea .mapblock #mNav li {
	display: inline-block;
	border-right-width: 1px;
	border-right-style: solid;
	border-right-color: #FFF;
	font-size: 14px;
	color: #FFF;
	line-height: 45px;
	padding-left: 35px;
	padding-right: 35px;
	cursor:pointer;
}

#areaguideArea .mapblock #mNav li:hover {
	background-color: #46a0e2;
}
#areaguideArea .mapblock #mNav li.active {
	cursor: default;
	background-color: #46a0e2;
}

#areaguideArea .mapblock #mWrap {
	position:relative;
	width:100%;
	height:540px;
}

#areaguideArea .mapblock #lctMap1 {
	width:100%;
	height:540px;
	margin-bottom:15px;
}

#areaguideArea .mapblock #mSide {
	position: absolute;
	top: 0px;
	right: 0px;
	width: 310px;
	height: 540px;
	padding: 0px 12px 0px 0px;
	background: #fff;
	background: rgba(255, 255, 255, .92);
}

#areaguideArea .mapblock #mSide .sideWrap {
	width: 300px;
	height: 540px;
	outline: none;
	overflow-y: auto;
	position: absolute;
	top: 0;
	left: 10px;
	visibility: hidden;
	padding-top: 20px !important;
	padding-right: 10px;
	padding-bottom: 20px;
	padding-left: 0px;
}

#areaguideArea .mapblock #mSide #side01 {
	visibility:visible;
}

#areaguideArea .mapblock #mSide .sideWrap li {
	cursor: pointer;
	text-align: left;
	padding-bottom: 7px;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #01abac;
	margin-bottom: 7px;
	margin-right: 7px;
	font-size: 14px;
	line-height: 1.7;
}

#areaguideArea #mDtl li {
	float:left;
	margin-right:2px;
}
#areaguideArea .mapblock #mSide .sideWrap li a:hover {
	text-decoration: none;
	opacity: 0.8;
}

#areaguideArea .mapblock #mSide .sideWrap li .num {
	font-size: 12px;
	color: #FFF;
	background-color: #46a0e2;
	padding-top: 3px;
	padding-right: 4px;
	padding-bottom: 3px;
	padding-left: 4px;
}
#areaguideArea .mapblock #mSide .sideWrap li .txt01 {
	color: #333;
	font-size:0.9em;
	line-height:2;
}
#areaguideArea .mapblock #mSide .sideWrap li .txt02{
	color: #333;
	text-align: right;
	display: block;
	font-size:0.9em;
}

#areaguideArea > p.caption {
	margin-bottom:100px;
}


@media screen and (max-width: 1048px) {
#conts .contsWrap .shopping ,
#conts .contsWrap .medical,
#conts .contsWrap .park,
#conts .contsWrap .education {
	display:block;
	text-align:center;
	margin-right:0;
	margin-left:0;
}
#conts .contsWrap .shopping div,
#conts .contsWrap .education div {
	width:100%;
}
}
@media screen and (max-width: 1000px) {
#conts .contsWrap .school .point {
	display:block;
    margin: 0 auto 30px;
}
}
@media screen and (max-width: 780px) {
#conts .contsWrap .shopping ul li,
#conts .contsWrap .education ul li {
	max-width:32.47999999%;
	margin-right:1.282051282%;
}
#conts .contsWrap .medical ul li,
#conts .contsWrap .park ul li {
	max-width:49.011857707%;
	margin-right:1.976284584%;
}
#conts .contsWrap .school .point p {
	padding:0;
}

#conts .contsWrap > div > div h3,
#conts .contsWrap > div > div p {
	padding:0 15px;
}
}
@media screen and (max-width: 768px) {
#areaguideArea .mapblock #mNav li {
    padding-left: 20px;
    padding-right: 20px;
}
}
@media screen and (max-width: 740px) {

#areaguideArea .mapblock {
	text-align: center;
	margin-bottom: 30px;
}
#areaguideArea .mapblock #mNav,
#areaguideArea .mapblock #mNav2,
#areaguideArea .mapblock #mNav3,
#areaguideArea .mapblock #mNav4,
#areaguideArea .mapblock #mNav5 {
	height: auto;
	background-image: url(../img/pages/lifeInfo/map/bg_map.png) ;
	background-repeat: repeat;
	width:100%;
}
#areaguideArea .mapblock #mNav ul,
#areaguideArea .mapblock #mNav2 ul,
#areaguideArea .mapblock #mNav3 ul,
#areaguideArea .mapblock #mNav4 ul,
#areaguideArea .mapblock #mNav5 ul {
	margin: 0 auto;
	text-align: left;
	border-left-width: 1px;
	border-left-style: solid;
	border-left-color: #FFF;
	font-size: 0px;
}
#areaguideArea .mapblock{
	cursor:pointer;
}
#areaguideArea .mapblock #mNav ul li:first-child,
#areaguideArea .mapblock #mNav2 ul li:first-child,
#areaguideArea .mapblock #mNav3 ul li:first-child,
#areaguideArea .mapblock #mNav4 ul li:first-child,
#areaguideArea .mapblock #mNav5 ul li:first-child {
	border-left-width: 1px;
	border-left-style: solid;
	border-left-color: #FFF;
}
#areaguideArea .mapblock #mNav li,
#areaguideArea .mapblock #mNav2 li,
#areaguideArea .mapblock #mNav3 li,
#areaguideArea .mapblock #mNav4 li,
#areaguideArea .mapblock #mNav5 li {
	font-family : YuGothic, '游ゴシック', 'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,Verdana ;
	display: inline-block;
	border-right:#fff 1px solid;
	border-bottom:#fff 1px solid;
	font-size: 10px;
	color: #FFF;
	text-align:center;
	line-height: 1.7;
	padding-left: 2px;
	padding-right: 2px;
	width: 50%;
	box-sizing: border-box !important;
	-moz-box-sizing: border-box !important;
	-webkit-box-sizing: border-box !important;
	padding-top: 10px;
	padding-bottom: 10px;
}
#areaguideArea .mapblock #mNav li.active,
#areaguideArea .mapblock #mNav2 li.active,
#areaguideArea .mapblock #mNav3 li.active,
#areaguideArea .mapblock #mNav4 li.active,
#areaguideArea .mapblock #mNav5 li.active {
	cursor: default;
	background-color: #46a0e2;
}
#areaguideArea .mapblock #mWrap {
	position:relative;
	width:100%;
/*	height:540px;*/
	height:600px;
}
#areaguideArea .mapblock #lctMap1,
#areaguideArea .mapblock #lctMap2,
#areaguideArea .mapblock #lctMap3,
#areaguideArea .mapblock #lctMap4,
#areaguideArea .mapblock #lctMap5 {
	width:100%;
/*	height:540px;*/
	height:600px;
	margin-bottom:15px;
}
#areaguideArea .mapblock #mSide,
#areaguideArea .mapblock #mSide2,
#areaguideArea .mapblock #mSide3,
#areaguideArea .mapblock #mSide4,
#areaguideArea .mapblock #mSide5 {
	position: absolute;
	top: 0px;
	right: 0px;
	width: 110px;
/*	height:540px;*/
	height:600px;
	padding: 0px 12px 0px 0px;
	background: #fff;
	background: rgba(255, 255, 255, .92);
}
#areaguideArea .mapblock #mSide .sideWrap,
#areaguideArea .mapblock #mSide2 .sideWrap,
#areaguideArea .mapblock #mSide3 .sideWrap,
#areaguideArea .mapblock #mSide4 .sideWrap,
#areaguideArea .mapblock #mSide5 .sideWrap {
	width: 100px;
/*	height:540px;*/
	height:600px;
	outline: none;
	overflow-y: auto;
	position: absolute;
	top: 0;
	left: 10px;
	visibility: hidden;
	padding-top: 20px;
	padding-right: 10px;
	padding-bottom: 20px;
	padding-left: 0px;
}
#areaguideArea .mapblock #mSide #side01,
#areaguideArea .mapblock #mSide2 #side01,
#areaguideArea .mapblock #mSide3 #side01,
#areaguideArea .mapblock #mSide4 #side01,
#areaguideArea .mapblock #mSide5 #side01 {
	visibility:visible;
}
#areaguideArea .mapblock #mSide .sideWrap li,
#areaguideArea .mapblock #mSide2 .sideWrap li,
#areaguideArea .mapblock #mSide3 .sideWrap li,
#areaguideArea .mapblock #mSide4 .sideWrap li,
#areaguideArea .mapblock #mSide5 .sideWrap li {
	cursor: pointer;
	text-align: left;
	padding-bottom: 7px;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #01abac;
	margin-bottom: 7px;
	font-size: 10px;
	line-height: 1.7;
}
#areaguideArea #mDtl li {
	float:left;
	margin-right:2px;
}
#areaguideArea .mapblock #mSide .sideWrap li a:hover,
#areaguideArea .mapblock #mSide2 .sideWrap li a:hover,
#areaguideArea .mapblock #mSide3 .sideWrap li a:hover,
#areaguideArea .mapblock #mSide4 .sideWrap li a:hover,
#areaguideArea .mapblock #mSide5 .sideWrap li a:hover {
	text-decoration: none;
	opacity: 0.8;
}
#areaguideArea .mapblock #mSide .sideWrap li .num,
#areaguideArea .mapblock #mSide2 .sideWrap li .num,
#areaguideArea .mapblock #mSide3 .sideWrap li .num,
#areaguideArea .mapblock #mSide4 .sideWrap li .num,
#areaguideArea .mapblock #mSide5 .sideWrap li .num {
	font-size: 10px;
	color: #FFF;
	background-color: #01abac;
	padding-top: 3px;
	padding-right: 4px;
	padding-bottom: 3px;
	padding-left: 4px;
}
#areaguideArea .mapblock #mSide .sideWrap li .txt01,
#areaguideArea .mapblock #mSide2 .sideWrap li .txt01,
#areaguideArea .mapblock #mSide3 .sideWrap li .txt01,
#areaguideArea .mapblock #mSide4 .sideWrap li .txt01,
#areaguideArea .mapblock #mSide5 .sideWrap li .txt01 {
	color: #333;
}
#areaguideArea .mapblock #mSide .sideWrap li .txt02,
#areaguideArea .mapblock #mSide2 .sideWrap li .txt02,
#areaguideArea .mapblock #mSide3 .sideWrap li .txt02,
#areaguideArea .mapblock #mSide4 .sideWrap li .txt02,
#areaguideArea .mapblock #mSide5 .sideWrap li .txt02 {
	color: #333;
	text-align: right;
	display: block;
}
}



@media screen and (max-width: 680px) {

}
@media screen and (max-width: 640px) {
#conts .contsWrap {
	text-align:center;
}
#conts .contsWrap > .point {
    margin: 60px auto 50px;
}

#conts .contsWrap > div > div h3 {
	text-align:center;
}
#conts .contsWrap > div > div h3 br,
#conts .contsWrap > div > div p br {
	display:none;
}

#conts .contsWrap .school .point {
    margin:0 auto 50px;
}
#conts .contsWrap .school ul li {
	margin-right:0 !important;
}
}
@media screen and (max-width: 480px) {
#conts .contsWrap .shopping h3, #conts .contsWrap .medical h3, #conts .contsWrap .park h3, #conts .contsWrap .education h3 {
    font-size: 1.0em;
}
}
@media screen and (max-width: 320px) {
#conts .contsWrap > .point {
    margin: 60px 10px 50px;
}
#conts .contsWrap > .point p {
	text-align:left;
}
#conts .contsWrap > .point p strong {
	text-align:left;
	font-size:1.3em;
}
#conts .contsWrap > .point p br {
	display:none;
}

#conts .contsWrap .school .point {
    margin:0 10px 50px;
}
}