@charset "utf-8";

*{
	margin: 0px;
	padding: 0px;
}

html{
	font-size: 62.5%;
}

body {
	-webkit-text-size-adjust: 100%;
}

body, h1,h2,h3,h4,h5,h6,p,ul,li,dl,dt,dd,td,th{
	color: #000;
	font-size: 1.8rem;
	font-family: 'YakuHanMp', "Noto Serif JP", serif;
	font-weight: 500;
	-webkit-font-feature-settings: "palt" 1;
	font-feature-settings: "palt" 1;
	letter-spacing: 0.08em;
	line-height: 1.5;
	text-align: justify;
	-webkit-text-size-adjust: 100%;
	word-wrap: break-word;
}

/* 画像 */
img{
	vertical-align: middle;
	width: 100%;
	height: auto;
}

a{
	display: block;
}

a img{
	border: none;
	transition: 0.5s;
}

/* テキストリンク */
a:link, a:visited{
	color: #000;
	text-decoration: underline;
}

a:hover{
	filter:Alpha(opacity=50);
	opacity:0.5;
	text-decoration: none;
}


/* 標準設定 */
li{ list-style: none;}
.br_pc { display: block !important;}
.br_tab { display: none !important;}
.br_sp { display: none !important;}

@media screen and (max-width:1024px){
	.br_tab { display: block !important;}
}

@media screen and (max-width:767px){
	body, h1,h2,h3,h4,h5,h6,p,ul,li,dl,dt,dd,td,th{ font-size: 14px;}
	.br_pc { display: none !important;}
	.br_tab { display: none !important;}
	.br_sp { display: block !important;}
}


/*---------------------
スクロールアニメーション
---------------------*/
.is_scrollanime{
	opacity: 0 !important;
	transition: all .8s ease !important;
}

.is_scrollanime.show{
	opacity: 1 !important;
	transform: none !important;
}

.is_rl{         transform: translate(-100px, 0) !important;}
.is_rr{         transform: translate(100px, 0) !important;}
.is_up{         transform: translate(0, 100px) !important;}
.is_down{       transform: translate(0, -100px) !important;}
.is_scaleUp{    transform: scale(.8) !important;}
.is_scaleDown{  transform: scale(1.5) !important;}
.is_rotateL{    transform: rotate(180deg) !important;}
.is_rotateR{    transform: rotate(-180deg) !important;}


/*---------------------
ページトップへ戻る
---------------------*/
#is_pagetop{
	position: fixed;
	right: 4%;
}

#is_pagetop a{
	border: #fff 0.2rem solid;
	border-radius: 50%;
	background: #b2644c;
	width: 40px;
	height: 40px;
	padding: 10px;
	display: block;
}

.arrow{
	border: 0.5rem solid #b2644c;
	border-left-color: #fff;
	border-top-color: #fff;
	width: 15px;
	height: 15px;
	position: absolute;
	top: 26px;
	left: 20px;
	transform: rotate(45deg);
}

@media screen and (max-width:767px){
	#is_pagetop a{
		width: 20px;
		height: 20px;
	}
	
	.arrow{
		width: 10px;
		height: 10px;
		top: 17px;
		left: 13px;
	}
}


/*---------------------
フッター
---------------------*/
.l_footer{
	background: url(../img/bg_footer.jpg) repeat-y top center;
	background-size: 100% auto;
}

.l_footer p{
	color: #fff;
}

.l_footer p a{
	color: #fff;
	display: inline-block;
}

.l_footer h1.is_h1{
	color: #fff;
	font-size: 150%;
	text-align: left;
	padding: 0;
}

.l_footer .is_sponsor{
	border-top: rgba(255, 255, 255, 0.5) 2px dotted;
	margin-top: 20px;
	padding-top: 20px;
}

.l_footer .is_sponsor p{
	font-size: 86%;
}

.l_footer .md_copy{
	font-size: 72%;
	text-align: center;
	background: #ac593f;
	padding: 10px 8%;
}

