/* ==========================
   Reset / 基本リセット
========================== */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,form,fieldset,input,textarea,p,blockquote,th,td,img {
    margin: 0;
    padding: 0;
}
address,em {
    font-style: normal;
    background-color: #000000;
    color: #FFFFFF;
}
strong,th {
    font-weight: normal;
}
table {
    border-collapse: collapse;
    border-spacing: 0;
}
th {
    text-align: left;
}
hr,legend {
    display: none;
}
h1,h2,h3,h4,h5,h6 {
    font-weight: bold;
}
img,fieldset {
    border: 0;
}
li {
    list-style-type: none;
}

/* ==========================
   フォント / タイポグラフィ
========================== */
body {
    color: #111;
    font-size: 15px;
    font-family:
    "游明朝", "Yu Mincho", "ヒラギノ明朝 ProN W3",
    "Hiragino Mincho ProN", "ＭＳ 明朝", "MS Mincho",
    serif;
}
/* IE8以前対応 */
body { font-size: 100%\9; }

.important-bold {
    font-weight: bold;
    color: #000c15;
}

/* ==========================
   clearfix
========================== */
.clearfix:after {
    content: '';
    display: block;
    clear: both;
    height:0;
}
.clearfix { zoom: 1; } /* IE7以前 */

/* ==========================
   リンク装飾
========================== */
a {
    border-bottom: none;
    color: #006400;
    text-decoration: none;
}
a:hover {
    color: #CC0033;
    text-decoration: underline;
}

/* ==========================
   フロート
========================== */
.alignleft{
   float:left;
   margin-right:2%;
}
.alignright{
   float:right;
   margin-left:2%;
}


/* ==========================
   文章のデザイン
========================== */


#contents-area-inbox p {
                       margin:2% 0 2% 0;
                       font-size: clamp(15px, 2vw, 18px);
}
#contents-area-inbox h4 {
                         font-size: clamp(20px, 3vw, 26px);
                         clear: both;
                         border-bottom: 1px solid #ddd;
                         margin: 6% 0 2% 0;
                         color: rgba(0, 100, 0, 1); 
}
#contents-area-inbox h5 {
                         font-size: clamp(18px, 2vw, 20px);
                         margin: 2% 0 2% 0;
                         color: rgba(0, 100, 0, 1); 
}
#contents-area-inbox h6 {
                         font-size: clamp(16px, 2vw, 19px);
                         margin: 2% 0 2% 0;
}

/*パン屑リスト 
---------------------------------------------------------------------------------------------------------------------*/
#breadcrumb,
#page-title {
        max-width:1100px;
        margin: 0 auto; }
#breadcrumb ul {
                padding: 20px 0 10px 0;
                text-align: left;             
}
#breadcrumb li {
                display: inline; 
                padding: 2px;
                font-size: clamp(12px, 1.5vw, 14px);
}
#page-title {         
             text-align: left;
}
#page-title h2 {
                font-weight: normal;
                font-size:clamp(20px, 4vw, 32px);
                float: left;
                padding:1% 2% 3% 2%;
}
#page-title h3 {
                font-size: clamp(12px, 2vw, 17px);
                padding-top: 2%;
                                color: rgba(0, 100, 0, 1); 
}


/*コンテンツエリアデザイン
---------------------------------------------------------------------------------------------------------------------*/
#contents-area-inbox {
   max-width:1100px;
   margin:0 auto;
   display: flex;
   align-items: flex-start; 
   gap:1%;          /* ボックス間のスペース */
   flex-wrap: wrap;
   padding-bottom:5%; 
}

#contents-area-inbox .thumbnail-box img {
   width:100%;
   height: auto;
   display: block; 
   box-shadow: 0px 0px 10px 0px #C6C6C6;
   border-radius: 5px;    
}
#main-contents-area-page2,
#main-contents-area-page3,
#main-contents-area-single,
#main-contents-area-single-moji,
#main-contents-area-single-carving,
#main-contents-area-single-voice,
#main-contents-area-single-funeral,
#main-contents-area-single-stone-quetion,
#main-contents-area-single-stone-infomation,
#main-contents-area-single-stone-story {
                                        text-align: left;
                                        background-color: #FFF;    
                                        border: 1px solid #ddd;
                                        border-radius: 10px;
                                        box-shadow: 0px 0px 7px 0px #C6C6C6;
                                        padding: 5%;
                                        margin:0 2% 0 2%; 
                                        flex: 0 0 58%;

}
#main-contents-area-page,
#main-contents-area-moji {
                          text-align: left;
                          background-color: #FFF;    
                          border: 1px solid #ddd;
                          border-radius: 10px;
                          box-shadow: 0px 0px 7px 0px #C6C6C6;
                          padding: 5%;
                          margin:0 2% 0 2%;
                          flex: 0 0 58%; 
}
#main-contents-area-top{
                        text-align: left;
                        margin:0 2% 0 2%;
                        flex: 0 0 65%;
}
#main-contents-area-stone-story,
#main-contents-area-single-column,
#main-contents-area-stone-quetion {
                                   margin: 0 auto;
                                   background-color: #FFF;    
                                   border: 1px solid #ddd;
                                   border-radius: 10px;
                                   box-shadow: 0px 0px 7px 0px #C6C6C6;
                                   padding: 5%;
                                   flex: 0 0 80%;
}
#main-contents-area-blog,
#main-contents-area-stone-infomation,
#main-contents-area-carving {
                          max-width:1000px;
                          margin: 0 auto;
                          text-align: center;
                          margin:0 2% 0 2%; 
}



