@charset "utf-8";
/* ===================================================================
 RESET CSS
=================================================================== */
*,
*::before,
*::after{
	box-sizing: border-box;}



/* ===================================================================
 BASE
=================================================================== */
body{
	color:#333;
	background-color:#BACD31;
	background-color:#fff;}


a{text-decoration:none;}
/*a:link {text-decoration:underline;}
a:visited {text-decoration:underline;}
a:hover {text-decoration:underline}
a:active {text-decoration:underline;}*/

/* ===================================================================
 COMMON
=================================================================== */

/*===== TEXT =====*/
p.txt-ctr{
	text-align:center;}

/*===== FLOAT =====*/
.flo-left{float:left;}

.flo-right{float:right;}

.clearfix:after{
content:"";
display:block;
height:0;
clear:both;
overflow:hidden;} /* IE以外のモダンWebブラウザ向け */

.clearfix{display:inline-block;} /* IE7およびMac版IE5向け */

/* Hides from IE-mac \*/
* html .clearfix{height:1%;}
.clearfix{display:block;}
/* End hide from IE-mac */ /* IE6以前向け */


/*===== HR =====*/
hr.hr_main_bdr{
/*	width:1000px;*/
	height: 1px;
	border: none;
	margin:1.0em auto 3.0em auto;
	border-bottom:1px dotted #999;
/*	display:none;*/}




/* ===================================================================
 EACH PAGE - TOPPAGE
=================================================================== */
#box-top-main{
	width:100%;
	background-color:#192232;/*濃紺*/
	padding-top:1.0em;
	padding-bottom:1.0em;}

#box-top-main .row{
	margin-right:0;
	margin-left:0;}



#top-main{
	color:#fff;
	width:100%;
	max-width:1260px;
	margin:0 auto 1.5em;}




/*=== スライド ====*/
#box-main-img{
	position:relative;
	margin:0 auto 2.5em;
	width:100%;
	max-width:1260px;
	max-height:400px;
}

img#h3-img{
	position:absolute;
	top:38%;
	top:0;
	left:0;
	width:100%;
	z-index:70;}

#slide-img{
	z-index:100;}

/*カルーセル・インジケーター*/
.carousel-indicators{
	position:absolute;
	bottom:10px;
	left:50%;
	z-index:90;
	width:60%;
	padding-left:0;
	padding-bottom:0;
	margin-left:-30%;
	margin-bottom:0;
	text-align:center;
	list-style:none;}

.carousel-indicators li{
	display:inline-block;
	width:30px;
	height:5px;
	margin:0px 6px;
	text-indent:-999px;
	cursor:pointer;
	/*background-color:#BACD31;*//*抹茶色(186,205,49,100)*/
	/*background-color:#68721b;*//*濃い緑(104,114,27,100)*/
	/*background-color:#192232;*//*濃紺(25,34,50,100)*/
	background-color:rgba(25,34,50,100);
	border:none;
	border-radius:0;}

.carousel-indicators .active{
	width:30px;
	height:5px;
	margin-top:0;
	margin-bottom:0;
	background-color:#BACD31;/*抹茶色*/}

/*未使用
.carousel-caption{
	position:absolute;
	right:15%;
	bottom:20px;
	left:15%;
	z-index:10;
	padding-top:20px;
	padding-bottom:20px;
	color:#fff;
	text-align:center;
	text-shadow:0 1px 2px rgba(0,0,0,.6);
	background-color:#cc0000;}*/

.carousel-caption .btn{text-shadow:none}

@media screen and (min-width:768px){
	.carousel-control .glyphicon-chevron-left,.carousel-control .glyphicon-chevron-right,.carousel-control .icon-next,.carousel-control .icon-prev{
		width:30px;
		height:30px;
		margin-top:-15px;
		font-size:30px}
	.carousel-control .glyphicon-chevron-left,.carousel-control .icon-prev{
		margin-left:-15px}
	.carousel-control .glyphicon-chevron-right,.carousel-control .icon-next{
		margin-right:-15px}
	.carousel-caption{
		right:20%;
		left:20%;
		padding-bottom:30px;}
	.carousel-indicators{
		bottom:20px;
		bottom:10px;}}


.carousel .item {
    -webkit-transition: opacity 1s; 
    -moz-transition: opacity 1s; 
    -ms-transition: opacity 1s; 
    -o-transition: opacity 1s; 
    transition: opacity 1s;
}
.carousel .active.left {
    left:0;
    opacity:0;
    z-index:2;
}
.carousel .next {
    left:0;
    opacity:1;
    z-index:1;}


/*左右に表示される「前へ」「次へ」の調整(未使用)*/
.carousel-fade .active.left {
        left:0;
        opacity:0;
        -webkit-transition: opacity 1s; /*time < to $.carousel.interval setup */
        -moz-transition: opacity 1s; 
        -ms-transition: opacity1s; 
        -o-transition: opacity 1s; 
        transition: opacity  1s;
        z-index:2;}

.carousel-fade .next {
    left:0;
    opacity:1;
    z-index:1;}

/*=== ／スライドここまで ====*/

/*@media(min-width:736px){
	#top-main{
		max-width:1000px;}}

@media(max-width:735px){
	#top-main{	
		min-width:320px;}}*/


p.p-intro{
	font-weight:normal;
	/*text-align:center;*/
	font-size:110%;
	clear:both;
	margin-bottom:2.0em;}

ul#ul-top-navi{
	list-style:none;
	display:flex;
	justify-content:center;
	flex-wrap:wrap;
	padding-left:0;}

