.shogi_ban {
  background-image: url("/fujiisouta/kifu_tsunagi/images/ban_3.jpg");
  border: 2px solid #2d1b1c;
  background-size: 100% 100%;
}

.shogi_ban ul {
  display: flex;
}
.shogi_ban ul:last-child li{
    border-bottom: unset;
}
.shogi_ban ul li:last-child{
    border-right: unset;

}
.shogi_ban ul li {
    width: 50px;
    height: 32px;
    border-right: 1px solid #2d1b1c;
    border-bottom: 1px solid #2d1b1c;
    text-align: center;
}

.teban_g li p {
  margin-top: 4px;
  transform: rotate(180deg);
  transform-origin: 50% 45%;
}
.teban_s li p {
  margin-top: 2px;
  transform-origin: 50% 45%;
}
.koma_01_g {top:calc(2%)!important;left: 2%!important;}
.koma_02_g {top:calc(2%)!important;left: 12%!important;}
.koma_03_g {top:calc(2%)!important;left: 22%!important;}
.koma_04_g {top:calc(2%)!important;left: 32%!important;}
.koma_05_g {top:calc(2%)!important;left: 42%!important;}

.koma_01_s {top:calc(37px + 92.5%)!important;left: 91%!important;}
.koma_02_s {top:calc(37px + 92.5%)!important;left: 81%!important;}
.koma_03_s {top:calc(37px + 92.5%)!important;left: 71%!important;}
.koma_04_s {top:calc(37px + 92.5%)!important;left: 61%!important;}
.koma_05_s {top:calc(37px + 92.5%)!important;left: 51%!important;}

.koma_11 {top:calc(37px + 2%)!important;left: 90%!important;}
.koma_21 {top:calc(37px + 2%)!important;left: 79%!important;}
.koma_31 {top:calc(37px + 2%)!important;left: 68%!important;}
.koma_41 {top:calc(37px + 2%)!important;left: 57%!important;}
.koma_51 {top:calc(37px + 2%)!important;left: 46%!important;}
.koma_61 {top:calc(37px + 2%)!important;left: 35%!important;}
.koma_71 {top:calc(37px + 2%)!important;left: 24%!important;}
.koma_81 {top:calc(37px + 2%)!important;left: 13%!important;}
.koma_91 {top:calc(37px + 2%)!important;left: 2%!important;}

.koma_12 {top:calc(37px + 12%)!important;left: 90%!important;}
.koma_22 {top:calc(37px + 12%)!important;left: 79%!important;}
.koma_32 {top:calc(37px + 12%)!important;left: 68%!important;}
.koma_42 {top:calc(37px + 12%)!important;left: 57%!important;}
.koma_52 {top:calc(37px + 12%)!important;left: 46%!important;}
.koma_62 {top:calc(37px + 12%)!important;left: 35%!important;}
.koma_72 {top:calc(37px + 12%)!important;left: 24%!important;}
.koma_82 {top:calc(37px + 12%)!important;left: 13%!important;}
.koma_92 {top:calc(37px + 12%)!important;left: 2%!important;}

.koma_13 {top:calc(37px + 21.5%)!important;left: 90%!important;}
.koma_23 {top:calc(37px + 21.5%)!important;left: 79%!important;}
.koma_33 {top:calc(37px + 21.5%)!important;left: 68%!important;}
.koma_43 {top:calc(37px + 21.5%)!important;left: 57%!important;}
.koma_53 {top:calc(37px + 21.5%)!important;left: 46%!important;}
.koma_63 {top:calc(37px + 21.5%)!important;left: 35%!important;}
.koma_73 {top:calc(37px + 21.5%)!important;left: 24%!important;}
.koma_83 {top:calc(37px + 21.5%)!important;left: 13%!important;}
.koma_93 {top:calc(37px + 21.5%)!important;left: 2%!important;}

