@charset "UTF-8";




.head-line img {
    margin-left: 550px;
}


body {
    width: 1500px;
    margin: 0;
    padding: 0;
    color: #333;
}

#global_navi {
    width: 1500px;
    clear: both;
    overflow:hidden;
    margin: 16px auto;
}
#global_navi ul {
    list-style: none;
    margin: 0;
    padding: 0;
}
#global_navi ul li {
    width: 220px;
    float: left;
    margin-right: 1px;
    text-align: center;
}
#global_navi ul li a {
    display: block;
    padding: 16px;
    color: #988564;
    text-decoration: none;
    transition: background-color 0.2s linear;
    border-radius: 50px;
}
#global_navi ul li.current a {
    background-color: #f1ded4;
    border-radius: 50px;
}

#global_navi ul li a:hover {
    background-color: #CC9999;
    border-radius: 50px;
}




#comment-midashi-1{
    /*margin-left:200px;   */
    margin: 80px 0 0 0;
    text-align: center;
    font-size: 20px;
    color: #483d8b;
    font-weight: bold;
    
       
}
#comment-midashi-2{
    margin: 80px 0 0 0;
    text-align: center;
    font-size: 20px;
    color: #483d8b;
    font-weight: bold;
     
        
}

#comment-input {
    margin: 0 0 0 200px;

}
#comment-input ol {
    width: 380px;
    height: 370px;
    margin-left: 300px;
    padding-left: 20px;
}
#comment-input #subj {
    width: 25em;
    padding: 10px;
    background-color: #dce7f1;
}
#comment-input #detail {
    width: 26.3em;
    height: 10em;
    background-color: #dce7f1;
}
#comment-input #confir {
    color: #393225;
 　 background-color: #fff;
}





#comment-title2 {
    margin: 0 0 0 600px;
    position: relative;
    padding-left: 50px;
    font-size:18px;
    color: #888888;
    font-weight: bold;
   }
   #comment-title2::before,
   #comment-title2::after{
    font-size:35px;
    content: "□";
    position: absolute;
   }
   #comment-title2::before{
    left:0;
    top:-18px;
   }
   #comment-title2::after{
    left: 8px;
    top: -10px;
    color: #db7093;
   }
   
   


#comment-disp ol {
    width: 600px;
    margin: 0 0 25px 380px;
    height: auto;
    background-color: #dce7f1;
}
.comment-flex-area {
    display: flex;
}
#comment-disp #date-time {
    margin: 5px 0 0 0;
    width: 180px;
    float: left;
    font-size: 14px;
    color: #832bd5;
    font-weight: bold;
}
#comment-disp #nickname {
    margin: 5px 0 0 30px;
    width: 280px;
    font-size: 14px;
    color: #d15899;
    font-weight: bold;
}
#comment-disp #comment-text {
    width: 550px;
    margin: 10px 0 0px 0;
    font-size: 13px;
    font-weight: bold;
    white-space: normal;
    color: rgb(111, 115, 114);
    overflow-wrap: break-all;
}

.page-top1 {
    text-align: center;
}




/* -----------------------------------------------------------------------
ビューポート(viewport)メディアクエリー(mediaquery)
----------------------------------------------------------------------- */
@media screen and (max-width : 767px){


  img {
    max-width: 100%;
  }
 
  body {
    width: 100%;
  }

  /* Layout */
    header,
    #global_navi,
    #sidebar,
    #wrapper{
    width: 100%;
  }  


  .head-line img {
    margin-left: 100px;
}


  #global_navi ul li {
    width: 50%;
    padding: 0.5px;
    /*margin: 0; */
    margin-left: 110px;
    box-sizing: border-box;
    float: none;
  }
  #global_navi ul li a {
    margin: 0;
  }




#comment-input {
    width: 100%;
    margin: 0;
}

#comment-input ol {
    width: 100%;
    /*margin: 0;*/
    margin-left: -15px;
    /*padding-left: 0px;*/
}






#comment-title2 {
    width: 100%;
    margin: 0;
}


#comment-disp {
    width: 100%;
    margin: 0;
}
/*
#comment-disp ol {
    width: 100%;
    margin: 0;
}
*/

#comment-disp ol {
    width: 95%;
    margin-left: -30px;
    margin-bottom: 25px;
    height: auto;
    box-shadow: 10px 10px 15px -10px gray;
}
.comment-flex-area {
    display: block;
}
#comment-disp #date-time {
    margin: 5px 0 0 0;
    width: 100%;
    font-size: 14px;
    color: #db7093;
}
#comment-disp #nickname {
    margin: 5px 0 0 0px;
    width: 100%;
     font-size: 14px;
     color: #832bd5;
     font-weight: bold;
}
#comment-disp #comment-text {
    margin: 10px 0 0px 0;
    width: 100%;
    font-size: 13px;
    white-space: normal; /* 改行部分を空白で折り返してくれる */
    color: #b7a077;
}

.page-top1 {
    text-align: center;
}







}