/*以下初期化用*/
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
dl, dt, dd, ol, ul, li,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
abbr, address, cite, code,
b, i,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-size: 100%;
    vertical-align: baseline;
    background: transparent;
}

body {
  line-height: 1;
  background-color: #191919;
}

/*-----------------------------PC,SP共通---------------------------------*/

.img_resize {
  max-width: 100%;
  height: auto;
}

.link_1 {
  color: #fff;
  text-decoration: none;
}

.link_2 {
  color: #fff;
}

.link_3 {
  color: #000;
  text-decoration: none;
}

.link_3:hover {
	color: #fff;
}

.scrollbar::-webkit-scrollbar {
  display: none;
}

/*-------------------------------PC本文----------------------------------*/

#container_all {
  color: #fff;
  font-size: 16px;
  width: 1200px;
  background-color:#5b4e47;
  margin-left: auto;
  margin-right: auto;
  line-height: 1.2;
  /*box-sizing: border-box;*/
}

/*-----------------------------------------------------------------------*/

#container_1 {
  width: 1200px;
}

/*-----------------------------------------------------------------------*/

header {
  width: 1200px;
  background-color: #42342d;
  grid-template-columns: 600px 600px;
  grid-template-rows: auto auto;
  display: grid;
}

#rogo {
  padding: 12px 0px 0px 15px;
  margin: 0px 0px 1px 0px;
}

.pagename {
  font-size: 52px;
  font-family: "MS Gothic";
  letter-spacing:3px;
  text-shadow: 4px 4px 20px #000;
  font-weight: lighter;
}

/*-----------------------------------------------------------------------*/

#contents_left {
  height: 23px;
  grid-column: 1/2;
  grid-row: auto;
  background-color: #000;
}

#contents_right {
  height: 23px;
  grid-column: 2/4;
  grid-row: auto;
  background-color: #000;
}

nav {
  color: #fff;
}

#navi_ul {
  font-size: 18px;
  list-style-type: none;
  display: flex;
}

.navi_li_1 {
  padding: 4px 0px 0px 15px;
}

.navi_li_2 {
  padding: 4px 0px 0px 15px;
  margin: 0px 0px 0px 20px;
}

.lastup {
  padding: 2px 0px 0px 0px;
  margin: 0px 0px 0px 300px;
}

.span_lastup {
  color: #c00000;
  font-size: 19px;
}

/*-----------------------------------------------------------------------*/

#img {
  height: 600px;
  width: 1200px;
  background-color: #000;
  border-top: solid 1px #1c1c1c;
  border-bottom: solid 1px #1c1c1c;
  position: relative;
}

.notice_1{
  color:#e4e5e5;
  font-size: 16px;
  position: absolute;
  top:93%;
  left:63%;
}

.img_top_p {
  height: 600px;
  width: 1200px;
}

/*-----------------------------------------------------------------------*/

#pan {
  height: 22px;
  width: 1200px;
  background-color: #000;
}

.pan_p {
  padding: 3px 0px 0px 15px;
}

/*-----------------------------------------------------------------------*/

#container_2 {
  width: 1200px;
  display: grid;
  grid-template-columns: 246px 708px 246px;
}

/*-----------------------------------------------------------------------*/

#container_2 {
  width: 1200px;
  display: grid;
  grid-template-columns: 246px 708px 246px;
}

/*-----------------------------------------------------------------------*/

#left {
  color:#000;
  height: 888px;
  width: 245px;
  background-color: #5b4e47;
  border-right: solid 1px #000;
  grid-column: 1/2;
  grid-row: 1;
}

/*-----------------------------------------------------------------------*/

#index {
  height: 30px;
  background-color: #222;
}

.index_h2 {
  color: #575972;
  font-size: 26px;
  padding: 2px 0px 0px 10px;
}

/*-----------------------------------------------------------------------*/

#contents_left_all {
  background-color: #5b4e47;
}

#contents_1 {
  font-size: 20px;
  margin: 15px 0px 0px 0px;
  display:flex;
}

.icon_1 {
  height:25px;
  width:25px;
  background-color: #4b505f;
  margin: 0px 8px 0px 5px;
}

.contents_ul {
  list-style: none;
}

.side_li_1 {
  height: 20px;
  margin: 5px 0px 40px 0px;  
}

.font_weight {
  font-weight:bold;
}

/*-----------------------------------------------------------------------*/

#contents_2 {
  font-size: 20px;
  background-color: #5b4e47;
}

#old_title { 
  height: 30px;
  margin: 0px 0px 40px 0px;
  display:flex;
}

.icon_2 {
  width:25px;
  height: 25px;
  margin: 0px 8px 0px 5px;
  /*background-color: #4b505f;*/
}

