* { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", "Osaka", "MS PGothic", sans-serif; -webkit-text-size-adjust: 100%; }
html { overflow-y: scroll;}
html,

body { overflow-x: hidden;word-break: break-all;word-wrap: break-word;margin:0; padding:0; height:100%; line-height:1.2;  -webkit-tap-highlight-color: rgba(0,0,0,0.8); font-size:16px; color:#333; }

.bold{font-weight: bold;}
.txt-right{text-align:right;}
.txt-center{text-align:center;}
.big{font-size: 120%;}
#contents{width: 750px;margin:20px auto;}

#head { width:750%;background-color:#222;color:#fff;margin:0 auto;padding:4px;}

#head_sub_ttl{font-size:14px;margin:8px 8px 4px 8px;}
#head_sub{width: 750px;margin: 0 auto;}
#head a{ color: #FFF;text-decoration :none;}
#head_logo{
  text-align:center;font-weight:bold;font-size:28px;width:80%;margin:0 auto;padding:0 0 10px 0;border:solid 0px #ddd;
}

#head_title{
 padding: 8px 0 5px 0; width: 100%;text-align: center;font-weight: bold;font-size: 10pt;margin: 5px;
}

.global_area{
display:flex;flex-wrap: wrap;justify-content: space-between;
}

.width_rap{width: 750px;margin: 0 auto;}
  /*汎用*/
  .flex{display: flex;}
  .ml-auto{margin-left: auto;}
.margin-t10{
    margin:10px 0;
}
.txt-small{font-size: 80%;}
h1 > a {margin-left:auto ;font-size:14px;}



/*トップページ*/
.new-posts-box{
    border:solid 1px #999;
    margin:16px 1% 0 1%;
    padding:0;
}
.box-title{
    margin:0;
    background-color: #51B99D;
    color:#fff;
    padding:8px 2%;
    display:flex;
    font-size:  14px;
    line-height:14px;
/*    margin-bottom: 8px;*/
}
.more-link{margin-left:auto;display:inline-block;font-size:12px;line-height:14px;}
.post-container{
        padding:6px 2%;

}
.np-date{
font-size: 12px;
line-height: 14px;
}
.np-title{
    font-size: 14px;
}

.post-item{
    padding:4px 0;
}
.post-item + .post-item{
/*        margin-bottom: 4px;*/
border-top:1px #ccc dashed;
        }



/*トップページステップ*/
.bigin-start-box{
        border:solid 2px #51B99D;
        border-radius: 3px;
        margin:16px 1% 0 1%;
        padding:12px 2%;
        position: relative;
}
.bigin-start-box .midashi{
        color: #51B99D;
        font-weight: bold;
/*        border-left:#51B99D solid 2px;*/
        padding:0 1%;
}
.begin-logo{
        width: 16px;
   transform: rotate( -10deg );
    position: absolute;
    top:-8px;
    left:-3px;
}
.begin-logo img{width: 16px;}

.step{
        display: flex;
        margin:6px 1%;

}
.step-number{
        background-color: #51B99D;
        border-radius: 50%;
        line-height: 20px;
        height:20px;
        width: 20px;
        font-size:14px;
        text-align: center;
        color: #fff;
        font-weight: bold;
}
.step-title{
        margin-left:8px;
}

/*TOPデータリンクテーブル*/

.data-link-table{
/*    background-color: #f9f9f9;*/
    margin:16px 1% 0 1%;
}

