/*------*/
.border-ttl{
    margin-bottom: 30px;
}
.border-ttl span{
    font-size:clamp(20px, 1.8vw, 32px);
    display: flex;
    align-items: center; 
    justify-content: center;
}
.border-ttl span:before, .border-ttl span:after {
    border-top: 1px solid;
    content: "";
    width: 1em; 
  }
  .border-ttl span:before {
    margin-right: 1em; 
  }
  .border-ttl span:after {
    margin-left: 1em; 
  }
  
.attention_box {
	padding: 25px 0px 25px 30px;
	letter-spacing: 0;
    margin-bottom: 60px;
}
.attention_box::before{
	content: '';
	background: url(../img/top/icon-attention.svg)no-repeat;
	background-size: contain;
	width:71px ;
	height:71px ;
	display: inline-block;
	margin-top: 7px;
	margin-right: 20px;
}
.attention_box ul{
	width: 90%;
}
.attention_box ul li{
	text-indent: -1em;
  	padding-left: 1em;
}
.goods_menu{
    margin: 60px 0;
}
.goods_menu .sub-title{
    margin-bottom: 30px;
}
.goods_menu ul.send_menu{
    margin-bottom: 30px;
    gap: 1.5vw;
}
.goods_menu .btn_border{
    max-width: 31.5%;
    width: 100%;
    margin: 0 auto;
}
.goods_menu ul.send_menu .btn_border a {
    border: 2px solid var(--site-primary-keycolor);
    color: var(--site-primary-keycolor);
    margin-left: 0;
}
.goods_menu ul.send_menu .btn_border a::after{
    background: url(../img/common/icon_arrow_bottom_color-green.svg)no-repeat;
    width:16px ;
    height: 11px;
    right: 20px;
}
.goods_menu ul.send_menu .btn_border a:hover{
    background:var(--site-primary-keycolor);
    color: #fff;
}
.goods_menu ul.send_menu .btn_border a:hover::after{
    background: url(../img/common/icon_arrow_bottom_color-white.svg)no-repeat;
}

.goods_menu ul.memorial_menu{
    gap:1vw 1.5vw;
}
.goods_menu ul.memorial_menu .btn_border{
    margin: 0;
}
.goods_menu ul.memorial_menu .btn_border a{
    margin-left: 0;
}
.goods_menu ul.memorial_menu .btn_border a::after{
    background: url(../img/common/icon_arrow_bottom_color-pink.svg)no-repeat;
    width:16px ;
    height: 11px;
    right: 20px;
}
.goods_menu ul.memorial_menu .btn_border a:hover::after{
    background: url(../img/common/icon_arrow_bottom_color-white.svg)no-repeat;
}
.goods_content{
    margin-top: 60px;
}
.goods_content .goods_top{
    background:var(--site-primary-keycolor) ;
    color: #fff;
    border-radius: 10px 10px 0 0;
    font-size:clamp(30px, 2.2vw, 40px);
    position: relative;
}

.balloon1 {
    position: absolute;
    right: 43vw;
    display: inline-block;
    padding: 4px 10px;
    min-width: 120px;
    max-width: 100%;
    font-size:clamp(14px, 1.5vw, 20px);
    background: #fdffac;;
    border-radius: 5px;
    top: 50%;
    transform: translateY(-50%);
    color: var(--site-primary-keycolor);
    font-weight: bold;
  }
  .balloon1 em{
    font-size:clamp(16px, 1.5vw, 24px);
  }
  .balloon1 em.dot{
    background-image: radial-gradient(circle at center, var(--site-primary-keycolor) 20%, transparent 20%); /* 点の色とサイズ調整 */
    background-position: top right; /* 点の位置 */
    background-repeat: repeat-x; /* 横方向に繰り返し */
    background-size: 1em 0.3em; /* 点の間隔とサイズ調整 */
    padding-top: .1em; /* 縦方向の位置調整 */
    }
  .balloon1:before {
    content: "";
    position: absolute;
    top: 50%;
    right: -18px;
    margin-top: -12px;
    border: 10px solid transparent;
    border-left: 10px solid #fdffac;
    z-index: 0;
  }