@media screen and (max-width:767px){
	.l_footer p.is_contact{
		padding-top: 10px;
	}
	
	.l_footer p.is_kome{
		padding-top: 0;
	}
}


/*---------------------
外枠
---------------------*/
.l_main{
	display: block;
	clear: both;
	overflow: hidden;
}

.md_cont{
	max-width: 1200px;
	width: 92%;
	margin: 0 auto;
	padding: 60px 0;
}

@media screen and (max-width:767px){
	.md_cont{
		width: 84%;
		padding: 16% 0;
	}
	
}


/*---------------------
共通
---------------------*/
h1.is_h1{
	color: #bb5d41;
	font-weight: 800;
	font-size: 196%;
	text-align: center;
	padding: 0 0 40px 0;
}

h1.is_h1 br{
	display: none;
}

.is_kome{
	font-size: 72%;
	text-indent: -1em;
	padding-left: 1em;
}

.is_btntxt a{
	color: #c30d23;
	font-weight: 600;
	font-size: 125%;
	text-decoration: underline;
}

.is_btntxt a span{
	position: relative;
}

.is_btntxt a span::after{
	content: "";
	border-top: 2px solid #c30d23;
	border-right: 2px solid #c30d23;
	margin: auto;
	width: 12px;
	height: 12px;
	position: absolute;
	top: 0;
	bottom: 0;
	right: -25px;
	transform: translateY(-2px) rotate(135deg);
	box-sizing: border-box;
}

.is_btntxt a:hover{
	text-decoration: none;
}

.md_btn{
	margin-top: 40px;
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}

.md_btn p{
	width: 48%;
}

.md_btn p a{
	color: #c30d23;
	font-size: 76%;
	text-align: center;
	text-decoration: none;
	display: block;
}

.md_btn p img{
	padding-bottom: 5px;
}

.is_kome.pb10{
	padding-bottom: 10px;
}

.is_komeday{
	text-indent: 5.5em;
}

@media screen and (max-width:767px){
	h1.is_h1{
		font-size: 182%;
		padding: 0 0 20px 0;
	}
	
	h1.is_h1 br{
		display: block;
	}
	
	.md_btn p:nth-child(1){
		width: 100%;
		padding-bottom: 20px;
	}
	
	.md_btn p:nth-child(2){
		width: 100%;
	}
}


/*---------------------
インフォメーション
---------------------*/
.l_gaiyo{
	background: url(../img/bg.jpg) repeat-y top center;
	background-size: 100% auto;
}

.md_news{
	border-top: #ccc 2px dotted;
	border-bottom: #ccc 2px dotted;
	margin-bottom: 80px;
	padding: 20px 40px;
}

.md_news a{
	text-decoration: none;
	padding: 5px 0;
	display: flex;
}

.md_news a p:nth-child(1){
	color: #b2644c;
	font-weight: 600;
	width: 180px;
}

.md_news a p:nth-child(2){
	width: calc( 100% - 220px );
	display: flex;
}

.md_news a p:nth-child(2) img{
	width: 16px;
	padding-left: 10px;
}

@media screen and (max-width:767px){
	.md_news{
		padding: 10px 0;
	}
	
	.md_news a{
		display: block;
	}
	
	.md_news a p:nth-child(1),
	.md_news a p:nth-child(2){
		width: 100%;
	}
}


/*---------------------
宇治十帖スタンプラリー開催概要
---------------------*/
.md_gaiyo{
	border-bottom: #ccc 2px dotted;
	width: 100%;
	margin-bottom: 40px;
}

.md_gaiyo th,
.md_gaiyo td{
	border-top: #ccc 2px dotted;
	padding: 20px;
}

.md_gaiyo th{
	color: #b2644c;
	font-weight: 600;
	text-align: center;
	vertical-align: top;
	width: 200px;
}

.md_gaiyo td{
	width: calc( 100% - 200px );
}

.md_spot{
	border: #ccc 1px solid;
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	margin: 10px 0;
}

.md_spot p:nth-child(1){
	text-align: center;
	width: 180px;
	padding: 5px 10px;
}