.old_story_h3 {
  font-weight: lighter;
  margin: 5px 0px 0px 0px;
}

.old_story_ul {
  padding: 0px 0px 0px 37px;
  margin: 0px 0px 40px 0px;
  list-style: none;
}

.side_li_2 {
  padding: 5px 0px 0px 25px;
  margin: 0px 0px 40px 0px;
}

.font_size {
  color: #fff;
  font-size: 24px;
}

/*-----------------------------------------------------------------------*/

.other_illust_h3 {
  font-weight: lighter;
  padding: 0px 0px 0px 37px;
  margin: 0px 0px 5px 0px;
}

.coming_soon {
  padding: 0px 0px 0px 78px;
}

/*-----------------------------------------------------------------------*/

main {
  height: 888px;
  width:708px;
  grid-column: 2/3;
  grid-row: 1;
  /*background-color: #322;*/
}

#about{
  height: 30px;
  width: 708px;
  color: #fff;
  background-color: #444;
}

.about_h2 {
  font-size: 26px;
  padding: 2px 0px 0px 10px;
}

/*---------------------------------------------------------------*/

#container3 {
  height: 818px;
  width: 688px;
  padding: 20px 10px 20px 10px;
  background-color: #322;
}

/*---------------------------------------------------------------*/

#about_box {
  height: 90px;
  margin: 0px 0px 20px 0px;
  background-color: #fff;

}

#about_1 {
    height: 30px;
    background-color: #444;
}

#about_2 {
    height: 60px;
    background-color: #666;
}


.website_h3 {
  color: #fff;
  font-size: 18px;
  padding: 8px 10px 6px 10px;
}

.website_p {
  color: #fff;
  font-size: 18px;
  padding: 5px 10px 5px 10px;
  line-height: 20px;
}

/*---------------------------------------------------------------*/

#old_box {
  height: 150px;
  margin: 0px 0px 20px 0px;
  /*background-color: #000;*/
}

#old_1 {
  height: 30px;
  background-color: #444;
}

#old_2{
  color: #fff;
  height: 120px;
  background-color: #666;
}

.old_h3 {
  color: #fff;
  font-size: 18px;
  padding: 8px 5px 6px 10px;
}

.old_p {
  color: #fff;
  font-size: 18px;
  padding: 5px 10px 5px 10px;
  line-height: 20px;
}

/*---------------------------------------------------------------*/

#other_box {
  height: 120px;
}

#other_1 {
  height: 30px;
  background-color: #444;
}

#other_2 {
  height: 90px;
  background-color: #666;
}

.other_h3 {
  color: #fff;
  font-size: 20px;
  padding: 8px 5px 6px 10px;
}

.other_p {
  color: #fff;
  font-size: 18px;
  padding: 5px 10px 5px 10px;
  line-height: 20px;
}

/*-----------------------------------------------------------------------*/

#right {
  color: #fff;
  height: 888px;
  width: 246px;
  background-color: #322;
  grid-column: 3/4;
  grid-row: 1;
}

/*-----------------------------------------------------------------------*/

#profile {
  height: 436px;
  margin: 0px 0px 24px 0px;
  background-color: #322;
}

/*-----------------------------------------------------------------------*/

#profile_h{
  height: 30px;
  background-color: #432e2e;
  margin: 0px 0px 5px 0px;
}

.profile_h3 {
  font-size: 26px;
  padding: 2px 0px 0px 5px;
}

#profile_imgbox {
  height: 246px;
  width: 246px;
  background-color: #202547;
  /*border: solid 3px #707070;*/
}

.profile_img {
  height: 246px;
  width: 246px;
}

/*-----------------------------------------------------------------------*/

#profile_under_box {
  height: 155px;
  background-color: #876;
}

#profile_name {
  height: 30px;
  background-color: #022;
}

.profile_name_h4 {
  font-size: 16px;
  padding: 6px 0px 0px 5px;
}

#profile_gender {
  height: 20px;
}

.profile_gender_p {
  padding: 4px 0px 0px 5px;
}

#profile_pr {
  height: 103px;
}

.profile_pr_p {
  padding: 16px 5px 5px 5px;
  line-height: 1.6;
}

/*-----------------------------------------------------------------------*/

#contact {
  height: 100px;
  background-color: #333;
}

#contact_box {
  padding: 20px 20px 20px 20px;
}

.mail_2 {
  font-size: 14px;
}

/*-----------------------------------------------------------------------*/

footer {
  height: 59px;
  width: 1200px;
  background-color: #30323d;
  border-top: solid 1px #fff;
}

.footer_p {
  font-size: 18px;
  padding: 22px 0px 0px 0px;
  text-align: center;
}