.item_box{
    padding: 50px 60px;
    gap: 1.5vw;
    position: relative;
}
.bg_green_flower{
    background: url(../img/memorial-goods/goods-bg.png)no-repeat;
    background-size:auto;
    background-position: right 5% bottom -11%;
}
.bg_pink_flower{
    background: url(../img/memorial-goods/goods-bg03.png)no-repeat;
    background-size:auto;
    background-position: right 5% bottom -11%;
}
.bg_pink_flower02{
    background: url(../img/memorial-goods/goods-bg02.png)no-repeat;
    background-size:auto;
    background-position: left 5% bottom -11%;
}
#cushion-cover .bg_pink_flower{
    background-position: right 5%  top 40%;
}
#key-ring .bg_pink_flower{
    background-position: right 5%  top 50%;
}
#tote-bag .bg_pink_flower{
    background-position: right 5%  top 22%;
}

.bg_green{
    background-color:#eafdff ;
    overflow: hidden;
}
.bg_pink{
    background-color:#fbefef;


}
.item_box h4{
    color:var(--site-primary-keycolor);
    background: #668cbd24;
    font-size:clamp(22px, 2vw, 32px);
    border-radius: 10px;
    display: flex;
    align-items: center;
    padding: 15px 0 15px 40px;
    margin-bottom: 30px;
    position: relative;
}
.item_box h4 span{
    margin-left: 20px;
    font-size:clamp(14px, 2vw, 18px);
}
.item_box .photo{
    max-width: 450px;
    width: 40%;
}
.item_info{
    width: 57%;
}
.item_info p{
    font-size:clamp(16px, 1.2vw, 18px);
}
p.annotation_txt{
    color: #676767;
    font-size:clamp(14px, 1.2vw, 16px);
    margin: 20px 0 30px;
}
.item_info .price{
    background: #fff;
    display: inline-block;
    font-size:clamp(12px, 1.5vw, 16px);
    padding: 5px 28px 10px 33px;
}
.item_info .price .num{
    font-size:clamp(20px, 1.5vw, 32px);
}
.item_info .price .yen{
    font-size:clamp(16px, 1.5vw, 24px);
}
.item_info h5{
    font-size:clamp(18px, 1.3vw, 21px);
    font-weight: bold;
}
.round{
    border-radius: 50px;
    
    display: inline-block;
    padding: 4px 25px;
    margin-bottom: 15px;
}
.txt_box{
    margin-bottom: 30px;
}
.border{
    border: 1px solid #ccc;
}
.detail .wrap{
    align-items: center!important;
}


.goods_content .goods_top02{
    background:var(--site-main-color) ;
    color: #fff;
    border-radius: 10px 10px 0 0;
    font-size:clamp(30px, 2vw, 40px);
}

.item_box.memorial h4{
    color:var(--site-main-color);
    background: #f8fae2;
}
.item_box .photo.popular{
    position: relative;
}
.item_box .photo.popular::before{
    content: '';
    background: url(../img/memorial-goods/icon-popularity.svg) no-repeat;
    width: 107px;
    height: 125px;
    position: absolute;
    left: 0px;
    top: 0;
    z-index: 10;
}


#basket .detail li:first-child{
    margin-bottom: 30px;
}
#buddhist .prices{
    display: flex;
    flex-direction: row;
    gap: 1vw;
    margin-top: 20px;
}
.item_box h4 span.size_small{
    font-size:clamp(20px, 1.3vw, 30px);
}
#key-chain .price,
#key-chain_large .price,
#pendant .price,
#memorial-box .price{
    margin-top: 30px;
}
#memorial-box p.annotation_txt{
    margin: 0;
}
#memorial-box .txt02{
    margin: 20px 0;
}
.small_box{
    margin-top: 60px;
}
.small_box h5{
    background:var(--site-main-color) ;
    color: #fff;
    font-size:clamp(18px, 1.3vw, 28px);
    padding: 5px 0 7px ;
}
.small_box ul{
    padding: 30px 50px;
}
#acrylic-tablet li:first-child{
    margin-bottom: 30px;
}
#acrylic-tablet .small_box li{
    width: 10%;
}
#acrylic-tablet .small_box li img{
    margin-bottom: 10px;
}
#urn-cover p.annotation_txt{
    margin: 0;
}
#urn-cover.txt01{
    margin: 20px 0;
}

#urn-cover-point .txt_box p{
    margin-bottom: 15px;
}