.md_spot p:nth-child(2){
	border-left: #ccc 1px solid;
	width: calc( 100% - 180px );
	padding: 5px 10px;
}

.md_present p.is_img{
	line-height: 0.5;
}

.md_present .md_presentmiddle{
	background: url(../img/bg_present_middle.png) repeat-y top center;
	background-size: 100% auto;
	padding: 10px 20px;
}

.md_present dl dt{
	color: #fff;
	font-weight: 600;
	text-align: center;
	background: url(../img/bg_title.png) no-repeat center center;
	background-size: 100% 100%;
	padding: 10px 0;
}

.md_present dl dd{
	color: #b062a3;
	font-weight: 600;
	padding: 10px 0 40px 0;
}

.md_present dl dd .md_experience{
	border-radius: 20px;
	background: #fff5fd;
	margin: 20px 0;
	padding: 15px 20px;
}

.md_present dl dd .md_experience .is_titexperience{
	color: #b062a3;
	font-weight: 600;
	padding: 0 0 10px 0;
}

.md_present dl dd .md_experience ul{
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}

.md_present dl dd .md_experience ul li{
	width: 31%;
	padding: 0 0 20px 0;
}

.md_present dl dd .md_experience ul li .is_titpresent{
	color: #fff;
	font-size: 86%;
	font-weight: 600;
	text-align: center;
	background: #a64a97;
	padding: 5px;
}

.md_present dl dd .md_experience ul li .is_setumeipresent{
	font-size: 72%;
	padding-top: 10px;
}

.md_present dl dd .md_experience ul li .is_setumeipresent strong{
	color: #b062a3;
	font-size: 112%;
	display: block;
}

.md_present dl dd .md_experience ul li .is_shoplist{
	padding-top: 10px;
}

.md_present dl dd .md_experience ul li .is_shoplist a{
	padding-top: 10px;
}

@media screen and (max-width:767px){
	.md_gaiyo th{
		font-size: 125%;
		display: block;
		width: 100%;
		padding: 10px 0;
	}
	
	.md_gaiyo td{
		text-align: center;
		display: block;
		width: 100%;
		padding: 0 0 10px 0;
		border-top: none;
	}
	
	.md_spot p:nth-child(1){
		width: calc(100% - 20px);
	}
	
	.md_spot p:nth-child(2){
		width: calc(100% - 20px);
	    border-left: none;
	    border-top: #ccc 1px solid;
	}
	
	.md_present dl dd .md_experience ul li{
		width: 100%;
	}
	
	.md_present dl dt{
		padding: 5px 0;
	}
	
}


/*---------------------
モデルコース
---------------------*/
.l_course{
	background: url(../img/bg_course.jpg) repeat-y top center;
	background-size: 100% auto;
}

.l_course h1{
	width: 80%;
	margin: 0 auto;
}

.l_course h1 + p{
	text-align: center;
}

.md_course{
	overflow-x: auto;
}

.md_course::-webkit-scrollbar{
	width: 10px;
	height: 5px;
}

.md_course::-webkit-scrollbar-track{
	border-radius: 5px;
	background: #ccc;
}

.md_course::-webkit-scrollbar-thumb{
	border-radius: 1rem;
	--bg-opacity: 1;
	background: #b2644c;
}

.md_course p{
	width: 100%;
	min-width: 800px;
	padding: 20px 0;
}

.md_walking{
	margin-top: 40px;
	position: relative;
}

.md_walking .is_walkingmap{
	width: 100%
}

.md_walking .is_walkingmap_btn{
	position: absolute;
	bottom: 29%;
	right: 2%;
	width: 21.5%
}

@media screen and (max-width:767px){
	.l_course h1{
	    width: 100%;
	}
	
	.l_course h1 + p{
		padding-top: 10px;
	}
	
	.md_walking .is_walkingmap{
		padding-bottom: 10px;
	}
	
	.md_walking .is_walkingmap_btn{
		position: absolute;
		bottom: 17%;
		right: 20%;
		width: 60%;
	
	}

}