/*-----------------------------------------------------------------------*/

  @media screen and (max-width: 600px) {

/*-----------------------------------------------------------------------*/

#container_all {
  color:#fff;
  font-size: 16px;
  width: 400px;
  background-color: #5b4e47;
  margin-left: auto;
  margin-right: auto;
  line-height: 1.2;
  /*box-sizing: border-box;*/
}

/*-----------------------------------------------------------------------*/

#container_1 {
width: 400px;
}

/*-----------------------------------------------------------------------*/

header {
  width: 400px;
  background-color: #42342d;
  display: grid;
  grid-template-columns: 200px 200px;
  grid-template-rows: auto auto;
}

#rogo {
  height: 35px;
  width: 128px;
  padding: 5px 0px 0px 9px;
}

.pagename {
  color: #fff;
  font-size: 32px;
  font-family: "MS Gothic";
  letter-spacing:0px; /*SP初期化用*/ 
  text-shadow: 4px 4px 20px #000;
  font-weight: lighter;
}

/*-----------------------------------------------------------------------*/

#contents_left {
  height: 20px;
  grid-column: 1/2;
  grid-row: auto;
  background-color: #000;
}

#contents_right {
  height: 20px;
  grid-column: 2/4;
  grid-row: auto;
  background-color:#000;
}

nav {
  color: #fff;
}

#navi_ul {
  font-size: 16px;
  list-style-type: none;
  display: flex;
}

.navi_li_1 {
  padding: 4px 0px 0px 10px;
}

.navi_li_2 {
  padding: 4px 0px 0px 10px;
  margin: 0px; /*SP初期化用*/
}

.lastup {
  font-size: 16px;
  padding: 4px 0px 0px 0px;
  margin: 0;
}

.span_lastup {
  color: #c00000;
  font-size: 16px;
}

/*-----------------------------------------------------------------------*/

#img {
  height: 200px;
  width: 400px;
  background-color: #000;
  border-top: solid 1px #1c1c1c;
  border-bottom: solid 1px #1c1c1c;
}

.notice_1{
  color:#c4c4c4;
  font-size: 10px;
  inline-size: 139px;
  position: relative;
  top:-25%;
  left:63%;
  line-height: 1;
}

.img_top_p {
  height: 200px;
  width: 400px;
}

/*-----------------------------------------------------------------------*/

#pan {
  height: 20px;
  width: 400px;
  background-color: #000;
}


.pan_p {
  color: #fff;
  font-size: 14px;
  padding: 3px 0px 0px 10px;
}
  
/*-----------------------------------------------------------------------*/
  
    #container_2 {
      width: 400px;
      display: grid;
      grid-template-columns: 100px 300px;
    }
  
/*-----------------------------------------------------------------------*/
  
     #left {
      height: 550px;
      width: 100px;
      background-color: #999;
      grid-column: 1/2;
      grid-row: 1;
      border-right: none;
    }

/*-----------------------------------------------------------------------*/  

    #index {
      height: 30px;
      width: 100px;
      background-color: #222;
      border-right: none;
    }
  
    .index_h2 {
      color: #575972;
      font-size: 18px;
      padding: 8px 0px 0px 10px;
    }
  
/*-----------------------------------------------------------------------*/

    #contents_left_all {
      height:240px;
      background-color: #5b4e47;
    }

    #contents_1 {
      font-size: 13px;
      margin: 0px;
      padding: 8px 0px 0px 0px;
      background-color: #5b4e47;
      border-right: none;
      display:flex;
    }

    .icon_1 {
      height:10px;
      width:10px;
      background-color: #4b505f;
      margin: 0px 3px 0px 3px;
    }

    .contents_ul {
      list-style: none;
    }

    .side_li_1 {
      color:#000;
      font-size: 13px;
      margin: 0px 0px 10px 0px;
      /*margin: 0;*/
      padding: 0;
    }
  
    .font_weight {
      font-weight:bold;
    }

/*-----------------------------------------------------------------------*/


#contents_2 {
  color: #000;
  font-size: 13px;
  background-color: #5b4e47;
}

#old_title { 
  height: 30px;
  margin-bottom: 0px;
  display:flex;
}

.icon_2 {
  width:10px;
  height: 10px;
  margin: 0px 3px 0px 3px;
  /*background-color: #4b505f;*/
}

 .old_story_h3 {
      font-weight: lighter;
      margin: 0px 0px 0px 0px; /*初期化用*/
    }


    .old_story_ul {
      padding: 0px 0px 0px 0px;
      margin: 0px 0px 0px 0px;
      list-style: none;
    }

    .side_li_2 {
      padding: 0;
      margin: 0px 0px 10px 27px;
    }

    .font_size {
      font-size: 13px;
    }

