@charset "utf-8";
/*
Theme Name: オリジナルテーマ
Version:1.0.0
Author: Detail Drawing
Theme URI: http://detail-drawing.com/
Description: オリジナルテーマ
*/
/*
CSS分割(2/2)
*/
/* --------------------------------------------------

	2. メインエリア(の途中から)

-------------------------------------------------- */

/* 送骨セットPC
------------------------------ */
section.solve article.set_pc,
section.sankotsu-about article.set_pc {
	width: 100%; display: block; margin-bottom: 20px;
}
section.solve article.set_pc img,
section.sankotsu-about article.set_pc img,
section.jumoku-about article.set_pc img,
section.funkotsu-about article.set_pc img {
	width: 100%; display: block; margin-bottom: 20px;
}
/* 送骨セットSP
------------------------------ */
section.solve article.set_sp,
section.sankotsu-about article.set_sp {
	display: none;
}
section.solve article.set_sp img,
section.sankotsu-about article.set_sp img,
section.jumoku-about article.set_sp img,
section.funkotsu-about article.set_sp img {
	display: none;
}

/* スマホ
------------------------------ */
@media only screen and (max-width: 1000px) {
	.btnC {
		margin: 0;
		width: 100%;
	}
	.btnD {
		margin: 0;
		width: 100%;
	}

/* 送骨セットPC
------------------------------ */
section.solve article.set_pc,
section.sankotsu-about article.set_pc {
	display: none;
}
section.solve article.set_pc img,
section.sankotsu-about article.set_pc img,
section.jumoku-about article.set_pc img,
section.funkotsu-about article.set_pc img {
	display: none;
}
/* 送骨セットSP
------------------------------ */
section.solve article.set_sp,
section.sankotsu-about article.set_sp {
	width: 100%; display: block; margin-bottom: 20px;
}
section.solve article.set_sp img,
section.sankotsu-about article.set_sp img,
section.jumoku-about article.set_sp img,
section.funkotsu-about article.set_sp img {
	width: 100%; display: block; margin-bottom: 20px;
}
	
}


/* 散骨・樹木葬でお悩みを解決！
------------------------------ */
section.solve article.pro {
	margin-bottom: 30px;
}
section.solve article.pro figure p {
	text-align: center;
}
section.solve article.service {
	margin-bottom: 30px;
}
section.solve article.service figure p {
	text-align: center;
}
section.solve article.support figure {
	margin-top: 10px;
}
section.solve article.support p {
	color: #f39800;
	font-weight: bold;
	text-align: center;
}

article.news
{
	margin-bottom: 50px;
	background: #fff;
	padding: 5px 0px 0;
}

section.solve article.news ul,
section.sankotsu-course article.news ul {
	background: #fff;
	padding: 5px 5px 0;
}
section.solve article.news li.course,
section.sankotsu-course article.news li.course {
	margin-top: 7px;
	width: 180px;
}
section.solve article.news li.desc,
section.sankotsu-course article.news li.desc {
	width: 390px;
}
section.solve article.news li.last,
section.sankotsu-course article.news li.last {
	padding-bottom: 40px;
}
section.solve article.news li.desc p,
section.sankotsu-course article.news li.desc p{
	font-size: 18px;
	margin-bottom: 0;
}

@media only screen and (max-width: 1000px) {
	section.sankotsu-course article.news {
		margin-bottom: 0;
	}
	section.solve article.news li.course,
	section.sankotsu-course article.news li.course {
		margin-bottom: 10px;
		width: 100%;
	}
	section.solve article.news li.desc,
	section.sankotsu-course article.news li.desc {
		width: 100%;
	}
	
}



/* 粉骨はまごころ込めて行います
------------------------------ */
section.powder figure img {
	margin-top: 7px;
}
section.powder figure p {
	font-size: 18px;
}

/* 選べる粉骨・散骨・樹木葬
------------------------------ */
section.course figure {
	background: #ebf7f5;
	border: 1px solid #cccccc;
	border-radius: 10px;
	margin-bottom: 30px;
	padding: 30px;
}
section.course .img {
	width: 40%;
}
section.course .desc {
	width: 50%;
}
section.course ul {
	margin-top: 20px; 
}
section.course li {
	margin-bottom: 20px;
}
section.course li i {
	color: #ff0000;
	margin-right: 5px;
}
section.sankotsu-course {
	line-height: 1.7em;
}
section.sankotsu-course .txtx {
color: #035aa6;
margin-top: 20px;
margin-bottom: 0px;
}