#cushion-cover .small_box li{
    width: 10%;
}
#cushion-cover .small_box li img{
    margin-bottom: 10px;
}
#cushion .item_box li{
    margin-bottom: 30px;
}
#cushion .item_info .price{
    margin-top: 20px;
}
#cushion p.annotation_txt,
#memorial-cushion p.annotation_txt{
    margin: 0;
}
#cushion .txt01,
#memorial-cushion .txt01{
    margin-top: 20px;
}
#memorial-cushion li h5{
    margin-bottom: 20px;
}
#memorial-cushion li .size{
    margin-bottom: 20px;
}
#memorial-cushion .item_info li{
    margin-bottom: 30px;
}

#diatomite li{
    margin-bottom: 30px;
}
#urn-purse .price{
    margin-top: 30px;
}

#urn-bag .item_info h5{
    margin-bottom: 20px;
}
#urn-bag .item_info p{
    margin-bottom: 20px;
}
#urn-bag .item_info .price p{
    margin-bottom: 0px;
}

#blanket .small_box li,
#tote-bag .small_box li{
    width: 22%;
    margin-bottom: 10px;
}
#blanket .small_box li p,
#tote-bag .small_box li p{
    margin: 10px 0 20px;
}
#blanket details,
#tote-bag details{
    background:#ecd6c6;
    border-radius: 10px;
    padding:0 40px 40px;
}
#blanket details h5,
#tote-bag details h5{
    background: none;
    color: #333;
}
#blanket .small_box,
#tote-bag .small_box{
    padding-bottom: 40px;
}
#tote-bag .small_box ul{
    max-width: 85%;
    margin: 0 auto;
}
#tote-bag .small_box li{
    width:22% ;
    margin-bottom: 20px;
}

#blanket .accordion-container p,
#blanket .accordion-container img,
#tote-bag .accordion-container p,
#tote-bag .accordion-container img{
    margin-bottom: 30px;
}

.order {
    display: inline-block;
    padding: 4px 10px 6px;
    min-width: 95px;
    max-width: 100%;
    font-size:clamp(14px, 1.5vw, 18px);
    background: var(--site-main-color);
    border-radius: 5px;
    color: #fff;
    font-weight: bold;
    position: relative;
    margin-right: 10px;
  }

  .order:before {
    content: "";
    position: absolute;
    top: 50%;
    right: -18px;
    margin-top: -12px;
    border: 10px solid transparent;
    border-left: 10px solid var(--site-main-color);
    z-index: 0;
  }