.koma_14 {top:calc(37px + 31.5%)!important;left: 90%!important;}
.koma_24 {top:calc(37px + 31.5%)!important;left: 79%!important;}
.koma_34 {top:calc(37px + 31.5%)!important;left: 68%!important;}
.koma_44 {top:calc(37px + 31.5%)!important;left: 57%!important;}
.koma_54 {top:calc(37px + 31.5%)!important;left: 46%!important;}
.koma_64 {top:calc(37px + 31.5%)!important;left: 35%!important;}
.koma_74 {top:calc(37px + 31.5%)!important;left: 24%!important;}
.koma_84 {top:calc(37px + 31.5%)!important;left: 13%!important;}
.koma_94 {top:calc(37px + 31.5%)!important;left: 2%!important;}

.koma_15 {top:calc(37px + 41.5%)!important;left: 90%!important;}
.koma_25 {top:calc(37px + 41.5%)!important;left: 79%!important;}
.koma_35 {top:calc(37px + 41.5%)!important;left: 68%!important;}
.koma_45 {top:calc(37px + 41.5%)!important;left: 57%!important;}
.koma_55 {top:calc(37px + 41.5%)!important;left: 46%!important;}
.koma_65 {top:calc(37px + 41.5%)!important;left: 35%!important;}
.koma_75 {top:calc(37px + 41.5%)!important;left: 24%!important;}
.koma_85 {top:calc(37px + 41.5%)!important;left: 13%!important;}
.koma_95 {top:calc(37px + 41.5%)!important;left: 2%!important;}

.koma_16 {top:calc(37px + 51%)!important;left: 90%!important;}
.koma_26 {top:calc(37px + 51%)!important;left: 79%!important;}
.koma_36 {top:calc(37px + 51%)!important;left: 68%!important;}
.koma_46 {top:calc(37px + 51%)!important;left: 57%!important;}
.koma_56 {top:calc(37px + 51%)!important;left: 46%!important;}
.koma_66 {top:calc(37px + 51%)!important;left: 35%!important;}
.koma_76 {top:calc(37px + 51%)!important;left: 24%!important;}
.koma_86 {top:calc(37px + 51%)!important;left: 13%!important;}
.koma_96 {top:calc(37px + 51%)!important;left: 2%!important;}

.koma_17 {top:calc(37px + 61%)!important;left: 90%!important;}
.koma_27 {top:calc(37px + 61%)!important;left: 79%!important;}
.koma_37 {top:calc(37px + 61%)!important;left: 68%!important;}
.koma_47 {top:calc(37px + 61%)!important;left: 57%!important;}
.koma_57 {top:calc(37px + 61%)!important;left: 46%!important;}
.koma_67 {top:calc(37px + 61%)!important;left: 35%!important;}
.koma_77 {top:calc(37px + 61%)!important;left: 24%!important;}
.koma_87 {top:calc(37px + 61%)!important;left: 13%!important;}
.koma_97 {top:calc(37px + 61%)!important;left: 2%!important;}

.koma_18 {top:calc(37px + 71%)!important;left: 90%!important;}
.koma_28 {top:calc(37px + 71%)!important;left: 79%!important;}
.koma_38 {top:calc(37px + 71%)!important;left: 68%!important;}
.koma_48 {top:calc(37px + 71%)!important;left: 57%!important;}
.koma_58 {top:calc(37px + 71%)!important;left: 46%!important;}
.koma_68 {top:calc(37px + 71%)!important;left: 35%!important;}
.koma_78 {top:calc(37px + 71%)!important;left: 24%!important;}
.koma_88 {top:calc(37px + 71%)!important;left: 13%!important;}
.koma_98 {top:calc(37px + 71%)!important;left: 2%!important;}

.koma_19 {top:calc(37px + 80.5%)!important;left: 90%!important;}
.koma_29 {top:calc(37px + 80.5%)!important;left: 79%!important;}
.koma_39 {top:calc(37px + 80.5%)!important;left: 68%!important;}
.koma_49 {top:calc(37px + 80.5%)!important;left: 57%!important;}
.koma_59 {top:calc(37px + 80.5%)!important;left: 46%!important;}
.koma_69 {top:calc(37px + 80.5%)!important;left: 35%!important;}
.koma_79 {top:calc(37px + 80.5%)!important;left: 24%!important;}
.koma_89 {top:calc(37px + 80.5%)!important;left: 13%!important;}
.koma_99 {top:calc(37px + 80.5%)!important;left: 2%!important;}