ul#ul-top-navi li{
	width:18%;
	text-align:center;
	font-weight:bold;
	/*padding:1.0em;*/
	margin:0 0.4em;
	background:#bacd31;
}


ul#ul-top-navi li a{
	display:block;
	width:100%;
	padding: 1em 0;
	color:#000;
	background: url(../images/ico_link_btn.gif) 8px 50% no-repeat;
}
ul#ul-top-navi li a:hover{
	color:#23527c;}
/*
ul#ul-top-navi li.tanbo{
background:#cabea8;
}

ul#ul-top-navi li.tanbo a{
	color:#000;
	background: url(../images/mappin.png) 2px 60% no-repeat;
	font-size: 0.92em;
}
*/

p.p-jyosei{
	text-align:center;
	margin-bottom:0em;}



/* ===================================================================
入江追加分
=================================================================== */

/*Carousel見え方改善*/
/*Bootstrap Carousel Fade Transition (for Bootstrap 3.3.x)
  CSS from:       http://codepen.io/transportedman/pen/NPWRGq
  and:            http://stackoverflow.com/questions/18548731/bootstrap-3-carousel-fading-to-new-slide-instead-of-sliding-to-new-slide
  Inspired from:  http://codepen.io/Rowno/pen/Afykb*/
.carousel-fade .carousel-inner .item {
  opacity: 0;
  transition-property: opacity;
}    
.carousel-fade .carousel-inner .active {
  opacity: 1;
}    
.carousel-fade .carousel-inner .active.left,
.carousel-fade .carousel-inner .active.right {
  left: 0;
  opacity: 0;
  z-index: 1;
}    
.carousel-fade .carousel-inner .next.left,
.carousel-fade .carousel-inner .prev.right {
  opacity: 1;
}    
.carousel-fade .carousel-control {
  z-index: 2;
}

/*WHAT IS NEW IN 3.3: "Added transforms to improve carousel performance in modern browsers."
  Need to override the 3.3 new styles for modern browsers & apply opacity*/
@media all and (transform-3d), (-webkit-transform-3d) {
    .carousel-fade .carousel-inner > .item.next,
    .carousel-fade .carousel-inner > .item.active.right {
      opacity: 0;
      -webkit-transform: translate3d(0, 0, 0);
              transform: translate3d(0, 0, 0);
    }
    .carousel-fade .carousel-inner > .item.prev,
    .carousel-fade .carousel-inner > .item.active.left {
      opacity: 0;
      -webkit-transform: translate3d(0, 0, 0);
              transform: translate3d(0, 0, 0);
    }
    .carousel-fade .carousel-inner > .item.next.left,
    .carousel-fade .carousel-inner > .item.prev.right,
    .carousel-fade .carousel-inner > .item.active {
      opacity: 1;
      -webkit-transform: translate3d(0, 0, 0);
              transform: translate3d(0, 0, 0);
    }
}

ul#site_banner{
	list-style:none;
	display:flex;
	justify-content:center;
	flex-wrap:wrap;
	padding-left:0;
	margin: 1em;}

