/* ===========  kyoto original CSS =========== */

@charset "UTF-8";

#main #main_title h2 {
  font-size: 1.7rem;
}

div.kyoto-daichou-nav {
	padding-bottom: 0 !important;
	padding-top: .5em !important;
}

div.kyoto-daichou-nav a {
	font-size: 1.2em;
	text-decoration: underline;
}

div.kyoto-daichou-nav a:hover {
	font-weight: bold;
}

div.image {display:box;
	padding:0% 0% 0% 0%;
}

div.box {margin-right;
}

div.note{font-size: 12px;
}
							
div.text > div {
	margin-bottom: 1.5rem;
}

/* ===========  2 column =========== */

.kyoto-col-2 {
	column-count: 2;
	width: 100%;
	display: grid;
	grid-template-columns: 580px 580px;
	column-gap: 15px;
}

.kyoto-col-2 > section {
	break-inside: avoid;
}

.kyoto-col-2 .text {
	text-align: center;
}
#main .kyoto-col-2 .detail div.line h1 { line-height: initial; }
#main .kyoto-col-2 .detail div.image { padding-bottom: .5rem; }

@media screen and (max-width: 1180px){
	.kyoto-col-2 {
		column-count: 2;
		width: 100%;
		display: grid;
		grid-template-columns: 560px 560px;
		column-gap: 15px;
	}
	.kyoto-col-2 > section {
		break-inside: avoid;
	}
	.kyoto-col-2 .text {
		text-align: center;
	}
	#main .kyoto-col-2 .detail div.line h1 { line-height: initial; }
	#main .kyoto-col-2 .detail div.image { padding-bottom: .5rem; }
}

@media screen and (max-width: 780px){
	.kyoto-col-2 {
		column-count: 2;
		width: 100%;
		display: grid;
		grid-template-columns: 560px;
		column-gap: 15px;
	}
	.kyoto-col-3 > section {
		break-inside: avoid;
	}
	.kyoto-col-3 .text {
		text-align: center;
	}
	#main .kyoto-col-3 .detail div.line h1 { line-height: initial; }
	#main .kyoto-col-3 .detail div.image { padding-bottom: .5rem; }
}



/* ===========  3 column =========== */

.kyoto-col-3 {
	column-count: 3;
	width: 100%;
	display: grid;
	grid-template-columns: 380px 380px 380px;
	column-gap: 15px;
}

.kyoto-col-3 > section {
	break-inside: avoid;
}

.kyoto-col-3 .text {
	text-align: center;
}
#main .kyoto-col-3 .detail div.line h1 { line-height: initial; }
#main .kyoto-col-3 .detail div.image { padding-bottom: .5rem; }

@media screen and (max-width: 1180px){
	.kyoto-col-3 {
		column-count: 3;
		width: 100%;
		display: grid;
		grid-template-columns: 380px 380px;
		column-gap: 15px;
	}
	.kyoto-col-3 > section {
		break-inside: avoid;
	}
	.kyoto-col-3 .text {
		text-align: center;
	}
	#main .kyoto-col-3 .detail div.line h1 { line-height: initial; }
	#main .kyoto-col-3 .detail div.image { padding-bottom: .5rem; }
}

@media screen and (max-width: 780px){
	.kyoto-col-3 {
		column-count: 3;
		width: 100%;
		display: grid;
		grid-template-columns: 380px;
		column-gap: 15px;
	}
	.kyoto-col-3 > section {
		break-inside: avoid;
	}
	.kyoto-col-3 .text {
		text-align: center;
	}
	#main .kyoto-col-3 .detail div.line h1 { line-height: initial; }
	#main .kyoto-col-3 .detail div.image { padding-bottom: .5rem; }
}

/* ===========  4 column =========== */

.kyoto-col-4 {
	column-count: 4;
	width: 100%;
	display: grid;
	grid-template-columns: 280px 280px 280px 280px;
	column-gap: 15px;
}

.kyoto-col-4 > section {
	break-inside: avoid;
}

.kyoto-col-4 .text {
	text-align: center;
}
#main .kyoto-col-4 .detail div.line h1 { line-height: initial; }
#main .kyoto-col-4 .detail div.image { padding-bottom: .5rem; }