@media only screen and (max-width: 1000px) {
	section.course .img {
		width: 100%;
		margin-bottom: 30px;
	}
	section.course .desc {
		width: 100%;
	}
}




/* 低価格で自然葬をご提供できる理由
------------------------------ */
section.price article {
	margin-bottom: 30px;
}
section.price table {
	margin-bottom: 10px;
	width: 100%;
}

section.price table th {
	vertical-align: middle;
	padding: 16px;
	text-align: center;
}
section.price td.our {
	background: #ebf7f5;
	color: #0071bc;
	line-height: 2em;
	text-align: center;
}
section.price td.our p {
	color: #ff0000;
	font-size: 18px;
	font-weight: bold;
	margin-bottom: 0;
}
section.price td {
	background: #eeeeee;
	vertical-align: middle;
	padding: 16px;
	text-align: center;
}

section.price .table-price-sankotsu th {
	width: 18%;
}
section.price .table-price-sankotsu td.our {
	width: 30%
}
section.price .table-price-sankotsu td {
	width: 26%;
}

section.price .table-price-jumoku th {
	width: 18%;
}
section.price .table-price-jumoku td.our {
	width: 43%;
}
section.price .table-price-jumoku td {
	width: 43%;
}


/* お客様の声
------------------------------ */
section.voice .customer,
section.lower-voice .customer {
	margin-top: 50px;
}
section.voice figure,
section.lower-voice figure {
	margin-bottom: 30px;
}
section.voice .img,
section.lower-voice .img {
	width: 15%;
}
section.voice .desc,
section.lower-voice .desc {
	width: 75%;
}
section.lower-voice .customer p.name {
	line-height: 1.5em;
	text-align: center;
}

/* 平安堂店長も家族の散骨経験者
------------------------------ */
section.report .img {
	width: 30%;
}
section.report .desc {
	width: 65%;
}

@media only screen and (max-width: 1000px) {
	section.report .img {
		text-align: center;
		width: 100%;
	}
	section.report .img img {
		width: 100%
	}
	section.report .desc {
		width: 100%;
	}	
}



/* 散骨後、自宅で手元供養したい方へ
------------------------------ */
section.after p {
	margin-bottom: 1em;
}
section.after figure p {
	text-align: center;
}







/* ----------------------------------------
　下層ページ
---------------------------------------- */
#contents-lower {
	margin-top: 50px;
}

@media only screen and (max-width: 1000px) {
	#contents-lower {
		margin-top: 20px;
	}
}



/* テーブル設定
------------------------------ */
article.about table {
	margin-bottom: 20px;
	width: 100%;
}
article.about table th {
	background: #ebf7f5;
	line-height: 1.2em;
	padding: 20px;
	text-align: center;
	vertical-align: middle;
	width: 30%;
}
article.about table td {
	line-height: 1.5em;
	padding: 20px;
	vertical-align: middle;
	width: 70%;
}
article.about i {
	margin-right: 5px;
}


/* 散骨コース
------------------------------ */
section.sankotsu-flow .step {
	width: 75%;
}
section.sankotsu-flow .step p {
	margin-bottom: 0.5em;
}
section.sankotsu-flow .img {
	width: 25%;
	margin-bottom: 30px;
}
section.sankotsu-flow .img img {
	width: 100%;
}
section.sankotsu-about article.about {
	margin-bottom: 30px;
}
section.sankotsu-about article.about p {
	font-size: 18px;
	margin-bottom: 0;
}
section.sankotsu-about article.set {
	margin-bottom: 30px;
}
section.sankotsu-about article.after p {
	margin-bottom: 1em;
}
section.sankotsu-timing .desc {
	width: 80%;
}
section.sankotsu-timing .img {
	width: 18%;
}
section.sankotsu-timing .img img {
	width: 100%;
}
section.sankotsu-certificate .box,
section.lower-faq .box {
	background: #ebf7f5;
    border: 1px solid #cccccc;
    border-radius: 10px;
    margin-bottom: 30px;
    padding: 30px;
}
section.sankotsu-certificate .img {
	width: 40%;
}
section.sankotsu-certificate .img img {
	width: 100%
}
section.sankotsu-certificate .desc {
	width: 55%;
}