/*-----------------------------------------------------------------------*/

    .other_illust_h3 {
      font-weight: lighter;
      font-size: 13px;
      padding: 0;
      text-align: center;
      margin: 0px 0px 5px 0px;
    }
    
    .coming_soon {
      color: #000;
      font-size: 13px;
      padding: 0px 0px 0px 25px;
    }

/*-----------------------------------------------------------------------*/
  
main {
  height: 540px;
  width: 300px;
  grid-column: 2/3;
  grid-row: 1;

}


#about{
  height: 30px;
  width: 300px;
  background-color: #444;
  /*margin: 0px 0px 7px 0px;*/
}

/*---------------------------------------------------------------*/

#container3 {
  height: 490px;
  width: 280px;
  padding: 10px 10px 10px 10px;
  background-color: #322;
}

/*---------------------------------------------------------------*/

#about_box {
  height: 80px;
  width: 280px;
  margin: 0px 0px 10px 0px;
  background-color: #fff;
}

#about_1 {
  height: 25px;
  background-color: #444;
}

#about_2 {
  height: 55px;
  background-color: #666;
}

.about_h2 {
  font-size: 20px;
  padding: 8px 0px 0px 10px;

}

.website_h3 {
  color: #fff;
  font-size: 14px;
  padding: 5px 5px 5px 10px;
}

.website_p {
  color: #fff;
  font-size: 13px;
  padding: 5px 10px 5px 10px;
}

/*---------------------------------------------------------------*/
#old_box {
  height: 125px;
  margin: 0px 0px 10px 0px;
  /*background-color: #000;*/
}

#old_1 {
  height: 25px;
  background-color: #444;
}

#old_2{
  height: 100px;
  color: #fff;
  background-color: #666;
}

#other_box {
  height: 85px;
  /*background-color: #000;*/
}

#other_1 {
  height: 25px;
  background-color: #444;
}

#other_2 {
  height: 60px;
  color: #fff;
  background-color: #666;
}


.old_h3 {
  color: #fff;
  font-size: 14px;
  padding: 5px 5px 5px 10px;
}

.old_p {
  color: #fff;
  font-size: 13px;
  padding: 5px 10px 5px 10px;
}

.other_h3 {
  color: #fff;
  font-size: 14px;
  padding: 8px 5px 6px 10px;
  
}

.other_p {
  color: #fff;
  font-size: 13px;
  padding: 5px 10px 5px 10px;
}
  
/*------------------------------------------------------------------------*/
  
    #right {
      color: #fff;
      height: 265px;
      width: 400px;
      background-color:rgba(0,0,0,0);
      grid-column: 2/3;
      grid-row: 1;
      position: absolute;
      top:562px;
    }
  
/*------------------------------------------------------------------------*/

    #profile {
      height: 125px;
      width: 100px;
      margin: 0px 0px 0px 0px; /*SP初期化用*/
      background-color: #322;
    }

    #profile_h{
      height: 20px;
      background-color: #432e2e;
      margin-bottom: 5px;
    }

    .profile_h3 {
      color: #fff;
      font-size: 16px;
      padding: 0px 0px 0px 0px;/*SP初期化用*/
    }
  
    #profile_imgbox {
      height: 100px;
      width: 100px;
      color: #fff;
      background-color: #202547;
       /*border: solid 3px #707070;*/
    }

    .profile_img {
      height: 100px;
      width: 100px;
    }
  
  /*------------------------------------------------------------------------*/

    #profile_under_box {
      height: 140px;
      background-color: #876;
    }
  
    #profile_name {
      height: 20px;
      background-color: #022;
    }

    .profile_name_h4 {
      font-size: 13px;
      padding: 5px 0px 0px 5px;
    }
  
    #profile_gender {
      height: 15px;
    }

    .profile_gender_p {
      font-size: 11px;
      padding: 4px 0px 0px 5px;
    }
  
    #profile_pr {
      height: 65px;
    }
  
    .profile_pr_p {
      font-size: 11px;
      padding: 8px 0px 0px 5px;
      line-height: 1.2;
    }

  /*------------------------------------------------------------------------*/
  
    #contact {
      font-size: 12px;
      height: 80px;
      width: 200px;
      background-color: #333;
      position: absolute;
      top: 125px;
      left:190px;
    }
  
    #contact_box {
      padding: 15px 15px 15px 15px;
    }
  
    .mail_2 {
      font-size: 12px;
    }
  
   /*------------------------------------------------------------------------*/

    footer {
      height: 49px;
      width: 400px;
      background-color: #30323d;
      border-top: solid 1px #fff;
      position: absolute;
      /*top:837px;*/
    }
  
    .footer_p {
      font-size: 18px;
      padding: 16px 0px 0px 0px;
      text-align: center;
    }

   /*------------------------------------------------------------------------*/

  }