.teban_g li:nth-child(9) {top:calc(37px + 2%);left: 90%;}
.teban_g li:nth-child(8) {top:calc(37px + 2%);left: 79%;}
.teban_g li:nth-child(7) {top:calc(37px + 2%);left: 68%;}
.teban_g li:nth-child(6) {top:calc(37px + 2%);left: 57%;}
.teban_g li:nth-child(5) {top:calc(37px + 2%);left: 46%;}
.teban_g li:nth-child(4) {top:calc(37px + 2%);left: 35%;}
.teban_g li:nth-child(3) {top:calc(37px + 2%);left: 24%;}
.teban_g li:nth-child(2) {top:calc(37px + 2%);left: 13%;}
.teban_g li:nth-child(1) {top:calc(37px + 2%);left: 2%;}

.teban_g li:nth-child(11) {top:calc(37px + 12%);left: 79%;}
.teban_g li:nth-child(10) {top:calc(37px + 12%);left: 13%;}

.teban_g li:nth-child(20) {top:calc(37px + 21.5%);left: 90%;}
.teban_g li:nth-child(19) {top:calc(37px + 21.5%);left: 79%;}
.teban_g li:nth-child(18) {top:calc(37px + 21.5%);left: 68%;}
.teban_g li:nth-child(17) {top:calc(37px + 21.5%);left: 57%;}
.teban_g li:nth-child(16) {top:calc(37px + 21.5%);left: 46%;}
.teban_g li:nth-child(15) {top:calc(37px + 21.5%);left: 35%;}
.teban_g li:nth-child(14) {top:calc(37px + 21.5%);left: 24%;}
.teban_g li:nth-child(13) {top:calc(37px + 21.5%);left: 13%;}
.teban_g li:nth-child(12) {top:calc(37px + 21.5%);left: 2%;}



.teban_s li:nth-child(9) {top:calc(37px + 61%);left: 90%;}
.teban_s li:nth-child(8) {top:calc(37px + 61%);left: 79%;}
.teban_s li:nth-child(7) {top:calc(37px + 61%);left: 68%;}
.teban_s li:nth-child(6) {top:calc(37px + 61%);left: 57%;}
.teban_s li:nth-child(5) {top:calc(37px + 61%);left: 46%;}
.teban_s li:nth-child(4) {top:calc(37px + 61%);left: 35%;}
.teban_s li:nth-child(3) {top:calc(37px + 51%);left: 24%;}
.teban_s li:nth-child(2) {top:calc(37px + 61%);left: 13%;}
.teban_s li:nth-child(1) {top:calc(37px + 61%);left: 2%;}

.teban_s li:nth-child(11) {top:calc(37px + 71%);left: 79%;}
.teban_s li:nth-child(10) {top:calc(37px + 71%);left: 13%;}

.teban_s li:nth-child(20) {top:calc(37px + 80.5%);left: 90%;}
.teban_s li:nth-child(19) {top:calc(37px + 80.5%);left: 79%;}
.teban_s li:nth-child(18) {top:calc(37px + 80.5%);left: 68%;}
.teban_s li:nth-child(17) {top:calc(37px + 80.5%);left: 57%;}
.teban_s li:nth-child(16) {top:calc(37px + 80.5%);left: 46%;}
.teban_s li:nth-child(15) {top:calc(37px + 80.5%);left: 35%;}
.teban_s li:nth-child(14) {top:calc(37px + 80.5%);left: 24%;}
.teban_s li:nth-child(13) {top:calc(37px + 80.5%);left: 13%;}
.teban_s li:nth-child(12) {top:calc(37px + 80.5%);left: 2%;}


