@charset "utf-8";
/*----------------------------------------------------------------------------------------------------------
	スマホ用（～768px）
------------------------------------------------------------------------------------------------------------*/
/*ご連絡から葬儀までの流れ（スマホ）
*************************************************/
ul.ul_flow01 {}
ul.ul_flow01 li {
background-color:#FFF9E5;
width: 100%;
margin: 0 auto 25px auto;
padding: 10px 20px;
}

ul.ul_flow01 li p {font-size: 0.875rem; line-height: 175%; margin: 0.5rem 0 ;}

h3.h3_flow01 {
font-size: 1.25rem;
line-height: 220%;
color: #006A64;
font-weight: bold;
}

h3.h3_flow01 .number {
font-size: 1.15em;
width: 44px;
display: inline-flex;
color: #FFF;
background: url("../image/icn_square01.png") no-repeat left 0 top 50%;
background-size: 44px;
padding: 12px 0 18px 15px;
margin-right: 0.5rem;
}

.ul_flow01 li .ul_flow02 {margin: 10px 0 0 0; font-size:0.875rem; line-height: 170%;}
.ul_flow01 li .ul_flow02 li{
	position: relative;
	padding: 0 0 0.25rem 1rem ;
    margin: 0 ;
    width: 100%;
}
.ul_flow01 li .ul_flow02 li:before{
	position: absolute;
	content: '';
	top: 11px;
	left: 4px;
	width: 4px;
	height: 4px;
	border-radius: 50%;
	background: #1a1a1a;
}
/*葬儀後にやること（スマホ）
*************************************************/
.accordion-list,
.accordion-list02 {width: 100%}
.accordion-list dl,
.accordion-list02 dl {width: 100%; display:inline-block;}
.accordion-list dl,
.accordion-list02 dl {
	position: relative;
	margin: 0 0 16px 0;
	cursor: pointer;
}
.accordion-list dl::after,
.accordion-list02 dl::after {
    position: absolute;
	top: 15px;
	right: 20px;
    display: block;
    width: 14px;
    height: 14px;
    margin: auto;
    content: '＋';
    transform: translateY(-50%);
    color: #FFFFFF;
    font-size: 20px;

}
.accordion-list .open::after,
.accordion-list02 .open::after{
    transform: rotate(-45deg);
    transition: 0.4s;
}
.accordion-list dl dt{
	margin: 0;
	padding: 12px 30px 12px 12px;
	text-shadow: 1px 1px 2px rgba(0,0,0,0.15);
	background-image: linear-gradient(0deg, #006a64, #79b2ad);
	color: #fff;
	/*border-radius: 0 10px 0 0;*/
    border-radius: 0;
}

.accordion-list02 dl dt{
	/*margin: 0;*/
	/*padding: 5px 30px 5px 10px;*/
    font-size: 1.1rem;
	text-shadow: 1px 1px 0 rgba(255,255,255,1);
	background-color: #DCD0A8;
	color: #006A64;
	/*border-radius: 0;*/
    text-align: center;
    font-weight: bold;
}
.accordion-list dl dd,
.accordion-list02 dl dd{
	margin: 0;
	padding: 12px 12px 12px 12px;
	background: #fff;
    border:2px solid #006A64;
    font-size: 0.875rem;
}
.accordion-list02 dl dd {border:2px solid #DCD0A8;}

.accordion-list dl.todo dt,
.accordion-list02 dl.todo dt{position: relative;	padding: 10px 24px 10px 38px;}
.accordion-list dl.todo dd,
.accordion-list02 dl.todo dd {position: relative;	padding: 12px 12px 12px 14px;}

.accordion-list dl.todo dt::before,
.accordion-list dl.todo dd::before{
    font-size: 1.125rem;
    line-height: 1;
    position: absolute;
    top: 16px;
	left: 10px;
    display: block;
    content: '◇';
}
.accordion-list dl.todo dd::before {
    content: '';
    color: #006A64;
}

/*よくある質問の見出し◇なし*/
.accordion-list dl.todo dt.faq::before {
content: '';
}

.accordion-list dl.todo dt.faq {padding: 10px 35px 10px 12px; line-height: 140%;}


/*葬儀プラン（スマホ）
*************************************************/
.plan-block01 {width: 100%; }

.plan-block01 .plan-sougi01 {
    display: block;
    width:100%;
    margin: 0 auto 1rem auto;
    background-color: #FFF;
    box-shadow: 0px 0px 5px 2px rgba(0, 0, 0, 0.2);
    padding: 20px 15px;
}

h4.h4_plan-name01 {
font-size: 1.625rem;
line-height: 140%;
font-weight: bold;
margin: 10px 0 10px 0;
}

.plan-price-block {
    float:right;
    color:#B41A6E;
    margin: 10px 0 0 5px;
    text-align: right;
}

.plan-price-block .plan-price {
    font-size: 3.0rem;
    text-shadow: 5px 3px 0 #CCCCCC ;
}
.plan-price-block .plan-currency {
    font-size: 1.5rem;
    letter-spacing: 3px;
    font-weight: bold;
    margin-right: 5px;
}
.plan-price-block .plan-tax {
    font-size: 1.1rem;
    font-weight: bold;
}

img.plan-flow {max-height: 80px; width: auto;}

.accordion-list02 .ul_com01 {font-size: 0.875rem; line-height: 170%;}

/*葬儀場一覧（スマホ）
*************************************************/
.hall-block01 {width: 100%; }

.hall-block01 .hall-main01 { display: block;
    width:100%;
    margin: 0 auto 1rem auto;
    background-color: #FFF;
    border: 2px solid #006A64;
    padding: 0 0 1rem 0;
    
    }

.hall-name {
    background-color: #006A64;
    color: #FFF9E5;
    position: relative;
    padding: 5px 24px 5px 38px;
    font-size: 1.25rem;
    font-weight: bold;
    letter-spacing: 2px;
}
.hall-name::before{
    font-size: 1.125rem;
    line-height: 1;
    position: absolute;
    top: 10px;
	left: 10px;
    display: block;
    content: '◇';
}

/*.hall-block01 */.hall-main02 { padding: 1rem 15px 1rem 15px; font-size: 0.9rem; line-height: 175%;}

.hall-tag01{
    display: inline-block;
    font-size: 0.81rem;
    margin-bottom: 0.75rem;
}
.tag_green {background-color: #006A64; margin: 0 0.6rem 1rem 0; padding: 0.20rem 0.8rem; color: #FFF; border-radius:24px; white-space:nowrap; }

/*葬儀場一覧スライダー--------------------*/

.hall-block02{
	margin:0 0 2em 0;
	/*box-sizing:border-box;*/
	padding: 0 0.5em;
}
.hall-block02 .carousel{
	width:100%;
	margin:0 auto;
}
.hall-block02 .carousel .item{
	/*padding:5px;
	margin:0 6px;*/
    display: block;
    /*width:100%;*/
    margin: 0 6px 1rem 6px;
    background-color: #FFF;
    border: 2px solid #006A64;
    padding: 0 0 1rem 0;
}


/*ご家族の声（スマホ）
*************************************************/
.voice-block01 {width: 100%; }
ul.ul_voice01 li {
width: 100%;
margin: 0 auto 25px auto;
padding: 10px 3px 10px 3px;
/*border-bottom: 3px #006A64 double;*/
font-size: 0.88rem;
line-height: 165%;
background: url("../image/bg_line_5px_grn.png") repeat-x left 0 top 100%;
}
ul.ul_voice01 li::after{content:".";	display: block;	height:0px;	clear:both;	visibility:hidden;	font-size: 0.1em;	line-height:0;}

ul.ul_voice01 li .voice-user {
    font-size: 1.375rem;
    /*line-height: 160%;*/
    font-weight: bold;
    color: #006464;
    margin-bottom: 1rem;
}

ul.ul_voice01 li p {}

img.img_left_user {
    float: left;
    margin: 0 1rem 1rem 0;
    width:32%; 
    max-width: 130px;
}

img.img_right_user {
    float: right;
    margin: 0 0 1rem 1rem;
    width:32%; 
    max-width: 130px;
}


/*CTAエリア（スマホ）
*************************************************/
.cta-block { text-align: center;}
.lead03 {
    font-size: 1.25rem;
    line-height: 1.5;
    color:#006464;
}
ul.ul_cta-contact {
margin: 0 auto 1rem 0;
width: 100%;
}

ul.ul_cta-contact li {

    margin: 0 0 0.75rem 0;
}
/*お問い合わせ（スマホ）
*************************************************/
#formWrap {
	width:98%;
	/*margin:0 auto;*/
}
.table_contact01{margin-bottom: 0.5rem;}
.table_contact01 th{
	display: block;
	font-weight: bold;
	margin-bottom: 0.5rem;
    padding: 5px 8px;
    background: #FFF9E5;
    position: relative;
}
.table_contact01 td{
	display: block;
	margin-bottom: 1rem;
}
.table_contact01 th .required{
    position: absolute;
    top:10px;
    right: 8px;
	/*display: inline-block;*/
	background: #B41A6E;
	color: #fff;
	font-size: 0.88rem;
	letter-spacing: 1px;
	line-height: 150%;
	padding: 0 6px;
	/*margin: 0 0 0 0.5rem;*/
}
.table_contact01 select,
.table_contact01 input,
.table_contact01 textarea{
	width: 100%;
	padding: 12px;
	border-radius: 3px;
	background: #FFFFFF;
	border: 1px solid #666;
	font-size: 1rem;
	margin-bottom: 0.5rem;
}
.table_contact01 select{/*矢印位置の微調整*/
	border-right: 6px #eeeeee solid;
}
.table_contact01 textarea {
	height:200px;
}
.table_contact01 .radio-box input{
	width: 1rem;
	margin: 0;
}
.table_contact01 .radio-box label{
	margin: 0 1.25rem 0 0;
}

/*フォーム用ボタン*/
input.btn_contact01 {
	display: block;
	width: 100%;
	max-width: 360px;
	height: 30px;
	line-height: 30px;
	border-radius: 15px;
	font-weight: bold;
	color: #232323;
	text-align: center;
	background: #DCD0A8 url("../image/icn_arrow01_wht.png") no-repeat right 20px top 50%;
	background-size: 7px;
	margin: 0 auto 0.7rem auto;
    border: 0;
}

input:hover.btn_contact01{
	position: relative;
	top: 2px;
	box-shadow: none;
}






/*-------------------------------------------------------------------------------------------------------------------------------
	タブレット用（768px～）
---------------------------------------------------------------------------------------------------------------------------------*/
@media print, screen and (min-width:768px){

/*ご連絡から葬儀までの流れ（タブレット）
*************************************************/
ul.ul_flow01 {margin-bottom: 2rem; width: 100%;}
ul.ul_flow01 li {width: 47.5%; display:inline-block;vertical-align: top; margin: 0 1% 1rem 1%;}

/*よくあるご質問（タブレット）
*************************************************/
.accordion-list {
    /*display:flex;*/
    justify-content: space-between;
}
.accordion-list dl{width: 31%; /*display:inline-block;*/vertical-align: top; margin:0 0.5% 1rem 0.5rem;}
.accordion-list02 dl{width: 100%;  margin:0 0 1rem 0;}
.accordion-list dl::after,
.accordion-list02 dl::after {
display: none;
}
/*.accordion-list dl dt,
.accordion-list02 dl dt {
	padding: 12px 30px 12px 16px
}*/
.accordion-list dl dd,
.accordion-list02 dl dd {
	/*padding: 12px 12px 12px 16px;*/
    font-size: 0.975rem;
    line-height: 175%;
}
.accordion-list dl.todo dt {
	padding: 10px 24px 10px 40px;
}
.accordion-list02 dl.todo dt {
	padding: 5px 0 5px 0;
}
.accordion-list dl.todo dd,
.accordion-list02 dl.todo dd {
	padding: 12px 12px 12px 18px;
}
.accordion-list dl.todo dt::before,
.accordion-list dl.todo dd::before{
	left: 16px;
}

/*よくある質問の見出し◇なし*/
.accordion-list dl.todo dt.faq {padding: 10px 10px 10px 12px;}

/*葬儀プラン（タブレット）
*************************************************/
.plan-block01 {
    display: inline-block;
}
.plan-block01 .plan-sougi01 {
    width: 47.5%;
    margin: 0 1% 1rem 1%;
    display: inherit;
    vertical-align: top;
}

.plan-price-block {
    margin: 10px 0 0 0;
}

.plan-price-block .plan-price {
    font-size: 2.2rem;
}

.plan-price-block .plan-currency {
    font-size: 1.2rem;
    letter-spacing: 2px;
}
.plan-price-block .plan-tax {
    font-size: 0.8rem;
}

img.plan-flow {width: 100%;  }

/*葬儀場一覧（タブレット）
*************************************************/
.hall-block01 {display:inline-flex;}
.hall-block01 .hall-main01 {
    width:30.5%;
    margin: 0 1% 1rem 1%;
}


/*ご家族の声（タブレット）
*************************************************/

ul.ul_voice01 li {
float: left;
width: 45%;
margin: 0 2% 25px 2%;
padding: 1.5rem 1rem 10px 1rem;
font-size: 1rem;
line-height: 165%;
background-color: #FFF;
box-shadow: 1px 1px 10px #DCD0A8;
background: none;
border-radius: 10px;
}

/*ul.ul_voice01 li {
width: 90%;
margin: 0 4% 25px 4%;
padding: 10px 3px 10px 3px;
font-size: 1rem;
line-height: 165%;
}*/
ul.ul_voice01 li .voice-user {
    font-size: 1.56rem;
}

img.img_left_user {
    margin: 0 2rem 1rem 0;
    max-width: 160px;
}

img.img_right_user {
    margin: 0 0 1rem 2rem;
    max-width: 160px;
}


/*CTAエリア（タブレット）
*************************************************/
.lead03 {
    font-size: 2.5rem;
}
ul.ul_cta-contact {
 display: flex;
}

ul.ul_cta-contact li {
    width: 46%;
    margin: 1rem 1.5% 1rem 1.5%;
}
/*お問い合わせ（タブレット）
*************************************************/
#formWrap {
	width:100%;
    max-width:880px;
	margin:0 auto;
	color:#555;
	line-height:120%;
	font-size:90%;
}

table.table_contact01 th{
	display: table-cell;
	width: 24%;
	padding: 1rem 1rem 1rem 1rem;
	border-radius:0;
	border-bottom: 3px solid #FFF;
}
table.table_contact01 td{
	display: table-cell;
	padding: 1rem 1rem 1rem 1rem;
	/*background: #F4F4F7;*/
	border-bottom: 3px solid #FFF;
}
.table_contact01 th .required{
    top:1rem;
}

.table_contact01 select, .table_contact01 input, .table_contact01 textarea {
    width: 100%;
    padding: 12px;

    font-size: 1rem;
    margin-bottom: 0.5rem;
}

/*フォーム用ボタン*/
input.btn_contact01 {
    display: inline;
    width:45%;
	/*max-width: 400px;*/
    height: 40px;
	line-height: 40px;
	border-radius: 20px;
    margin: 0 0.5rem;
}

/********/
}








/*-------------------------------------------------------------------------------------------------------------------------------
	PC用（1100px～）
---------------------------------------------------------------------------------------------------------------------------------*/
@media screen and (min-width: 1100px){

/*ご連絡から葬儀までの流れ（PC）
*************************************************/

ul.ul_flow01 li {width: 30%; margin: 0 1% 3rem 1%;}

/*葬儀プラン（PC）
*************************************************/
.plan-block01 {display:inline-flex;}
.plan-block01 .plan-sougi01 {
    width:30.5%;
    margin: 0 1% 1rem 1%;
    display: block
}
.plan-price-block .plan-price {
    font-size: 3.0rem;
}

.plan-price-block .plan-currency {
    font-size: 1.5rem;
    letter-spacing: 3px;
}
.plan-price-block .plan-tax {
    font-size: 0.98rem;
}
.accordion-list02 .ul_com01 {font-size: 0.94rem; }

/*スライダー*/
.hall-block02 .carousel{
width:100%;
max-width: 1164px;
	margin:0 auto 2rem auto;
}

.hall-block02 .carousel .item{

    width:95%;
    margin: 0 1rem 1rem 0rem;
    background-color: #FFF;
    padding: 0 0 1rem 0;
}

/*ご家族の声（PC）
*************************************************/
img.img_left_user {
    margin: 0 2rem 1rem 0;
    max-width: 230px;
}

img.img_right_user {
    margin: 0 0 1rem 2rem;
    max-width: 230px;
}

/*○○○（PC）
*************************************************/

/********/
}