/*-----------------------------------
アコーディオン
-------------------------------------*/
.accordion {
	margin-left: auto;
	margin-right: auto;
	max-width: 94%;
	position: relative;
	width: 100%;
  }
  .accordion-container{
	box-shadow:5px 5px 9px #e6e6e6 ;
	border-radius: 10px;
  }
  .accordion-title {
	color: #333;
	cursor: pointer;
	font-size: 16px;
	padding: 10px 20px;
  }
  .accordion-content {
	display: none;
	padding:10px 40px 30px;
	
  }
  .accordion-content p {
	font-size: 13px;
	line-height: 1.5;
  }
  
  .accordion-item .accordion-title {
	background: #85c6d1;
	border-radius: 10px;
    color: #333;
  }
  
  
  .accordion-item .accordion-content {
	background: #85c6d1;
	border-radius: 0 0 10px 10px;
  }
  .accordion-item .open{
	border-radius: 10px 10px 0 0 ;
  }
  
  
  .accordion-title {
	position: relative;
	
  }
  .accordion-title::after {
	border-right: solid 2px #333;
	border-top: solid 2px #333;
	content: "";
	display: block;
	height: 8px;
	position: absolute;
	right: 25px;
	top: 38%;
	transform: rotate(135deg);
	transition: transform .3s ease-in-out, top .3s ease-in-out;
	width: 8px;
  }
  .accordion-title.open::after {
	top: 45%;
	transform: rotate(-45deg);
  }
  
  .accordion-content ul{
	background: #fff;
	border-radius: 10px;
	padding: 40px 30px;
	gap: 13px 0;
  }
  .accordion-content ul li{
	width: 14%;
	font-size: 16px;
  }
  .accordion-content ul li a::before{
	content: '';
	background: url(../img/right-arrow.svg)no-repeat;
	background-size: contain;
	width: 19px;
	height: 19px;
	display: inline-block;
	margin-right: 5px;
	vertical-align: baseline;
  }

  @media only screen and (max-width: 1024px) {
    .attention_box {
        padding: 20px;
        letter-spacing: 0;
    }
    .item_box{
        padding: 20px 30px;
    }
    .small_box ul{
        padding: 20px;
    }
    .detail li{
        margin-bottom: 20px;
    }
    .item_box h4{
        padding: 15px 0 15px 20px;
    }
    .small_box li{
        width: 11%;
    }
    .small_box li p{
        font-size: 14px;
        font-weight: bold;
    }
    }
    @media only screen and (max-width: 568px) {
        .border-ttl{
            margin-bottom: 10px;
        }
        .attention_box{
            display: block;
            padding: 20px;
            margin: 20px 0;
        }
        .attention_box::before{
            float: left;
        }
        .attention_box::before,
        .attention_box ul,
        .attention_box ul li{
            padding-left: 0;
        }
        .attention_box ul{
            width: 100%;
        }
        .md_radius_photo{
            margin: 0 -5.7vw 30px;
            width: 100vw;
            border-radius: 0;
        }
        .goods_menu{
            display: none;
        }
        .balloon1{
            min-width: none;
            right: auto;
            left: auto;
            top: 0px;
        }
        .balloon1::before{
            min-width: none;
            right: 50%;
            left: 50%;
            top: auto;
            bottom: -18px;
        transform: rotate(90deg);
        }
        .item_box.memorial h4{
            position: relative;
            font-size: 20px;
        }
        .order{
            position: absolute;
            min-width: none;
            right: auto;
            left: auto;
            top: -20px;
            text-align: center;
            margin-right: 0;
        }
        .order:before{
            min-width: none;
            right: 50%;
            left: 40%;
            top: auto;
            bottom: -18px;
        transform: rotate(90deg);
        }

        .goods_content{
            width: 100vw;
            margin-top:0px ;
        }
        .goods_content .goods_top{
            border-radius: 0;
            padding-top: 20px;
        }
        .item_box h4{
            flex-direction: column;
            padding: 15px 0;
        }
        .item_box h4 span{
            margin-left: 0;
        }
        .item_box{
            padding:30px 20px;
            border-radius: 0;
        }
        .item_box .row,
        .item_box .row-rev{
            flex-direction: column;
        }
        .item_box .photo{
            margin: 0 auto 10px;
            width: 100%;
            max-width: 75%;
        }
        .item_info{
            width: 100%;
        }
        .item_info .price{
            display: block;
            text-align: center;
        }
        .item_info .price .num{
            font-size: 28px;
        }
        .item_info .price .yen{
            font-size: 18px;
        }
        .bg_green_flower,
        .bg_pink_flower,
        .bg_pink_flower02{
            background-image: none;
        }
        .price {
            display: block;
            text-align: center;
            width: 100%;
        }
        .photo p.annotation_txt{
           margin: 20px -10.7vw;
        }
        .txt_box{
            margin-bottom: 20px;
        }
        #basket .detail li:first-child{
            margin-bottom: 20px;
        }
        .goods_content .goods_top02{
            border-radius: 0;
            font-size: 24px;
            padding: 10px 0;
            margin-top: 30px;
        }
        .item_box .photo.popular::before{
            width:53px ;
            height:62px ;
        }
        #buddhist .prices{
            flex-direction: column;
    }
    .item_box h4 span.size_small{
        display: contents;
    }
    .small_box{
        margin-top: 30px;
    }
    .small_box li{
        width: 31%;
        margin-bottom: 20px;
    }
    .small_box ul{
        padding: 20px 20px 0;
    }
    .item_info h5{
        font-size: 16px;
    }
    #memorial-cushion .item_info li h5{
        font-size: 19px;
    }
    #acrylic-tablet .small_box li,
    #cushion-cover .small_box li{
        width: 31%;
    }
    .accordion-content{
        padding: 20px;
    }
    #blanket .small_box, #tote-bag .small_box{
        padding-bottom: 20px;
    }
    #blanket .small_box li, #tote-bag .small_box li{
        width: 48%;
    }
    #tote-bag .small_box ul{
        max-width: 100%;
    }
    #tote-bag .small_box li{
        margin-bottom: 0;
    }
    .detail li:last-child{
        margin-bottom: 0;
    }
    p.annotation_txt{
        font-size: 11px;
    }

    }