/* スマホ用レスポンシブ（幅950px以下） */
@media screen and (max-width:950px) {
#contents-area-inbox {
display:block;
}
#main-contents-area-stone-story,
#main-contents-area-single-column,
#main-contents-area-stone-quetion {
    margin:0 2% 0 2%; 
}
.alignleft {
   float:none;
   width:100%;
   text-align:center;
}
.alignright {
   float:none;
   width:100%;
   text-align:center;
}
}




/*ページ送り　navigation
---------------------------------------------------------------------------------------------------------------------*/
.navigation {
	     overflow: hidden;
             margin: 30px 0 30px 0;
	     border-top: 1px solid #ddd;
	     border-bottom: 1px solid #ddd;
	     background-color: #F7F7F7;
             border-top: 1px solid #ddd;
}
.navigation > div {
	        	   width: 48%;
}
.navigation .alignleft {
                        text-align: center;
		                float: left;
}
.navigation .alignright {
		       text-align: center;
                                        float: right;
}
.navigation a { 
	           display: block;
                   height:50px;
                   line-height: 50px; 
	           border: none;
                   -webkit-transition: background-color 0.3s linear
}
.navigation a:hover {
                     color: #FFF;
                     text-shadow: 1px 1px 3px #000;
                     text-decoration: none;
                     background: rgba(0, 153, 0, 1); 
                     text-shadow: 1px 1px 3px #000;
                     text-decoration: none;
}


/*関連する記事
---------------------------------------------------------------------------------------------------------------------*/
.related-posts h3 {
                   width: 95%;
                   display: block;
                   margin: 0 auto;
                   padding: 5px 0 0 5%;
                   height: 35px;
                   text-align: left;
                   font-size: 18px;
                   font-weight: normal;
	           border-top-left-radius: 8px;
	           border-top-right-radius: 8px;
                   border: 1px solid #ddd;
	           background-color: #B8B8B8;
                   color: #FFF;
                   text-shadow: 1px 1px 3px #000;
}   
.related-posts ul {
                   margin-top: -1px; 
	           border-bottom-right-radius: 8px;
	           border-bottom-left-radius: 8px;
                   width: 100%;
                   text-align :center;
                   margin: 0 auto; 
                   border: 1px solid #ddd;
                   background-color: #F7F7F7;
}                             
.related-posts li {
                   display: inline;
                   float: left;
                   width: 30%;
                   margin: 3% 1.6% 3% 1.6%;
} 
                     
.related-posts h5 {
                   font-size: 13px;
                   max-width: 200px;
                   font-weight: normal;
                   text-align: left;                                                   
}
.related-posts li .thumbnail-box a:hover {
                                          opacity:0.7; 
                                          filter:alpha(opacity=70); 
                                          -ms-filter: "alpha( opacity=70 )"; 
}     




/*サイドコンテンツエリアデザイン
---------------------------------------------------------------------------------------------------------------------*/
#side-contents-area {
     max-width:280px;
}
#side-contents-area img {
                         box-shadow: 0px 0px 5px 0px #808080;
 
}
#side-contents-area a:hover img {
    opacity: 0.7; 
    filter: alpha(opacity=70); 
    -ms-filter: "alpha( opacity=70 )"; 
}

/* スマホ用レスポンシブ（幅950px以下） */
@media screen and (max-width: 950px) {
#side-contents-area {
  flex:none;
  max-width:90%;
  margin: 0 auto;
  text-align:center;
  margin-top:5%;
}
}