/*---------------------
参加方法
---------------------*/
.l_how{
	background: url(../img/bg.jpg) repeat-y top center;
	background-size: 100% auto;
}

.l_how .md_how{
	display: flex;
	flex-wrap: wrap;
}

.l_how .md_how div:nth-child(1){
	width: 47.5%;
	border-right: #ccc 2px dotted;
	margin-right: 2%;
	padding-right: 2%;
}

.l_how .md_how div:nth-child(2){
	width: 47.5%;
}

.l_how .md_how ul li{
	padding: 0 0 40px 0;
}

.l_how .md_how ul li:last-child{
	padding: 0;
}

.l_how .md_how ul li .img_howto01_btn{
	width: 55%;
	margin: -10% 0 0 12%;
	display: block;
}

.l_how .md_how ul + .is_kome{
	text-align: right;
	padding: 20px 0 0 0;
}

@media screen and (max-width:767px){
	.l_how .md_how div:nth-child(1){
		width: 100%;
		border-right: none;
		margin-right: 0;
		padding: 0 0 40px 0;
	}
	
	.l_how .md_how div:nth-child(2){
		width: 100%;
	}
	
	.l_how .md_how ul li .img_howto01_btn{
		width: 88%;
		margin: 0;
		padding: 0 0 0 12%;
	}
	
	
}


/*---------------------
イベント情報
---------------------*/
.l_event{
	background: url(../img/bg_event.jpg) repeat-y top center;
	background-size: 100% auto;
}

.l_event .is_h1:not(:first-child){
	padding-top: 80px;
}

.l_event ul li{
	border: #b58a21 1px solid;
	border-radius: 20px;
	background: #fff;
	margin-bottom: 40px;
	padding: 20px 25px;
}

.l_event ul li:last-child{
	margin-bottom: 0;
}

.l_event ul li h2{
	color: #b58a21;
	font-size: 132%;
	font-weight: 700;
	padding-bottom: 20px;
}

.l_event ul li h2 span{
	color: #fff;
	font-size: 72%;
	background: #b58a21;
	margin: 0 10px 0 0;
	padding: 0 10px;
	display: inline-block;
}

.l_event ul li .md_event{
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	flex-direction: row-reverse;
}

.l_event ul li .md_event div:nth-child(1){
	width: 36%;
}

.l_event ul li .md_event div:nth-child(2){
	width: 60%;
}

.l_event ul li .md_event dl{
	border-top: #b58a21 1px solid;
	margin-top: 10px;
	padding-top: 10px;
}

.l_event ul li .md_event dl dt{
	color: #b58a21;
	font-size: 86%;
	float: left;
}

.l_event ul li .md_event dl dd{
	font-size: 86%;
	padding-bottom: 10px;
}

.l_event ul li .md_event div:nth-child(1) p{
	padding-bottom: 10px;
}

.l_event ul li.is_tyazuna,
.l_event ul li.is_tyazuna .md_event dl{
	border-color: #769319;
}

.l_event ul li.is_tyazuna h2,
.l_event ul li.is_tyazuna .md_event dl dt{
	color: #769319;
}

.l_event ul li.is_museum,
.l_event ul li.is_museum .md_event dl{
	border-color: #f08300;
}

.l_event ul li.is_museum h2,
.l_event ul li.is_museum .md_event dl dt{
	color: #f08300;
}

.l_event ul li.is_project{
	border-color: #92579f;
}

.l_event ul li.is_project h2,
.l_event ul li.is_project .md_event dl dt{
	color: #92579f;
}

.l_event ul li.is_museum .is_tokuten{
	background: #fef4e9;
	margin-top: 10px;
	padding: 10px 15px;
	width: calc( 100% - 30px ) !important;
}

.l_event ul li.is_museum .is_tokuten p{
	color: #f08300;
	padding: 10px 15px;
}

.l_event ul li.is_museum .is_price{
	background: #f08300;
	padding: 10px 15px;
	display: flex;
	flex-wrap: wrap;
}

