/*　基本設定　*/
body { 
    font-family:"Arial", sans-serif;  
    width:100%; 
    padding:0px;
    margin:0;
}
body.b_operate {    /*　操作側　*/
    width:100%; 
    display:flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center!important;
    background-color:#ddd;
}
body.b_display {     /*　表示側　*/ 
    width:1920px; 
    height:1080px; 
    display:flex; 
    align-items:flex-end;/*　縦下寄せ　*/
    justify-content:left;/*　横左寄せ　*/
    background:transparent; 
}

/*　index.htmlの上部　*/
.controls {
    position: relative;
    width:100%;
    display:block;
    padding:30px;
    background:#d11122;
}
/*
.controls .opa-title #raceTitle {
    width:auto;
    display:inline-block;
    margin-right:10px;
    font-size:26px; 
    font-weight:bold; 
    margin-bottom:15px; 
    color:#fff;
}*/
.controls h4 {
    position:absolute;
    display:inline-block;
    border:1px solid #fff;
    padding:2px 5px;
    font-weight:500;
    font-size:12px;
    z-index:2;
    top:0;
    left:10px;
    color:#fff;
}
.controls .opa-title h3 {/*　モジュール名　*/
    width:auto;
    display:inline-block;
    font-size:26px; 
    font-weight:bold; 
    margin-bottom:15px; 
    color:#fff;
}
input, button { /*　入力部分　*/
    padding:8px 12px; 
    margin:3px; 
    font-size:22px; 
    font-weight:600;
}
input {
    width:600px;
}

/*　検索履歴表示　*/
#historyWrapper {
  width:100%;
  padding:15px 30px;
  margin-bottom:30px;
  background:#fff;
}
#historyWrapper p {
    font-size: 18px !important;
    float: left;
}





/*　検索結果を表示する部分　操作側・表示側　共通　*/
div.contents {     /*中央下に表示する設定　*/
    width:1600px;   /*ここで表示エリアの幅を指定　*/
    margin-left:auto;
    margin-right:auto;
    margin-bottom:139px;
    display:block;
}
/*　表示側ではタイトル非表示　*/
div.contents h2 { 
    display:none;
}
/*　これなんだったっけ？　*/
div.ope {
    width:1600px;
    margin-left:auto;
    margin-right:auto;
    margin-bottom:auto;
    display:block;
}



/*　リスト部分　*/
.escape-container {
  padding:0;
  width:100%;
  box-sizing: border-box;
  display: flex;
  flex-wrap: wrap;
  gap:8px 10px;
  justify-content: flex-start; /* 基本は左寄せ */
}
/* 個別カード */
.escape-card {
    width: calc(50% - 10px);   /* 2カラム */
    background:#fff;
    font-size:18px;
    font-weight:600;
    display:flex;   
    /*margin-bottom:8px;*/
    box-sizing: border-box;
    filter: drop-shadow(0 5px 5px rgba(0, 0, 0, 0.2));
}
/* 子要素が1つだけなら中央寄せ */
.escape-container > div:only-child {
  margin: 0 auto;
}
.escape-card div {
    padding:6px 8px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.escape-card div:nth-child(1) {   /*　ゼッケン　*/
    width:45px;
    background:#d11122;
    color:#fff;
}
.escape-card div:nth-child(2) {   /*　選手　*/
    /*background:#fff;*/
    background:rgba(255, 255, 255, 0.7);
    width:calc( 100% - 45px - 80px - 370px );
    justify-content: flex-start;
}
.escape-card div:nth-child(3) {   /*　国　*/
    width:80px;
    font-size:15px;
    font-weight:500;
    background:#fff;
}
.escape-card div:nth-child(4) {
    width:370px;
    background:#f7686a;
    color:#fff;
    justify-content: flex-start;
    font-size:16px;
    font-weight:500;
}