@media screen and (max-width: 1180px){
	.kyoto-col-4 {
		column-count: 4;
		width: 100%;
		display: grid;
		grid-template-columns: 280px 280px 280px;
		column-gap: 15px;
	}
	.kyoto-col-4 > section {
		break-inside: avoid;
	}
	.kyoto-col-4 .text {
		text-align: center;
	}
	#main .kyoto-col-4 .detail div.line h1 { line-height: initial; }
	#main .kyoto-col-4 .detail div.image { padding-bottom: .5rem; }
}

@media screen and (max-width: 780px){
	.kyoto-col-4 {
		column-count: 4;
		width: 100%;
		display: grid;
		grid-template-columns: 280px;
		column-gap: 15px;
	}
	.kyoto-col-4 > section {
		break-inside: avoid;
	}
	.kyoto-col-4 .text {
		text-align: center;
	}
	#main .kyoto-col-4 .detail div.line h1 { line-height: initial; }
	#main .kyoto-col-4 .detail div.image { padding-bottom: .5rem; }
}

/* ===========  table layout =========== */

/* --- JMA

#main .detail div.table {
  overflow: auto;
  padding: 0 10px 30px 15px;
}
#main .detail div.table table {
  border-collapse: collapse;
  margin: 10px 0;
  width: 100%;
}
#main .detail div.table table th {
  background-color: #f5f5f5;
}
#main .detail div.table table th, #main .detail div.table table td {
  border: 1px solid #343434;
  font-size: 1rem;
  font-weight: normal;
  padding: 10px;
  vertical-align: top;

*/

#main .detail .kyoto-table {
  overflow: auto;
	margin:auto;
  padding: 0 10px 30px 15px;
}
#main .detail .kyoto-table table {
  border-collapse: collapse;
  margin: 10px 0;
  width: 100%;
}
#main .detail .kyoto-table table th {
  background-color: #efefef;
	font-weight: bold;
}
#main .detail .kyoto-table table th {
  border: 1px solid #343434;
	font-size: 1rem;
  padding: 5px;
	text-align: center;
}
#main .detail .kyoto-table table td {
  border: 1px solid #343434;
	/* width: 9em; */
  font-size: 1rem;
  font-weight: normal;
  padding: 5px;
	text-align: center;
  /* vertical-align: top; */
}

/*	
.kyoto-table {
	width: 100%;
	border-collapse: collapse;
	margin:auto;
	table-layout:fixed;
	word-break:break-all;
  padding: 15px 15px 15px 15px;
}
*/

/*
.kyoto-table th {
	border-collapse: collapse;
	border: 1px #000000 solid;
	text-align:center;
	vertical-align:middle;
	padding: 5px 5px 5px 5px;
}
*/
/*
td.kyoto-table {
	border: 1px #000000 solid;
	text-align:center;
	vertical-align:middle;
	padding: 5px 5px 5px 5px;
}
*/

/* 中央揃え */
.kyoto-center {
  text-align: center;
}

/* 左揃え */
.kyoto-left {
  text-align: left;
}

/* 右揃え */
.kyoto-right {
  text-align: right;
}
/*
.kyoto-table-left th {
	border: 1px #000000 solid;
	text-align:center;
	vertical-align:middle;
	padding: 5px 5px 5px 5px;
}
*/

/*
.kyoto-table-left td {
	border: 1px #000000 solid;
	text-align:left;
	vertical-align:middle;
	padding: 5px 5px 5px 5px;
}
*/

/*
.kyoto-table {
	width:95%;
	margin:auto;
	table-layout:fixed;
	word-break:break-all;	
}

.kyoto-table th {
	border: 1px #000000 solid;
	text-align:center;
	vertical-align:middle;
	padding: 5px 5px 5px 5px;
}

.kyoto-table td {
	border: 1px #000000 solid;
	text-align:center;
	vertical-align:middle;
	padding: 5px 5px 5px 5px;
}
*/

/* ===========  goto Top Page =========== */

.totop {
	position:fixed;
	bottom:15px;
	right:25px;
}
.totop a {
	display:block;
	text-decoration:none;
}
.totop img {
	background:#00CCFF;
}
.totop img:hover {
	background:#3399ff;
}

/* ===========  smooth scrolling =========== */


html{
  scroll-behavior: smooth;
}

/* ========================================================= */



@media screen and (max-width: 800px) {
	.img {
		width: 25%;
	}
}

@media screen and (max-width: 600px) {
	.img {
		width: 40%;
	}
	.image { display:block;
	}
	.box{width:80%;
	}
	.text { width: 100%;
	}
}