.move_koma {
  background: rgba(228, 0, 0, 0.3);
  transition: 0.4s;
}
.shogi_koma ul li {
  position: absolute;
  transition: 0.4s;
  z-index: 10;
}
.shogi_koma ul li p {
    display: inline-block;
    border-bottom: 19px solid #634042;
    border-left: 2px solid transparent;
    border-right: 2px solid transparent;
    height: 0;
    width: 18px;
    color: #fff;
    z-index: 1000;
    font-size: 0.95rem!important;
    position: relative;
    line-height: 1.1!important;
    padding-left: 2.5px;
}
.shogi_koma ul li p:before {
    content: "";
    position: absolute;
    height: 0;
    width: 0;
    top: -4px;
    left: 0px;
    border-width: 0px 10px 4px;
    border-style: solid;
    border-color: transparent transparent #634042;
}

.stand_s {
    width: 60%;
    height: 35px;
    border-bottom: 2px solid #2d1b1c;
    border-left: 2px solid #2d1b1c;
    border-right: 2px solid #2d1b1c;
    background-image: url("/fujiisouta/kifu_tsunagi/images/dai_3.jpg");
    background-position: right;
    background-size: cover;
    position: absolute;
    bottom: -37px;
    right: 0;
}

.stand_b {
    width: 60%;
    height: 35px;
    border-top: 2px solid #2d1b1c;
    border-left: 2px solid #2d1b1c;
    border-right: 2px solid #2d1b1c;
    background-image: url("/fujiisouta/kifu_tsunagi/images/dai_3.jpg");
    background-position: top;
    background-size: cover;
}

.shogiban_area{
  max-width: 320px;
  position: relative;
  margin: 15px auto 45px;
}
.shogi_text_top a:before{
    content: "\f09a";
    font-family: "icomoon";
    margin-right: 2px;
}
.shogi_text_top a:after{
    content: "\f08e";
    font-family: "icomoon";
    margin-left: 3px;
}
.shogi_text_top a{
  display: block;
  font-size: 1rem!important;
  margin-top: 5px;
}
.shogi_text_top p{
  font-size: 1rem!important;
}
.shogi_text_top{
  position: relative;
  margin-top: 10px;
  font-size: 1rem;
  text-align: center;
  min-height: 46px;
}



.tLink {
  text-decoration: underline;
    color: #1da1f2;
}

.koma_2,.koma_3,.koma_4,.koma_5,.koma_6 {
    display: none;
    position: absolute;
    top: 0;
    left: 8.4%;
    color: #fff;
    text-shadow: 1px 1px 0 #000, -1px 1px 0 #000, 1px -1px 0 #000, -1px -1px 0 #000;
    z-index: 15;
}
.koma_2_2,.koma_2_3 {
    display: none;
    position: absolute;
    top: 0;
    left: 18.4%;
    color: #fff;
    text-shadow: 1px 1px 0 #000, -1px 1px 0 #000, 1px -1px 0 #000, -1px -1px 0 #000;
    z-index: 15;
}

.koma_s_1_2,.koma_s_1_3 {
    display: none;
    position: absolute;
    bottom: -17px;
    right: 1.5%;
    color: #fff;
    text-shadow: 1px 1px 0 #000, -1px 1px 0 #000, 1px -1px 0 #000, -1px -1px 0 #000;
    z-index: 15;
}
.koma_s_2_2 {
    display: none;
    position: absolute;
    bottom: -17px;
    right: 11%;
    color: #fff;
    text-shadow: 1px 1px 0 #000, -1px 1px 0 #000, 1px -1px 0 #000, -1px -1px 0 #000;
    z-index: 15;
}
.koma_s_3_2 {
    display: none;
    position: absolute;
    bottom: -17px;
    right: 21%;
    color: #fff;
    text-shadow: 1px 1px 0 #000, -1px 1px 0 #000, 1px -1px 0 #000, -1px -1px 0 #000;
    z-index: 15;
}

