@charset "UTF-8";

/* ----------------------------------
リセットCSS
---------------------------------- */
/*#content h2,
#content h3,
#content h4 {
	line-height: 1;
	padding: 0;
	}*/
/* ----------------------------------
全体指定
---------------------------------- */
.content {
	margin-bottom: 40px;
}

.content__inner {
	max-width: 710px;
	margin: auto;
}

@media only screen and (max-width: 659px) {
	.content__inner {
		width: 95%;
	}
}

img {
	vertical-align: bottom;
}

.content h3 {
	margin-bottom: 20px;
}

/* ----------------------------------
ページ内ナビ
---------------------------------- */
.contentNavi {
	overflow: hidden;
	margin-top: 10px;
	margin-bottom: 40px;
	text-align: center;
}

.contentNavi li {
	float: left;
	margin-right: 1%;
	width: calc(100% / 3 - 1%);
}

.contentNavi li a {
	background: #77835B;
	display: block;

	padding: 12px 0;
	text-decoration: none !important;
	color: #fff;
}

.contentNavi li a:hover {
	background: #93a074;
}

.contentNavi .last {
	/*	margin-right: 0;*/
}

@media (max-width: 659px) {
	.contentNavi {
		width: 95%;
		margin: auto;
		margin-bottom: 20px;
	}

	.contentNavi li {
		width: 48%;
		margin-right: 2%;
		margin-bottom: 8px;
	}

	.contentNavi li:last-child {
		margin-right: 0;
	}
}

/* ----------------------------------
見出し
---------------------------------- */
.titleIcon {
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
	/*font-size: 18px;*/
	border-bottom: 1px solid #ccc;
}

.titleIcon:before {
	content: url(../images/title_icon.png);
	display: inline-block;
	margin-right: 5px;
	font-weight: bold;
	margin-right: -16px;
}

.titleIcon span {
	border-bottom: 1px solid #4C5F3F;
	padding-bottom: 5px;
	padding-left: 25px;
	display: inline-block;
	margin-bottom: -1px;
	padding-right: 10px;
	font-weight: bold;
	font-size: 19px;
}

/* ----------------------------------
#season 四季折々の京都
---------------------------------- */
.seasonWrapper {
	background: url(../images/bg_season.jpg);
	padding-bottom: 30px;
}

.springBox,
.summerBox,
.autumnBox,
.winterBox {
	overflow: hidden;
	padding: 0 10px;
}

@media (max-width: 659px) {
	.springBox {}

	.summerBox {
		margin-top: 40px !important;
	}

	.autumnBox {
		margin-top: 40px !important;
	}

	.winterBox {
		margin-top: 40px !important;
	}

	.springBox .photo {
		margin-top: -40px !important;
	}

	.summerBox .photo {
		margin-top: -40px !important;
	}

	.autumnBox .photo {
		margin-top: -80px !important;
	}

	.winterBox .photo {
		margin-top: -40px !important;
	}

	.springBox .text {
		margin-top: -20px !important;
	}

	.summerBox .text {
		margin-top: -60px !important;
	}

	.autumnBox .text {
		margin-top: -30px !important;
	}

	.winterBox .text {
		margin-top: -40px !important;
	}
}

.springBox h4,
.summerBox h4,
.autumnBox h4,
.winterBox h4 {
	margin-bottom: 20px;
}

@media (max-width: 659px) {

	.summerBox h4,
	.winterBox h4 {
		text-align: left !important;
	}
}

.summerBox h4,
.winterBox h4 {
	text-align: right;
}

/* ----- PCだと写真が右 ----- */
.springBox .photo,
.autumnBox .photo {
	float: right;
}

.springBox .text,
.autumnBox .text {
	float: left;
}

@media (max-width: 659px) {

	.springBox .photo,
	.autumnBox .photo {
		float: none;
		text-align: center;
	}

	.springBox .text,
	.autumnBox .text {
		float: none;
	}
}

/* ----- PCだと写真が左 ----- */
.summerBox .photo,
.winterBox .photo {
	float: left;
}

.summerBox .text,
.winterBox .text {
	float: left;
}

@media (max-width: 659px) {

	.summerBox .photo,
	.winterBox .photo {
		float: none;
		text-align: center;
	}

	.summerBox .text,
	.winterBox .text {
		float: none;
	}
}

.springBox .text {
	width: 375px;
	margin-right: 10px;
}

.springBox .photo {
	width: 303px;
}

@media (max-width: 659px) {

	.springBox .text,
	.summerBox .text,
	.autumnBox .text,
	.winterBox .text {
		width: 95% !important;
		margin-left: auto !important;
		margin-right: auto !important;
		/*		margin-top: -30px!important;*/
	}

	.springBox .photo,
	.summerBox .photo,
	.autumnBox .photo,
	.winterBox .photo {
		width: 95% !important;
		margin-left: auto !important;
		margin-right: auto !important;
		/*		margin-top: -30px!important;*/
	}

	.photo img {
		max-width: 100%;
		height: auto;
	}
}

.summerBox .photo {
	width: 300px;
	margin-right: 10px;
	margin-top: 20px;
}

.summerBox .text {
	width: 378px;
}

.autumnBox .text {
	width: 385px;
	margin-right: 10px;
}

.autumnBox .photo {
	width: 295px;
	margin-top: -20px;
}