/*個別ページのサイドバー
---------------------------------------------------------------------------------------------------------------------*/
#side-contents-area-page {
                          max-width: 280px;
                          border: 1px solid #ddd;
                          box-shadow: 0px 0px 10px 0px #C6C6C6; 
	                  border-radius: 8px;
                          text-align:center;
                          background-color: #ffffff;
}
#side-contents-area-page h2 {
                             width: 100%;
                             padding-top: 5px;
                             font-size: clamp(14px, 2vw, 18px);
                             font-weight: normal;
	                     border-top-left-radius: 7px;
	                     border-top-right-radius: 7px;
                             background-color: #B8B8B8;
                             text-shadow: 1px 1px 4px #000;
                             color: #FFF;
}
#side-contents-area-page h3 {
                             width: 100%;
                             font-size: clamp(12px, 1.5vw, 14px);
                             font-weight: normal;
                             padding-bottom: 2px;
                             margin-top: -1px;
	                     background-color: #B8B8B8;
                             border-bottom: 1px solid #ddd;

} 
.sidebar-navi .current span {
                             font-size: 16px;
                             display: block;
                             padding: 10px 0 8px 0;
                             color: #FFF;
                             text-shadow: 1px 1px 3px #000;
                             background: rgba(0, 153, 0, 1); 
                             border-top: 1px solid #ddd;
}
.eyecatch img {
               width: 100%;
               height: auto;
               margin:0;
　　　　        border-bottom: 1px solid #ddd;
               display:block;
}
.sidebar-navi .child a,
.sidebar-navi .brother a {
                          font-size: 16px;
                          padding: 10px 0 8px 0;
                          display: block; 
                          background-color: #ffffff;
                          color: #5B5B5B;
                          border-top: 1px solid #ddd;
}
#side-contents-area-page p {
                            background:#000000;
                            margin:0;
}
.sidebar-navi .child a:hover,
.sidebar-navi .brother a:hover {
                                background: rgba(0, 153, 0, 1); 
                                color: #FFF;
                                text-decoration: none;
                                text-shadow: 1px 1px 4px #000;
                                -webkit-transition: background-color 0.3s linear
}

/* スマホ用レスポンシブ（幅950px以下） */
@media screen and (max-width:950px) {
#side-contents-area-page {
  flex:none;
  max-width:95%;
  text-align:center;
  margin: 0 auto;
  margin-bottom:5%;
}
}



/*フッターデザイン
---------------------------------------------------------------------------------------------------------------------*/
#footer-navi-area {
                   padding: 2% 0px 2% 0px;
                   background-color: #FFF;
}
#footer-navi-inbox{
                   max-width:1100px;
                   margin:0 auto; 
}
#footer .widget {
                 width: 30%;
 	         margin: 0 1.6% 0 1.6%;
	         float: left;
        	 overflow: hidden;
                 text-align: left;
} 
#footer .widget h2 {
                    display: block;
                    width: 100%;
                    padding: 8px 0 8px 0;
                    font-weight: normal;
	            border-radius: 8px;
                    text-align: center;
                    font-size: clamp(14px, 2vw, 18px);
                    background-color: rgba(0, 100, 0, 1); 
}
#footer .widget li a {
                      width: 95%;
                      display: block;
                      padding: 10px 0 10px 5%;
                      font-size: clamp(14px, 2vw, 18px);
}
#sub-navi-area {
  background-color: rgba(0, 100, 0, 1); 
}
       
#sub-navi-inbox {
	         text-align: right;
                 max-width:1100px;
                 margin:0 auto; 
                 padding: 10px 15px 10px 0;
}
#sub-navi-area li {
                   display: inline; 
                   font-size: clamp(14px, 2vw, 18px);
	           padding: 0 1% 0 1%;
}
#footer address {
                 padding: 10px 0 10px 0;
                 text-align: center;
}
#footer-navi-area {
	               -webkit-box-shadow: inset 0px 5px 5px 0px #C6C6C6;
	               box-shadow: inset 0px 5px 5px 0px #C6C6C6;
}
#footer .widget h2 {
                    border: 1px solid #ddd;
                    color: #FFF;
                    text-shadow: 1px 1px 3px #000;
}
#footer .widget li a {
                      border-bottom: 1px dotted #2F2F2F;
                      color: #5B5B5B;
}
#footer .widget li a:hover {
                            text-decoration: none;
                            color: #CC0033;
}
#sub-navi-area li a,
#sub-navi-area li a:hover {
             	           color: #FFF;
} 

/* スマホ用レスポンシブ（幅950px以下） */
@media screen and (max-width: 950px) {
 #footer .widget {
    float:none;
    width:90%;
    margin:0 auto;
    padding:2% 0;
}
}

/*テーブルグラフ用
---------------------------------------------------------------------------------------------------------------------*/
table {
	border-collapse: collapse;
        width:100%;
}
th {
	                border: solid 1px #666666;
	                color: #000000;
	                background-color: rgba(220, 220, 220, 1); 
                        text-align:center;
                        padding:1%;
}
td {
	                border: solid 1px #666666;
	                color: #000000;
	                background-color: #fff;
                        text-align:center;
                        padding:1%;
}