#site_banner li{
	border:1px solid #000;
	margin: 0.2em 0.2em 0em 0.2em ;
}

#site_banner img{
	height: 45px;
}
@media screen and (min-width: 736px) and (max-width: 1120px) {
ul#ul-top-navi li a, ul#ul-top-navi li.tanbo a{
	background-image:none;}
	
#site_banner img{
	height: 40px;}
}

@media(max-width:735px) {
#ul-top-navi li{
	width:90% !important;
	text-align:center;
	font-weight:bold;
	padding-top:1.0em;
	padding-bottom:1.0em;
	border-bottom:1px solid #000;
	margin:0 1%;
	background-color:#bacd31;}
}
/* トップページフロート */
@media(min-width:736px){
	#intro-img{
		float:right;
		width:25%;
		max-width:200px;}
	.p-intro{
		/*float:none;*/
		text-align:left;
		margin: auto 0.5em;}
		}
@media(max-width:735px){
	#intro-img{
		/*float:none;*/
		margin:0 auto 1.0em;
		width:80%;
		display: block;}

	.p-intro{
		/*float:none;*/
		text-align:left;
		width:90%;
		margin: 0em auto;}
		}

/*本文　付箋箇所*/
.husen {
background-color: #bee2ff;
border: 1px solid #dedede;
}


/*===絵図grid===*/
.pict-grid{
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    grid-auto-rows: 2fr;
    grid-gap: 1.5em;
    margin: 1em 1.5em;
	padding: 1em 3em;
}

.pict-grid > div {
    background: #f3f3f2;
    border: 0.3px solid #ddd;
    vertical-align:middle;
   /* min-width: 160px;*/
	object-fit:cover;
}

_:-ms-lang(x)::-ms-backdrop, .pict-grid {
    display: flex;
    -ms-flex-wrap:wrap;
    margin: 0;
}
_:-ms-lang(x)::-ms-backdrop, .pict-grid > div {
    width:200px !important;
    margin: 0.5em;
}

.pict-pict-img {
   width:100% !important;
   vertical-align:middle;
}
.pict-pict-img:hover{
    opacity: 0.6;
    transition-duration: 0.3s;
}

.pict-grid-lead{
	height:auto;
	color:#000;
	padding:0.5em;
	margin:0;
	text-align: center;
}

/*文化財・歴史探訪画面*/
/*=== パンくずリスト ===*/
#honbun-pankuzu ,#honbun-pankuzu-second {
    margin-left : 0;
    padding-left : 0;
    margin-bottom:0;
}
#honbun-pankuzu li ,#honbun-pankuzu-second li {
	display : inline;
	list-style : none;
	margin-right:0.2em;}

#honbun-pankuzu li:after, #honbun-pankuzu-second li:after {
/* △を表示*/
	content : "\025b6";
	font-size : 75%;
	padding-left : 0.5em;
	vertical-align : middle;
	vertical-align : 15%;}

#honbun-pankuzu li:last-child:after ,#honbun-pankuzu-second li:last-child:after {
    content : '';
}
#honbun-pankuzu li:first-child a:before {
    display : inline-block;
    width : 1em;
    height : 1em;
    margin-right : 0.3em;
    margin-bottom : -0.1em;
    /*家アイコン*/
    content : "";
    background : transparent url(/Html/Home/2421605100/topg/images/common/ico_pankuzu_home.gif) no-repeat;
    background-size : contain;
}
#honbun-pankuzu li.home a:hover:before {
    /*家アイコン*/
    background : transparent url(/Html/Home/2421605100/topg/images/common/ico_pankuzu_home_on.gif) no-repeat;
    background-size : contain;
}

#honbun-pankuzu-second li:first-child {
    opacity: 0;
}
#honbun-pankuzu-second li:first-child:before {
    display : inline-block;
    width : 1em;
    height : 1em;
    margin-right : 0.3em;
    margin-bottom : -0.1em;
    /*家アイコン*/
    content : "";
}
#honbun-pankuzu-second li:nth-child(2) a {
    margin-right: 3em;
}

.h4-bunkazai{
	font-size:125%;
	padding:0 0 0.3em 0;
	border-bottom:4px solid #333;
	position:relative;
	margin:1em 0 0 0;}