.l_event ul li.is_museum .is_price p{
	width: 200px;
	padding: 5px 10px;
}

.l_event ul li.is_project .md_event dl{
	border: none;
}

.l_event ul li.is_project .md_event{
	display: block;
}

.l_event ul li.is_project dl dt{
	float: none;
}

.l_event ul li.is_project .is_btntxt a{
	font-size: 100%;
}

.l_event ul li.is_project .is_btntxt a span::after{
	top: 10px;
	transform: translateY(-2px) rotate(45deg);
}

.l_event .is_btntxt a{
	padding: 10px 0 0 0;
}

.l_event .md_event a.pb10{
	padding-bottom: 15px;
}

.l_event ul li .md_event dl dd .is_fax{
	clear: both;
	line-height: 1.4;
	padding: 4px 0 2px 0;
}

.l_event ul li .md_event dl dd .is_fax span{
	display: block;
}

@media screen and (max-width:767px){
	.l_event ul li .md_event{
		display: block;
	}
	
	.l_event ul li .md_event div:nth-child(1),
	.l_event ul li .md_event div:nth-child(2){
		width: 100%;
	}
	
	.l_event .is_btntxt a{
		font-size: 100%;
	}
	
	.l_event ul li.is_project .is_btntxt a span::after{
		width: 8px;
		height: 8px;
		top: 6px;
		right: -15px;
	}
	
	.l_event ul li.is_museum .is_price{
		display: block;
	}
	
	.l_event ul li.is_museum .is_price p{
		width: 70%;
	}
	
}


/*---------------------
注意事項
---------------------*/
.l_attention .is_h1{
	color: #c30d23;
	font-size: 112%;
	font-weight: 500;
	text-align: left;
	padding: 0 0 10px 0;
}

.l_attention li,
.l_attention p,
.l_attention dt,
.l_attention dd{
	font-size: 86%;
}

.l_attention ul{
	padding-bottom: 40px;
}

.l_attention ul li{
	text-indent: -1em;
	padding-left: 1em;
}

.l_attention dl{
	border-top: #ccc 2px dotted;
	padding-top: 30px;
}

.l_attention dl dt{
	color: #c30d23;
	padding-top: 10px;
}


/*--------------------
ポップアップ
--------------------*/
.l_inline{
	position: relative;
	background: #fff;
	max-width: 940px;
	width: 90%;
	height: 80vh;
	margin: 20px auto 0 auto;
	padding: 30px;
}

.md_inline{
	padding-right: 20px;
	overflow-y: scroll;
	height: 80vh;
}

.mfp-close-btn-in .mfp-close{
	color: #fff !important;
}

.mfp-close{
	font-size: 60px !important;
	right: -5px !important;
	top: -10px !important;
	opacity: 1 !important;
}

.mfp-close:hover, .mfp-close:focus{
    opacity: 0.5 !important;
}

.mfp-image-holder .mfp-content{
	margin: 4%;
}

.l_inline .mfp-close{
    top: -50px !important;
}

.mfp-bg{
	background: rgba(178, 100, 76, 0.9) !important;
	opacity: 1 !important;
}

.mfp-figure::after{
	box-shadow: none !important;
}

.mfp-bg.mfp-fadenankai{
	background: #b2644c !important;
}

.mfp-fadenankai.mfp-close-btn-in .mfp-close{
	color: #b2644c !important;
}

.md_inline .is_newsday{
	font-size: 72%;
}

.md_inline .is_newstitle{
	color: #bb5d41;
	font-weight: 800;
	font-size: 150%;
	border-bottom: #ccc 2px dotted;
	margin-bottom: 20px;
	padding-bottom: 20px;
}

.md_inline .is_toilet{
	padding: 20px 0;
}

@media screen and (max-width:767px){
	.l_inline{
		width: 74%;
		height: 70vh;
		margin: 10% auto;
		padding: 6%;
	}
	
	.md_inline{
		height: 63vh;
	}
	
}