.btn_hidden{
  visibility: hidden;
}
.shogiArea{
  margin-bottom: 40px;
  margin-top: 35px;
}
.shogiArea > ul{
  /*display: flex;*/
}

.shogi_btn li p {
    border: 1px solid #2d1b1c;
    text-align: center;
    padding: 1px 5px 3px;
    line-height: 1.2!important;
    background: #887f7a;
    border-radius: 4px;
    box-shadow: inset 0 2px 0 rgba(255,255,255,0.2), inset 0 -2px 0 rgba(0, 0, 0, 0.05);
    border: solid 2px #665f5c;
    color: #fff;
    user-select: none;
    -moz-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
}
.shogi_btn li:hover{
  cursor: pointer;
}
.shogi_btn li:hover p{
    background: #8c654e;
}
.shogi_btn li{
  display: inline-block;
  margin:0 5px;
}
.shogi_btn {
    font-size: 0.9rem;
    text-align: center;
}
.shogi_btn .fa-caret-left,.shogi_btn .fa-caret-right {
  font-size: 1rem;
  line-height: 0;
}
.shogi_btn li p.active{
    background: #542a12;
    border: solid 2px #230d04;
}
.koma_nari{
  color: #ff2d38!important;
}

.shogiArea > ul > li{
  margin: 0 15px;
}
.shogiArea > ul{
  display: flex;
  justify-content: center;
}
.kifu_list_title {
    background: rgba(224,212,204,1);
    font-weight: bold!important;
    border-bottom: 2px solid #4c1e20;
    font-size: 1.1rem;
    text-align: center;
    padding: 4px 0px;
}
.kifu_list ul li:nth-child(even) {
    background: rgba(224,212,204,0.2);
}
.kifu_list ul li p:nth-child(1) {
    width: 19%;
    margin-left: 1%;
    border-right: 1px dashed #4c1e20;
    margin-right: 2%;
}
.kifu_list ul li p:nth-child(2){width: 26%}
.kifu_list ul li p:nth-child(3){
  width: 55%;
  margin-left: 1%;
  border-left: 1px dashed #4c1e20;
  padding-left: 2%;
}
.kifu_list{
  max-width: 320px;
  border: 2px solid #4c1e20;
    margin-top: 15px;
}
.kifu_list ul{
  max-height: 390px;
  overflow-y: scroll;
}
.kifu_list ul li:last-child{
  border-bottom: unset;
}
.kifu_list ul li{
  display: flex;
  border-bottom: 1px solid #4c1e20;
      padding: 3px 0px;
      min-width: 302px;
}
.kifu_list ul li p a:after{
    content: "\f08e";
    font-family: "icomoon";
    margin-left: 3px;
}

.text_koma{
    color: #4c1e20;
    text-shadow: 1px 1px 1px #ccc;
}

.kifu_list2 ul li:nth-child(even) {
    background: rgba(224,212,204,0.2);
}
.kifu_list2 ul li p:nth-child(1) {
    width: 62px;
    margin-left: 1%;
    border-right: 1px dashed #4c1e20;
    margin-right: 2%;
}
.kifu_list2 ul li p:nth-child(2){width: calc(50% - 31px)}
.kifu_list2 ul li p:nth-child(3){
  width: calc(50% - 31px);
  margin-left: 1%;
  border-left: 1px dashed #4c1e20;
  padding-left: 2%;
}
.kifu_list2 {
  max-width: 500px;
  border: 2px solid #4c1e20;
  margin: 15px auto 0;
}
.kifu_list2 ul{
  max-height: 300px;
  overflow-y: scroll;
}
.kifu_list2 ul li:last-child{
  border-bottom: unset;
}
.kifu_list2 ul li{
  display: flex;
  border-bottom: 1px solid #4c1e20;
      padding: 3px 0px;
      min-width: 302px;
}
.kifu_list2 ul li p a:before{
    content: "\f09a";
    font-family: "icomoon";
    margin-right: 2px;
}