.data-link-table table { width:100%; }
.data-link-table td{padding:8px 8px;}
.data-link-table .t-head{background-color: #333;color:#fff;font-weight: bold;padding:4px 2%;}
.data-link-table .data-td{width:50%;font-weight: bold;font-size: 14px;text-align: center;}


/*TOPFAQ*/
.top-faq{
           margin:24px 1% 0 1%;
           
           border-radius: 3px;
           color:#333;
}
.top-faq .midashi{border-left:solid 3px #51B99D;padding:4px 8px;font-weight: bold;}
.faq-title{margin:4px  1%;padding: 4px 1%;font-size: 14px;}
.faq-title + .faq-title{border-top:dashed 1px #999;}

/*TOPコメント*/

.comment-box{
        margin:24px 1%;
        background-color: #fff8df;
        border-radius: 3px;
        border:solid 2px #E89C2B;
        padding:0px;
}

.com-form {width:100%;}
.com-form .com-name {width:100%;
margin: 5px 0 0 0;
padding: 4px 12px;
font-size: 16px;
border-radius: 5px;
border: #E89C2B solid 1px;
}
.com-name{}
.com-form .com-text {
        height: 90px;
    width:100%;
    font-size: 16px;
  border-radius: 5px;
  -webkit-appearance: none;
/*  background-color: #FDF2F2;*/
border: #E89C2B solid 1px;
  margin: 5px 0 0 0;
  padding: 4px 12px;

}
.sub-rap{width:100%;text-align: center;}

.com-submit{
    width:60%;
    margin:10px 20%;
    background-color: #E89C2B;
    font-size: 18px;
    padding: 12px;
    border:0;
    color: #fff;
    font-weight: bold;
}

.comment-box .midashi{
        background-color:#E89C2B ;
        color: #fff;
        padding:4px 2% 6px 2%;
        font-weight: bold;
}

.comment-box .comment-container{
        padding:8px 2%;
}

.comment-box .comment-item{
        padding: 12px 2% 8px 2%;
        margin:10px 0;
        border-top:1px solid #ffce86;
/*padding-top:10px;*/
}

.com-top{
font-size: 12px;color:#888;}
.com-main{

    margin:10px 0;
}


/*共通*/
input { font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", "Osaka", "MS PGothic", sans-serif; }
* a { color:#1558d6; text-decoration:none; }
* a:visited { color:#660099; text-decoration:none; }

#footer_area{
  background-color: #333;width:100%;margin-top:30px;padding:10px;text-align: center;
}
#footer_copy{
padding-bottom:20px;color:#fff;
}
#footer_home{font-size: 20px;margin-bottom:10px;width:100% ;text-align:center;}

.g_navi_area{
  width: 100%;
  margin-top:8px;
   font-size:18px;
   background-color: #fff;
   border-bottom: 0px solid #999;
   padding: 8px 5%;
   font-weight:bold;
}
.g_navi_icon{
  width: 8%;
  margin: 5px 3%;
  padding: 3px;
}
.g_icon_this{border: solid 1px #111;border-radius: 2px;background-color: #fff;}
.g_navi_icon img{width: 100%;}

/*パンくず*/
#pan { float: left; width: width:100%; padding:0px font-size: 12px; line-height: 1.3;}
#pan a{ margin:0 2px;}
#pan i{ font-size: 16px; }
#pan span{ margin:0 2px; }

.title_form_div{width:100%;padding:10px 2% 3px 2%;border-bottom:solid 1px #ddd;}
.title_txtarea_form{width:100%;margin:0 auto;font-size: 16pt;}
.submit_bt{text-align: right;margin-top:10px;}




.ttl_line5 {
  font-weight: bold;
  padding: 0.3em;
  margin-bottom: 0.3em;
  position: relative;
}
.ttl_line5::after {
  content: '';
  background-size: 10px 10px;
  background-color: #e1eef5;
  background-image: repeating-linear-gradient(-45deg, #4c9ac0 0, #4c9ac0 3px, #fff 0, #fff 50%);
  width: 100%;
  height: 7px;
  position: absolute;
  bottom: -5px;
  left: 0;
}

.container {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start; /* 左詰めで表示 */
}














.search-form input[type="text"] {
    padding: 5px;
/*    margin-right: 5px;*/
    border: 1px solid #ccc;
    width:74%;
    height:100%;
    margin:0;
    font-size:13px;

}

.search-form button {
  margin:0;
   height:100%;
    background-color: #fff;
    border: 1px solid #ccc;
    cursor: pointer;
    padding: 5px 10px;
    font-size: 13px;

}

.search-form button i {
    color: #333; /* アイコンの色を調整 */
}






.top_tag_rap{
    display: flex;
    justify-content: space-between; 
    margin-bottom: 25px;
}
.top_tag_left{
    
    margin: 10px 2% 0px 2%;
  width: 49%;
  border: 1px solid #313131;
  border-radius: 5px;
}

.top_tag_right{
    

    margin: 10px 2% 0px 0%;
  width: 49%;
  border: 1px solid #313131;
  border-radius: 5px;
}
.box_midashi{

    width: 100%;
  margin: 0px 0 5px 0;
  position: relative;
  display: inline-block;
  line-height: 1;
  font-size: 11pt;
  font-weight: normal;
  padding: 5px 0 5px 0;
  color: #fff;
  background-color: #313131;
  text-align: center;
  border-radius: 3px 3px 0 0;
}
.top_tag{
   text-align: center;
  padding: 5px 5px;
  border-bottom: 1px solid #eee;
  width: 96%;
  margin: 0 auto;
  height: 30px;

  font-weight: bold;
  font-size: 11pt;
  padding: 4px 0 0 0px;
  line-height: 1.5;
}







/*ブログ*/
.blog_contents{
    margin:12px 2%;
    font-size: 15px;
    line-height: 130%;
}

.blog_contents h2{
    border-radius: 3px;
    background-color: #51B99D;
    color: #fff;
    padding:6px 12px;
    font-size: 18px;
/*    display: inline-block;*/
margin:24px 0 0 0;
}
.blog-title{
    font-weight: bold;
    font-size: 24px;
    line-height: 1.1em;
    
}

.blog-date{
    border-top: solid 1px #999;
    border-bottom: solid 1px #999;
    text-align: right;
    font-size: 12px;
    color:#999;
    padding:8px 2%;
}
.blog_contents .t-img{
    width:100%;
    border:solid 1px #ccc;
    margin-top:8px;
}

.blog_contents .li-box{
        border:solid 0px #999;
        margin:4px 0;
        padding:;
}
.li-box .midashi{
color: #51B99D;
font-weight: bold;
margin-bottom: 6px;
}
.li-box li{
        list-style: none;font-weight: bold;margin-bottom: 4px;
}
.li-box i{color:#51B99D; font-size: 90%;margin-right:4px;font-weight: bold;}

.li-box + .li-box{
        margin-top:12px;
}


.blog_contents h3{
    font-size: 16x;
    border-left:solid 3px #51B99D;
    border-bottom:solid 1px #51B99D;
    padding:4px;
    margin-top:24px;
}
.blog_contents .b-img{width: 64px;}
.bold{font-weight: bold;}

.reference-link{
        border:solid 1px #51B99D;
        text-align: center;
        padding:8px;
        border-radius: 3px;
        color:#51B99D !important
    ;
    font-weight: bold;
}
.reference-link a {font-weight: bold;
color:#51B99D !important;
}

.reference-link a:link {color:#51B99D !important
    ;}
.reference-link a:visited {color:#51B99D !important;}

.img-row{display:flex;flex-wrap: wrap;}
.img-row img{width:100%;}
.row-img{width:48%;margin-right:1%;margin-bottom:4px;border:solid 1px #ccc;}

.blog_data_table table{border-collapse: collapse;border:solid 0px #ccc;width: 100%;}
.blog_data_table td{border:solid 1px #ccc;}
.blog_data_table th{border:solid 1px #ccc;font-size: 12px;background-color: #6bd79a ;color:#fff;

}
.table_end_capture{margin-top:4px;color:#999;font-size: 12px;text-align: right;}
.small_table1 table{font-size: 80%!important;}
.small_table2 table{font-size: 65%!important;}






/*コメントJS*/


/*コメント*/
.co-all{ float: left; width: 94%; margin:5px 3%;}
.co-area-befor,
.co-area-after{ z-index:1;position: relative; float: left; width: 100%; }
.co-area-after{ float: left; width: 100%; height: 100px; line-height: 1.1; }
.co-area-after{ text-align: center; padding:20px 0 0 0; font-size:36px; font-weight: bold; }
.co-area-after-s{ font-size: 16px; }
.co-input{ float: left; width: 100%; margin:5px 0 0 0; padding: 3px 8px; border:#999 solid 1px; font-size: 16px; border-radius: 5px; -webkit-appearance: none; background-color: #FDF7F2; border:#DFBCA6   solid 1px;}
.co-name{   }
.co-txt{ height: 100px; resize: none;}
.co-btn-box{ float: left; width: 100%; height: 55px; }
.co-btn{float: right; width: 30%; height: 35px;  margin:10px 0 0 0;  padding: 7px ; background-color: #000; color: #FFF; border-radius: 5px; text-align: center; font-size: 16px;  }
.co-btn-disable{ float: right; width: 30%; height: 35px;  margin:10px 0 0 0;  padding: 7px ; background-color: #999; color: #FFF; border-radius: 5px; text-align: center; font-size: 16px; display: none; }
/*.co-hist{ float: left; width: 100%; margin:20px 0 0 0;  background-color: #FDF7E8; border:#D8C79B solid 2px; border-radius: 5px; }*/
.co-exp{ float: left; width: 100%; margin:10px 0; padding: 0 5%; color: #756F63; font-size: 12px; }

.co-hist-list{ float: left; width: 96%; margin:10px 2%; border-collapse: collapse; }
.co-hist-list th{ width: 30px; text-align: center; }
.co-hist-list th i{ margin:0; }
.co-hist-list th .fa-trash-alt{ color: #999; }
.co-hist-list th,
.co-hist-list td{ padding: 3px 0px; line-height: 1.3; vertical-align: top; word-break: break-all; }
.co-hist-list td p{ margin: 0 0 5px 0; }
.co-hist-list-td-s{ font-size: 12px; color: #777; }
.co-hist-list-td-pic{ float: left; width: 90%; }
.co-hist-list-td-pic-img{ display: block; max-width: 100%; border:#FFF solid 3px; box-shadow: 2px 2px 5px rgba(0,0,0,0.4); }
.co-hist-list-td-info{ float: left; width: 100%; margin:5px 0 15px 0 ; font-size: 12px; line-height: 1.5; }
.co-hist-list-td-info-i{ margin:0 3px 0 0; }

.co-hist-list-td-good{ color: #FFD1D1;  }
.co-hist-list-td-good-after{ color: #BBBBBB; }

.comment_area{}

.no_comment{
    padding:8px 2%;
}

.comment_navi_area{
    border-top:solid 1px #dfdddd;
    border-bottom:solid 1px #dfdddd;

    font-size: 13px;
    padding:6px 2%;
    margin-top: 10px;
    background-color: #f1f1f1;
    color:#666;

}
.navi_float_left{
    float:left;
    display: flex;padding:3px 0;
    width:60%;
    flex-wrap: wrap;
}
.navi_float_right{
    float:right;
    display: flex;
    width:40%;
}


.comment_sort_button{
        margin-right:3px;
    
        padding:2px 6px;
        border-radius: 3px;
        background-color: #fff;
        
}
.comment_sort_button a{color:inherit;
  text-decoration: none;}


.current_on{
        border:solid 1px #b3b3b3;
    background-color: #313131;
    color:#fff;
    border:solid 1px #888;
}

.current_off{
    border:solid 1px #b3b3b3;
    background-color: #fff;
    color:#666;
    box-shadow:  1px 1px #ddd;
}


.comment_box {
/*    border-bottom:solid 1px #e6e6e6;*/
    padding:12px 2% 6px 2%;
    width:100%;
position: relative;
}
.comment_box + .comment_box{
    border-top:solid 1px #EACFA6;
}

.com_page_name{font-size: 10px;}
.com_hide{background-color: #ddd;}
.comment_edit{position: absolute;top:5px;right: 5px;}
.comment_view_area{
    margin:5px 0;
    padding-bottom: 24px;

}
.comment_info{
    display: flex;
    align-items: center;
    font-size: 12px;

    color:#777;
}
.comment_txt{
    font-size: 15px;
    padding: 4px  0 6px 0; 
    color:#111;
    word-break: break-all;
    line-height: 1.3;
    font-weight: normal;
}

.comment_name{
    margin-right: 2%;
    font-size: 14px;

}
.comment_id{
    margin-right: 2%;
    font-size: 14px;

}
.comment_bottom{text-align: right;font-size: 13px;}


.good_button{width:15px;}
.good-count{font-size: 10px;}


.comment_bottom button{padding:initial;margin: 0;height: 100%;}
.thumb-up-button {
background-color: #fff;
  color: #A2999A;; /* ボタンのテキストの色 */
  border: none; /* ボタンの境界線をなくす */
padding:0 4px !important;
  text-align: center; /* ボタン内のテキストを中央揃え */
  text-decoration: none; /* テキストの下線をなくす */
  display: inline-block; /* インライン要素として表示 */
  font-size: 16px; /* テキストのフォントサイズ */
 border-radius: 4px; /* ボタンの角を丸める */
  cursor: pointer; /* マウスがボタンの上に来た時にポインターを変更 */
  transition: background-color 0.3s ease; /* ボタンをホバーしたときに背景色を変更する */
}

.thumb-up-button_af {
    
background-color: #fff;
  color: #FF99A7; /* ボタンのテキストの色 */
  border: none; /* ボタンの境界線をなくす */
padding:0 4px !important;
  text-align: center; /* ボタン内のテキストを中央揃え */
  text-decoration: none; /* テキストの下線をなくす */
  display: inline-block; /* インライン要素として表示 */
  font-size: 16px; /* テキストのフォントサイズ */
 border-radius: 4px; /* ボタンの角を丸める */
  cursor: pointer; /* マウスがボタンの上に来た時にポインターを変更 */
  transition: background-color 0.3s ease; /* ボタンをホバーしたときに背景色を変更する */
}

.thumb-up-button i {
  margin-right: 4px; /* ボタンのアイコンとテキストの間に余白を設ける */
}
.thumb-up-button_af i {
  margin-right: 4px; /* ボタンのアイコンとテキストの間に余白を設ける */
}
.fa-thumbs-up::before {
  content: "\f164"; /* フォントアイコンを指定 */
}






/*スレッド BBS*/
.thread-title{
    padding:6px 8px;
    font-size: 18px ;
    border-bottom:2px #333 solid ;
     border-top:2px #333 solid ;
}


/*ページネーション*/
.page-all{ float: left; margin:25px 0 ; width: 100%; text-align: center; font-size: 16px; border:solid 0px #333 ;}
.page-all a{ margin:0 7px; }
.page-all span{ color: #999; margin:0 8px; }

.related{
    margin:4px 0;
}
.term_list_item{
    margin:4px 0;
}