@media only screen and (max-width: 1000px) {
	section.sankotsu-about article.after figure {
		margin-bottom: 0;
	}
	section.sankotsu-about article.after p {
		margin-bottom: 0;
	}
	section.sankotsu-certificate .img {
		margin-bottom: 20px;
		width: 100%;
	}
	section.sankotsu-certificate .desc {
		width: 100%;
	}
}



/* 樹木葬コース
------------------------------ */
section.jumoku-flow .step {
	width: 75%;
}
section.jumoku-flow .step p {
	margin-bottom: 0.5em;
}
section.jumoku-flow .img {
	width: 25%;
	margin-bottom: 30px;
}
section.jumoku-flow .img img {
	width: 100%;
}
section.jumoku-course article.tree {
	margin-bottom: 50px;
}
section.jumoku-about article.set {
	margin-bottom: 20px;
}
section.jumoku-about article.after p {
	margin-bottom: 1em;
}
section.jumoku-timing .desc {
	width: 80%;
}
section.jumoku-timing .img {
	width: 18%;
}
section.jumoku-timing .img img {
	width: 100%;
}
section.jumoku-certificate .box {
	background: #ebf7f5;
    border: 1px solid #cccccc;
    border-radius: 10px;
    margin-bottom: 30px;
    padding: 30px;
}
section.jumoku-certificate .img {
	width: 40%;
}
section.jumoku-certificate .img img {
	width: 100%
}
section.jumoku-certificate .desc {
	width: 55%;
}

@media only screen and (max-width: 1000px) {
	section.jumoku-about article.after figure {
		margin-bottom: 0;
	}
	section.jumoku-about article.after p {
		margin-bottom: 0;
	}
	section.jumoku-certificate .img {
		margin-bottom: 20px;
		width: 100%;
	}
	section.jumoku-certificate .desc {
		width: 100%;
	}
}


/* 粉骨コース
------------------------------ */
section.funkotsu-flow .step {
	width: 75%;
}
section.funkotsu-flow .step p {
	margin-bottom: 0.5em;
}
section.funkotsu-flow .img {
	width: 25%;
	margin-bottom: 30px;
}
section.funkotsu-flow .img img {
	width: 100%;
}
section.funkotsu-flow .photo p {
	line-height: 1.5em;
}
section.funkotsu-about article.overseas p.emphasis {
	margin-bottom: 0;
}
section.funkotsu-certificate .box {
	background: #ebf7f5;
    border: 1px solid #cccccc;
    border-radius: 10px;
    margin-bottom: 30px;
    padding: 30px;
}
section.funkotsu-certificate .img {
	width: 40%;
}
section.funkotsu-certificate .img img {
	width: 100%
}
section.funkotsu-certificate .desc {
	width: 55%;
}

@media only screen and (max-width: 1000px) {
	section.funkotsu-certificate .img {
		margin-bottom: 20px;
		width: 100%;
	}
	section.funkotsu-certificate .desc {
		width: 100%;
	}
	section.funkotsu-certificate .img img {
		width: 98%;
	}
}



/* 生前予約コース
------------------------------ */
section.seizen-flow .step {
	width: 75%;
}
section.seizen-flow figure.step {
	width: 70%;
}
section.seizen-flow .step p {
	margin-bottom: 0.5em;
}
section.seizen-flow .step p.end {
	margin-top: 20px;
}
section.seizen-flow .img {
	width: 25%;
	margin-bottom: 30px;
}
section.seizen-flow .img img {
	width: 100%;
	height: auto;
}
section.seizen-flow .step i {
	margin-right: 5px;
}
section.seizen-flow figure.img img {
	margin-bottom: 20px;
}
section.seizen-about p.end,
section.flow-set p.end {
	text-align: center;
}