.winterBox .photo {
	width: 303px;
	margin-right: 10px;
	margin-top: 20px;
}

.winterBox .text {
	width: 375px;
}

/* ----------------------------------
#event 京都イベント情報
---------------------------------- */
#event h3 {
	margin-bottom: 10px !important;
}

/* ----- タブjQuery用 ----- */
.tab {
	list-style: none;
	margin-top: 20px;
	overflow: hidden;
	border-bottom: 1px solid #77835B;
	;
}

@media (max-width: 659px) {
	.tab li {
		width: 48% !important;
		margin-bottom: 5px;
	}
}

.tab li {
	display: block;
	float: left;
	margin-right: 5px;
	width: 135px;
	background: #d0cec9;
	color: #333;
	padding: 10px 0;
	text-align: center;
	font-size: 13px;
	cursor: pointer;
}

.tab li.last {
	margin-right: 0;
}

.tab li:hover,
.tab li.active {
	background: #77835B;
	;
	color: #fff;
}

div.tabContent {
	clear: both;
	margin: 10px 0;
	display: none;
}

div.active {
	display: block;
}

/* ----- カレンダー ----- */
#event h4 {
	background: #e4e4d8;
	color: #333;
	overflow: hidden;
	padding: 7px 10px 5px 10px !important;
}

#event p {
	margin-bottom: 0 !important;
	/*line-height: 16px;*/
}

.month {
	float: left;
	width: 50%;
}

.itagakiEvent {
	float: left;
	width: 50%;
	text-align: right;
	font-size: 12px;
}

.itagakiEvent:before {
	display: inline-block;
	content: url(../images/icon_itagaki.png);
	margin-right: 10px;
	vertical-align: text-top;
}

dl {
	overflow: hidden;
	margin: 5px 0;
	position: relative;
	/* font-size: 1.1em; */
}

#event .day {
	float: left;
	/* width: 131px; */
	text-align: right;
	width: 20%;
}

#event .name {
	float: left;
	margin-left: 4%;
	/* width: 414px; */
	/* 555 - 10 - 131= */
	width: 76%;
}

@media (max-width: 659px) {

	.day,
	.name {
		float: none;
		width: 95%;
		margin-left: auto;
		margin-right: auto;
		text-align: left;
	}

	.name {
		/*margin-left: 0;*/
	}
}

.pointText {
	color: #cc8451;
	font-size: 1em;
}

/* ----------------------------------
#shop
---------------------------------- */
#shop h3 {
	margin-bottom: 10px;
}

#shop {
	overflow: hidden;
}

#shop .leftBox {
	float: left;
	width: 175px;
	margin-right: 15px;
}

#shop .rightBox {
	float: left;
	width: 520px;
	/* 710 - 175 - 15 */
}

@media (max-width: 659px) {
	#shop .leftBox {
		width: 31% !important;
	}

	#shop .leftBox img {
		max-width: 100% !important;
		height: auto;
	}

	#shop .rightBox {
		width: 66% !important;
	}
}

@media (max-width: 500px) {
	#shop .leftBox {
		width: 100% !important;
		float: none;
		text-align: center;
	}

	#shop .leftBox img {
		max-width: 100% !important;
		height: auto;
	}

	#shop .rightBox {
		width: 100% !important;
		float: none;
	}
}

#shop .readmoreKyoto {
	text-align: right;
	/*	position: absolute;
	right: 0;
	bottom: 35px;*/
}

/* ----------------------------------
#blog
---------------------------------- */
#blog #linkBox,
#blog .linkBox {
	overflow: hidden;
	display: block;
}

#blog #linkBox .box {
	overflow: hidden;
}

#blog h3 {
	margin-bottom: 10px;
}

#blog h4 {
	margin-bottom: 10px;
	overflow: hidden;
	font-weight: bold;
}

#blog a {
	color: #4c5f3f;
}

#linkBox .leftBox,
.linkBox .leftBox {
	float: left;
	width: 175px;
	margin-right: 15px;
	position: relative;
}

#linkBox .frameLink:after {
	display: block;
	content: url(../images/blogimg_frame.png);
	position: absolute;
	top: 0;
}

#linkBox .rightBox,
.linkBox .rightBox {
	float: left;
	width: 520px;
	/* 710 - 175 - 15 */
}

#blog .readmoreKyoto {
	width: 100%;
	text-align: right;
	margin-top: 10px;
}

/* ----------------------------------
#link
---------------------------------- */
#link h3 {
	margin-bottom: 10px;
}

#link ul {
	overflow: hidden;
	width: 600px;
	margin: auto;
}

@media (max-width: 659px) {
	#link ul {
		width: 95%;
		margin: auto;
	}

	#link li {
		width: 48% !important;
		margin-right: 2% !important;
		margin-bottom: 20px !important;
	}

	#link li img {
		max-width: 100%;
		height: auto;
		margin: auto;
		display: block;
	}

	#link li:nth-child(even) {
		margin-right: 0 !important;
	}
}

#link li {
	float: left;
	width: 168px;
	margin-right: 25px;
}

#link .list3 {
	margin-right: 0;
}

#link h4 {
	/*font-size: 14px!important;*/
	overflow: hidden;
	color: #4c5f3f;
	margin-top: 10px;
	margin-bottom: 5px;
	font-weight: bold;
}