.h4-bunkazai:after {
	content: " ";
	display: block;
	line-height: 0;
	overflow: hidden;
	position: absolute;
	left: 0;
	bottom: -4px;
	width: 1.0em;
	border-bottom: 4px solid #bacd31;}

.h5-bunkazai{
	font-size:110%;
	margin: 0.5em 1em ;
}

.bunkazai-main {
margin: 1em;
}

.bunkazai-img {
	display: inline-block;
	vertical-align: top;
	margin-left: 5em;
}

.bunkazai-img img {
width:300px;
}

.bunkazai-basic-data{
	display: inline-block;
	margin: 0em 2em;
}

.bunkazai-basic-data tr {
    border-bottom: 1px solid #333;
}

.bunkazai-basic-data td, .bunkazai-basic-data th {
padding: 0.2em  0.5em;
text-align: left;
}

.bunkazai-span {
	color: #000;
	border: 1px solid #000;
	padding: 0.2em  0.5em;
}

.bunkazai-desc {
	display: block;
	width: 95%;
	margin: 1em auto;
}
.bunkazai-rel {
margin: 1em;
}

.btn-honbun {
	margin: 0.5em 2.5em;
    padding: 0.5em;
    width: 200px;
    text-align: center;
    display: inline-block;
    cursor: pointer;
    background-color: #fff;
    border: 1px solid #000;
    border-radius: 5px;
    position: relative;
    vertical-align: top;
}
.btn-honbun:after {
    content: '';
    border-top: 1.5px solid #333;
    border-right: 1.5px solid #333;
    position: absolute;
    top: 1em;
    right: 0.8em;
    width: 0.7em;
    height: 0.7em;
    transform: rotate(45deg);
}

.tanbo-desc {
	display: block;
	width: 90%;
	margin: 1em auto;
}

.tanbo-table {
border:1px solid #ccc;
border-collapse:collapse;
width:960px;
margin: 0.5em auto;
}
.tanbo-table th, .tanbo-table td {
border:1px solid #ccc;
padding:0.5em;
}
.tanbo-table th {
background:rgb(226,240,217);
width:20%;
text-align:left;
}
.tanbo-table caption {
border:1px solid #ccc;
padding:0.3em;
color:#000;
background:rgb(255,242,204);
text-align:center;
font-size:1.25em;
}

.rel-bunkazai {
width:900px;
margin:1em auto;
}

.link-tanbo {
    margin: 0.5em;
    padding: 0.5em;
    width: 250px;
    text-align: center;
    text-decoration:none;
    display: inline-block;
    cursor: pointer;
    color:#333;
    background-color: #fff;
    border: 1px solid #000;
    border-radius: 5px;
}

.link-bunkazai {
    margin: 0.5em;
    padding: 0.5em;
    min-width: 250px;
    text-align: center;
    text-decoration:none;
    display: inline-block;
    cursor: pointer;
    color: #3574ac;
    background-color: #f5f5f5;
    border: 1px solid #ccc;
    border-radius: 5px;
    position: relative;
}

/*===絵図grid===*/
.rel-grid{
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
    grid-auto-rows: 2fr;
    grid-gap: 1em;
    margin: 0.5em;
	padding: 0.5em 1em;
}

.rel-grid > div {
    background: #f3f3f2;
    border: 0.3px solid #ddd;
    vertical-align:middle;
   /* min-width: 160px;*/
	object-fit:cover;
}

_:-ms-lang(x)::-ms-backdrop, .rel-grid {
    display: flex;
    -ms-flex-wrap:wrap;
    margin: 0;
}
_:-ms-lang(x)::-ms-backdrop, .rel-grid > div {
    width:180px !important;
    margin: 0.5em;
}

.rel-img {
   height:130px !important;
   width:100% !important;
   object-fit:cover;
   object-position: 50% 0;
   vertical-align:middle;
}
.rel-img:hover{
    opacity: 0.6;
    transition-duration: 0.3s;
}

.op-top {
   object-position: 50% 0;
}

.op-bottom {
   object-position: 50% 50%;
}

.op-middle {
   object-position: 50% 100%;
}


.rel-grid-lead{
	height:auto;
	color:#000;
	padding:0.5em;
	margin:0;
	text-align: center;
}
.map-point {
width:400px !important;
}
.btn-default {
    border: 1px solid #000;
}
.link-type {
font-weight:bold;
font-size1.1em;
margin:0.2em 0.5em;
}