@media only screen and (max-width: 1000px) {
	section.seizen-flow figure.step {
		width: 100%;
	}
	section.seizen-flow figure.img {
		width: 100%;
	}

}



/* 会社案内
------------------------------ */
section.lower-company article.about {
	margin-bottom: 50px;
}
section.lower-company h3.typeA {
	margin-bottom: 20px;
}



/* よくあるご質問
------------------------------ */
section.lower-faq h4.typeA {
	margin-bottom: 20px;
}



/* 粉骨方法
------------------------------ */
section.method-flow .step {
	width: 75%;
}
section.method-flow .step p {
	margin-bottom: 0.5em;
}
section.method-flow .img {
	width: 25%;
	margin-bottom: 30px;
}
section.method-flow .img img {
	width: 100%;
}
section.method-flow h3.typeD,
section.method-UV h3.typeD {
	margin-top: 0;
}
section.method-flow figure,
section.method-UV figure {
	margin-bottom: 50px;
}

@media only screen and (max-width: 1000px) {
	section.method-flow .img {
		margin-bottom: 100px;
	}
	section.method-flow figure.desc,
	section.method-UV figure.desc {
		margin-bottom: 10px;
	}
}




/* ----------------------------------------
　お申込の流れ・粉骨セット
---------------------------------------- */
section.flow-order ul {
	margin-top: 30px;
}
section.flow-order ul li.num {
	width: 5%;
}
section.flow-order ul li.desc {
	width: 95%;
}
section.flow-order ul li {
	line-height: 1.5em;
}
section.flow-order p.end {
	margin-top: 20px;
	margin-bottom: 50px;
}
 

section.flow-set .step {
	width: 75%;
}
section.flow-set figure.step {
	width: 70%;
}
section.flow-set .step p {
	margin-bottom: 0.5em;
}
section.flow-set .step p.end {
	margin-top: 20px;
}
section.flow-set .step h4.typeA {
	margin-bottom: 10px;
}
section.flow-set .img {
	width: 25%;
	margin-bottom: 30px;
}
section.flow-set .img img {
	width: 100%;
	height: auto;
}
section.flow-set .cont {
	margin-top: 50px;
}




/* お問い合わせ・お申込
------------------------------ */
section.flow-order ul li.btnA {
	text-align: left;
}
section.lower-contact article.tel .step,
section.flow-order article.tel .step  {
	width: 75%;
}
section.lower-contact article.tel p,
section.flow-order article.tel p {
	font-size: 24px;
	font-weight: bold;
	padding-top: 60px;
	text-align: center;
}
section.lower-contact article.tel a,
section.flow-order article.tel a {
	color: #000;
	text-decoration: none;
}
section.lower-contact article.tel .img,
section.flow-order article.tel .img {
	width: 25%;
	margin-bottom: 30px;
}
section.lower-contact article.tel .img img,
section.flow-order article.tel .img img{
	width: 100%;
}


@media only screen and (max-width: 1000px) {
	section.lower-contact article.tel p,
	section.flow-order article.tel p {
		padding-top: 0;
		text-align: left;
		line-height: 1.5em;}
	}
	section.lower-contact article.tel ,
	section.flow-order article.tel {
		margin-top: 30px;
	}
}



/* ブログ一覧
------------------------------ */
#area-top-blog {
	background-color: #f2f2f2;
	margin-bottom: 0;
	padding-bottom: 100px;
	padding-top: 100px;
}
#area-top-blog figure {
	background-color: #fff;
	position: relative;
	width: 264px;
}


@media only screen and (max-width: 1000px) {
	#area-top-blog {
		padding-top: 50px;
	}
	#area-top-blog figure.four {
		margin-right: 0;
		margin-bottom: 20px;
		width: 100%;
	}
}




/* ----------------------------------------
  ブログ設定
---------------------------------------- */

