@charset "UTF-8";

/* 養生寺について */
@media (min-width: 768px) {
	.p_class{ margin: 0 30px 50px 40px; line-height: 2.2;}
	
	.img_flex{ display: flex; align-items: center;}
	.img_flex>div{ width: 60%;}
	.img_flex>div:last-child{ width: 40%; padding: 0 0 0 30px;}
	.img_flex>div img{ width: 100%;}
	.img_flex>div:last-child>div{ padding: 10px; border-radius: 20px; margin: 20px 0; text-align: center;}
	.img_flex span{ display: block; text-align: center; font-size: 18px;}

	.title4{ display: inline-block; text-align: center; font-size: 22px; color: #1a3866; margin: 0 auto 10px auto; position: relative;}
	.title4::before{ content: ""; display: inline-block; width: 50px; height: 1px; background-color: #1a3866; position: absolute; left: -70px; top: 50%;}
	.title4::after{ content: ""; display: inline-block; width: 50px; height: 1px; background-color: #1a3866; position: absolute; right: -70px; top: 50%;}

	.white_circle_box{ display: flex; margin: 70px auto 0; text-align: center;}
	.white_circle:first-child{ background-color: #fff; padding: 30px; border-radius: 20px; width: 49%; margin: 0 1% 0 0;}
	.white_circle:last-child{ background-color: #fff; padding: 30px; border-radius: 20px; width: 49%; margin: 0 0 0 1%;}
	.white_circle p{ text-align: center; margin: 0; line-height: 2.2;}
	
	.cherry{ background-image: url("../images/cherry_back2.jpg"); background-repeat: no-repeat; background-size: cover; height: 700px; position: relative; padding-top: 60%;}
	.cherry>div{ position: absolute; left: 120px; top: 80px;}
	.cherry span{ display: block; margin: 30px 0 30px -40px; font-size: 22px;}
	.cherry small{ display: block; margin: 10px 0 0 -40px; font-size: 14px;}
	
	.ilufle{ display: flex;}
	.ilufle img{ width: 180px; margin: 0 0 0 30px;}
}
@media (min-width: 768px) and (max-width: 1110px) {
	.white_circle_box{ display: flex; flex-wrap: wrap;}
	.white_circle:first-child{ width: 100%; margin: 0 0 20px 0;}
	.white_circle:last-child{ width: 100%;}
}
@media (max-width: 767.98px) {
	.scroll_pc .contents_inbox{ padding: 40px 15px 140px;}
	
	.p_class{ margin: 0 0 50px 0;}
	
	.img_flex{ display: flex; flex-wrap: wrap; align-items: center;}
	.img_flex>div{ width: 100%;}
	.img_flex>div:last-child{ width: 100%; padding: 0;}
	.img_flex>div img{ width: 100%;}
	.img_flex>div:last-child>div{ padding: 10px; border-radius: 30px; margin: 20px 0; text-align: center;}
	.img_flex span{ display: block; text-align: center; font-size: 14px;}

	.title4{ display: inline-block; text-align: center; font-size: 17px; color: #1a3866; margin: 0 auto 10px auto; position: relative;}
	.title4::before{ content: ""; display: inline-block; width: 35px; height: 1px; background-color: #1a3866; position: absolute; left: -50px; top: 50%;}
	.title4::after{ content: ""; display: inline-block; width: 35px; height: 1px; background-color: #1a3866; position: absolute; right: -50px; top: 50%;}

	.white_circle_box{ display: flex; flex-wrap: wrap; margin: 10px auto 0; text-align: center;}
	.white_circle:first-child{ background-color: #fff; padding: 20px; border-radius: 30px; width: 100%; margin: 0 0 20px 0;}
	.white_circle:last-child{ background-color: #fff; padding: 20px; border-radius: 30px; width: 100%; margin: 0;}
	.white_circle p{ text-align: center; margin: 0; line-height: 1.8; font-size: 13px;}
	
	.cherry{ background-image: url("../images/cherry_back2.jpg"); background-repeat: no-repeat; background-size: cover; height: 400px; position: relative; padding-top: 60%;}
	.cherry>div{ position: absolute; left: 70px; top: 40px;}
	.cherry span{ display: block; margin: 10px 0 20px -40px; font-size: 16px; text-shadow: 1px 1px 0 #fff, -1px -1px 0 #fff, -1px 1px 0 #fff, 1px -1px 0 #fff, 0px 1px 0 #fff, -1px 0 #fff, -1px 0 0 #fff, 1px 0 0 #fff;}
	.cherry small{ display: block; margin: 10px 0 0 -40px; font-size: 12px; text-shadow: 1px 1px 0 #fff, -1px -1px 0 #fff, -1px 1px 0 #fff, 1px -1px 0 #fff, 0px 1px 0 #fff, -1px 0 #fff, -1px 0 0 #fff, 1px 0 0 #fff;}
	
	.ilufle{ display: flex; flex-wrap: wrap; justify-content: center;}
	.ilufle img{ width: 180px; margin: 15px 0 0 0;}
}


/* ご挨拶 */
@media (min-width: 768px) {
	.greeting_flex{ display: flex;}
	.greeting_flex>div:first-child{ width: calc(100% - 400px);  padding: 0 30px 0 0;}
	.greeting_flex>div:last-child div{ text-align: center; margin: 10px 0 0 0; font-weight: bold;}
	.greeting_flex>div:last-child{ width: 400px;}
	.greeting_flex img{ width: 100%;}
	.greeting_flex .reki{ background-color: #fff; padding: 20px; margin: 20px 0 0 0; border-radius: 20px; font-size: 14px;}
}
@media (min-width: 768px) and (max-width: 1000px) {
	.greeting_flex{ display: flex; flex-wrap: wrap;}
	.greeting_flex>div:first-child{ width: 100%;  padding: 0 0 30px 0;}
	.greeting_flex>div:last-child{ width: 100%;}
}
@media (max-width: 767.98px) {
	.greeting_flex{ display: flex; flex-wrap: wrap;}
	.greeting_flex>div:first-child{ width: 100%;}
	.greeting_flex>div:last-child div{ text-align: center; margin: 10px 0 0 0; font-weight: bold;}
	.greeting_flex>div:last-child{ width: 100%; padding: 0; margin: 30px 0 0 0;}
	.greeting_flex img{ width: 100%;}
	.greeting_flex .reki{ background-color: #fff; padding: 20px; margin: 20px 0 0 0; border-radius: 20px; font-size: 12px;}
}


/* 年間行事 */
@media (min-width: 768px) {
	.schedule_ul{ list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap;}
	.schedule_ul li{ width: 100%; padding: 25px; border-radius: 20px; margin: 0 auto 20px auto; background-color: #fff;}
	.schedule_ul li strong{ display: block; font-size: 20px; margin: 0 0 10px 0;}
	.schedule_ul li strong small{ display: inline-block; margin: 0 0 0 10px; font-size: 18px; font-weight: bold;}
	.schedule_ul .jan strong{ color: #af6767; border-bottom: 1px dashed; padding: 0 0 10px 0;}
	.schedule_ul .mar strong{ color: #81b863; border-bottom: 1px dashed; padding: 0 0 10px 0;}
	.schedule_ul .apr strong{ color: #d094ce; border-bottom: 1px dashed; padding: 0 0 10px 0;}
	.schedule_ul .may strong{ color: #4daf6b; border-bottom: 1px dashed; padding: 0 0 10px 0;}
	.schedule_ul .aug1 strong{ color: #4c9abb; border-bottom: 1px dashed; padding: 0 0 10px 0;}
	.schedule_ul .aug2 strong{ color: #6268c1; border-bottom: 1px dashed; padding: 0 0 10px 0;}
	.schedule_ul .sep strong{ color: #bb8a4c; border-bottom: 1px dashed; padding: 0 0 10px 0;}
	.schedule_ul .oct strong{ color: #bbb74c; border-bottom: 1px dashed; padding: 0 0 10px 0;}
	.schedule_ul .dec strong{ color: #717172; border-bottom: 1px dashed; padding: 0 0 10px 0;}
	.schedule_ul p{ margin: 0;}
}
@media (max-width: 767.98px) {
	.schedule_ul{ list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap;}
	.schedule_ul li{ width: 100%; padding: 20px; border-radius: 20px; margin: 0 auto 20px auto; background-color: #fff;}
	.schedule_ul li:last-child{ margin: 0 auto;}
	.schedule_ul li strong{ display: block; font-size: 16px; margin: 0 0 10px 0;}
	.schedule_ul li strong small{ display: inline-block; margin: 0 0 0 10px; font-size: 12px; font-weight: bold;}
	.schedule_ul .jan strong{ color: #af6767; border-bottom: 1px dashed; padding: 0 0 10px 0;}
	.schedule_ul .mar strong{ color: #81b863; border-bottom: 1px dashed; padding: 0 0 10px 0;}
	.schedule_ul .apr strong{ color: #d094ce; border-bottom: 1px dashed; padding: 0 0 10px 0;}
	.schedule_ul .may strong{ color: #4daf6b; border-bottom: 1px dashed; padding: 0 0 10px 0;}
	.schedule_ul .aug1 strong{ color: #4c9abb; border-bottom: 1px dashed; padding: 0 0 10px 0;}
	.schedule_ul .aug2 strong{ color: #6268c1; border-bottom: 1px dashed; padding: 0 0 10px 0;}
	.schedule_ul .sep strong{ color: #bb8a4c; border-bottom: 1px dashed; padding: 0 0 10px 0;}
	.schedule_ul .oct strong{ color: #bbb74c; border-bottom: 1px dashed; padding: 0 0 10px 0;}
	.schedule_ul .dec strong{ color: #717172; border-bottom: 1px dashed; padding: 0 0 10px 0;}
	.schedule_ul p{ margin: 0; font-size: 13px;}
}


/* 寺内紹介 */
@media (min-width: 768px) {
	.photo_list{ display: flex; flex-wrap: wrap; margin: 0; list-style: none; padding: 0;}
	.photo_list a{ width: 32%; margin: 0 0 15px 0; position: relative;}
	.photo_list a:nth-child(3n+2){ margin: 0 1.5% 15px 1.5%;}
	.photo_list a img{ width: 100%;}
	.photo_list a span{ margin: 3px 0 0 0; display: block; font-size: 14px;}
	.mushimegane { position: absolute; right: 7px; top: 7px; width: 20px!important;}
}
@media (max-width: 767.98px) {
	.photo_list{ display: flex; flex-wrap: wrap; justify-content: space-between; margin: 0; list-style: none; padding: 0;}
	.photo_list a:nth-child(odd){ width: 49%; margin: 0 1% 3% 0; position: relative;}
	.photo_list a:nth-child(even){ width: 49%; margin: 0 0 3% 1%; position: relative;}
	.photo_list a img{ width: 100%;}
	.photo_list a span{ margin: 3px 0 0 0; display: block; font-size: 12px;}
	.mushimegane { position: absolute; right: 5px; top: 5px; width: 20px!important;}
}