.kifu_list3 ul li:first-child {
    background: rgba(224,212,204,1);
    font-weight: bold!important;
    border-bottom: 2px solid #4c1e20;
}
.kifu_list3 ul li:nth-child(even) {
}
.kifu_list3 ul li p {
  padding:4px 0;
}
.kifu_list3 ul li p:nth-child(1) {
    width: 38%;
    padding-left: 2%;
    border-right: 1px dashed #4c1e20;
    text-align: left;
}
.kifu_list3 ul li p:nth-child(2){
    width: 10%;
    text-align: center;
    border-right: 2px solid #4c1e20;
}
.kifu_list3 ul li p:nth-child(3) {
    width: 38%;
    padding-left: 2%;
    border-right: 1px dashed #4c1e20;
    text-align: left;
    background: rgba(224,212,204,0.2);
}
.kifu_list3 ul li p:nth-child(4){
    width: 10%;
    text-align: center;
    background: rgba(224,212,204,0.2);
}
.kifu_list3 ul li:first-child p:nth-child(1),.kifu_list3 ul li:first-child p:nth-child(3) {
  padding-left: 0;
    width: 40%;
  text-align: center;
}
.kifu_list3 {
  max-width: 500px;
  border: 2px solid #4c1e20;
  margin: 0 auto 20px;
}
.kifu_list3 ul li:last-child{
  border-bottom: unset;
}
.kifu_list3 ul li{
  display: flex;
  border-bottom: 1px solid #4c1e20;
      min-width: 302px;
}


.kifu_list_titl2 {
    background: rgba(224,212,204,1);
    font-weight: bold!important;
    border-bottom: 2px solid #4c1e20;
    font-size: 1rem;
    text-align: center;
    padding: 4px 0px;
}

.shogi_kigou li{
  position: absolute;
  color: #fff;
  text-shadow: 0 0 4px #2d1b1c, 0 0 4px #2D1B17, 0 0 7px #fff, 0 0 0px #2d1b1c, 0 0 0px #2d1b1c, 0 0 0px #2d1b1c;
  z-index: 10;
}
.kigou_y_9{top: calc(29px + 0%);left: 4.5%;}
.kigou_y_8{top: calc(29px + 0%);left: 15.5%;}
.kigou_y_7{top: calc(29px + 0%);left: 26.5%;}
.kigou_y_6{top: calc(29px + 0%);left: 37.5%;}
.kigou_y_5{top: calc(29px + 0%);left: 48.5%;}
.kigou_y_4{top: calc(29px + 0%);left: 59.5%;}
.kigou_y_3{top: calc(29px + 0%);left: 70.5%;}
.kigou_y_2{top: calc(29px + 0%);left: 81.5%;}
.kigou_y_1{top: calc(29px + 0%);left: 92.5%;}
.kigou_t_9{top: calc(29px + 84%);right: -8px}
.kigou_t_8{top: calc(29px + 74%);right: -8px}
.kigou_t_7{top: calc(29px + 64%);right: -8px}
.kigou_t_6{top: calc(29px + 54%);right: -8px}
.kigou_t_5{top: calc(29px + 44%);right: -8px}
.kigou_t_4{top: calc(29px + 34%);right: -8px}
.kigou_t_3{top: calc(29px + 24%);right: -8px}
.kigou_t_2{top: calc(29px + 14%);right: -8px}
.kigou_t_1{top: calc(29px + 5%);right: -8px}

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

.shogiArea > ul{
  display: block;
}
.shogiArea > ul > li{
  margin: 0;
}
.kifu_list {
    margin: 30px auto 0;
}
.kifu_list ul {
    max-height: 390px;
}
.kifu_list2 {
    margin: 30px auto 0;
}
.kifu_list2 ul {
    max-height: 300px;
}

.kifu_list2 ul li p:nth-child(1) {
    width: 54px;
}
.kifu_list2 ul li p:nth-child(2){width: calc(50% - 27px)}
.kifu_list2 ul li p:nth-child(3){
  width: calc(50% - 27px);
}







}