/* アーカイブ・カテゴリ・シングルページ
　　共通設定
------------------------------ */
figure.blogCard .thum {
	background: #f2f2f2;
	height: 180px;
}
figure.blogCard .thum img {
	height: 100%;
	object-fit: cover;
	width: 100%;
}
figure.blogCard .category {
	background-color: #0071BB;
	font-size: 18px;
	padding: 5px 10px;
	position: absolute;
	top: 12px;
	left: 16px;
	z-index: 1;
}
figure.blogCard .category a {
	color: #fff;
	text-decoration: none;
}
figure.blogCard .desc {
	padding: 20px 0 0;
}
figure.blogCard .desc p.date {
	font-size: 18px;
	line-height: 1em;
	margin-bottom: 5px;
}
figure.blogCard .desc h3 {
	color: #0071BB;
	font-size: 18px;
	font-weight: bold;
	margin-bottom: 3px;
}
figure.blogCard .desc p.txt {
	font-size: 18px;
	line-height: 1.5em;
	margin-bottom: 0;
}
figure.blogCard a {
	color: #000;
	opacity: 1;
	text-decoration: none;
}

.pinksq {
  width:100%;
  padding:15px;
background-color: #fff2fc;
border: solid 1px #ffc8f4;
border-radius: 10px;
margin-bottom: 20px;
line-height: 200%;
}

.listgrey {
  width:100%;
  padding:15px;
background-color: #f2f2f2;
border: solid 1px #cccccc;
border-radius: 10px;
margin-bottom: 20px;
line-height: 20px;
}
.listgrey ul {
  list-style:none;
}
.listgrey ul li {
  margin-bottom:15px;
  line-height: 2em;
  text-indent:-1em;
  padding-left:1em;
}

@media only screen and (max-width: 1000px) {
}

/* ----------------------------------------
　記事一覧
---------------------------------------- */
#contents-blog {
font-size: 18px;
	background-color: #fff;
	padding-bottom: 100px;
	padding-top: 50px;
}
#contents-blog #main-col {
	width: 650px;
}
#contents-blog #main-col figure {
	background-color: #fff;
	margin-bottom: 50px;
	position: relative;
	width: 300px;
}

@media only screen and (max-width: 1000px) {
	#contents-blog {
		margin-bottom: -100px;	
	}
	#contents-blog #main-col {
		margin-bottom: 50px;
		width: 100%;
	}
	#contents-blog #main-col figure {
		margin-right: 0;
		width: 100%;
	}
}

/* ----------------------------------------
　シングルページ
---------------------------------------- */
#main-col {
	width: 650px;
}
#main-col .post {
	background-color: #fff;
}
#main-col .post img {
	width: 100%;
	height: auto;
}
#main-col #single-nav {
	font-size: 18px;
	margin-top: 50px;
}
#main-col #single-nav .blog-top {
	text-align: center;
	width: 100%;
}
#main-col #single-nav .blog-top a {
	color: #0071BB; 
}
#main-col .post h4 {
	color: #0071BB;
	font-size: 20px;
	margin-bottom: 20px;
	padding: .25em 0 .25em .75em;
	border-left: 5px solid #0071BB;
}
#main-col .post h5 {
	color: #0071BB;
	font-size: 18px;
	font-weight: bold;
	margin-bottom: 20px;
}

@media only screen and (max-width: 1000px) {
	#main-col .post {
		padding: 20px;
	}
}




/* --------------------------------------------------

	3. サイドバー

-------------------------------------------------- */
#side-col {
	width: 300px;
}
#side-col .side-menu {
	background: #f7f7f7;
	border: solid 1px #cccccc;
	padding: 20px;
}
#side-col .side-menu ul li {
	background: url(img/side-arrows.png) left no-repeat;
	border-bottom: dashed 1px #cccccc;
	padding: 16px 0 16px 16px;
}
#side-col .side-menu ul li a {
	color: #000;
	text-decoration: none;
}
#side-col .greeting p.name {
	text-align: right;
}
#side-col .yu-pack .desc {
	margin-top: 30px;
}
#side-col .side-report{margin-bottom: -50px;}

@media only screen and (max-width: 1000px) {
	#side-col {
		width: 100%;
	}
	#side-col .contact img {
		width: 100%;
	}
	#side-col .greeting img {
		width: 100%;
	}
	#side-col .side-report img {
		width: 100%;
	}
	#side-col .yu-pack img {
		width: 100%;
	}
	#side-col .thanks img {
		width: 100%;
	}
}