@charset "UTF-8";
header {
  border-bottom: 5px solid #A8C77F; }

#map .gray-box {
  margin-top: 30px; }

.ippan {
  margin-top: 10px; }

.gray-box {
  padding-top: 20px !important; }
  .gray-box.ippan dl {
    display: table;
    background-color: #fff;
    width: 100%;
    margin-bottom: 2px;
    line-height: 1;
    padding: 10px; }
  .gray-box.ippan dl dt {
    text-align: center;
    background-color: #525252;
    color: #fff;
    display: table-cell;
    vertical-align: middle;
    padding: 0 10px;
    display: none; }
    .gray-box.ippan dl dt.number {
      display: block;
      padding: 3px 10px;
      float: left;
      margin-right: 10px;
      width: 20%; }
      @media only screen and (max-width: 640px) {
        .gray-box.ippan dl dt.number {
          width: 30%;
          font-size: 10.5px;
          padding: 5px 10px;
          line-height: 1.5; } }
  .gray-box .listlink {
    display: block;
    background: url(/tgs/2017/public/common/images/listarrow.png) no-repeat right center;
    background-size: auto 100%;
    padding: 10px; }
    @media only screen and (max-width: 640px) {
      .gray-box .listlink {
        background-size: auto 22px; } }
  .gray-box.ippan dl dd {
    vertical-align: middle;
    display: table-cell;
    padding: 0; }
  .gray-box.ippan dl dd.pd {
    padding-left: 10px;
    line-height: 1.5;
    width: 100%; }
    @media only screen and (max-width: 640px) {
      .gray-box.ippan dl dd.pd {
        padding-right: 24px; } }
  .gray-box.ippan dl dd.pd a {
    display: inline-block;
    padding-right: 20px;
    color: #095478; }
  .gray-box.ippan dl dd .iright {
    float: right;
    display: inline-block;
    padding: 1px; }
  .gray-box.ippan dl dd .iright img {
    vertical-align: bottom; }

.searchbox {
  background-color: #e2e8eb;
  border-radius: 15px;
  padding: 15px;
  margin-bottom: 10px; }
  .searchbox .title {
    color: #4f4552;
    font-weight: bold;
    margin-bottom: 10px; }
  .searchbox .sbtn {
    background-color: #a8c77f;
    color: #fff;
    padding: 10px;
    width: 100%;
    cursor: pointer; }
    .searchbox .sbtn:hover {
      padding-left: 15px;
      background-color: #CBD4C0; }
    .searchbox .sbtn option {
      background-color: white;
      color: gray;
      padding: 10px 15px;
      cursor: pointer; }
    .searchbox .sbtn option:hover {
      color: #CBD4C0;
      padding-left: 15px; }
  .searchbox .slinks li {
    text-align: center;
    display: inline-block;
    padding: 0 5px;
    font-size: 14px;
    border-left: 1px solid #095478; }
  .searchbox .slinks a {
    color: #095478; }

.btitle {
  padding: 5px;
  color: #fff;
  background-color: #6ea1db; }

.ititle {
  font-size: 27px;
  color: #4f4552;
  line-height: 1.2;
  margin-bottom: 15px; }

#detailbox {
  width: auto;
  border: 8px #f6f6f6 solid;
  margin: 0 auto;
  padding: 30px;
  background-color: #fff; }
  @media only screen and (max-width: 640px) {
    #detailbox {
      padding: 15px; } }
  #detailbox .grd-box {
    margin-top: 30px;
    padding-top: 20px;
    background-color: #e1e6e2; }
  #detailbox .name {
    font-size: 28px;
    color: #00557f;
    font-weight: bold;
    display: inline-block;
    vertical-align: middle;
    margin-bottom: 30px; }
    @media only screen and (max-width: 640px) {
      #detailbox .name {
        font-size: 18px; } }
  #detailbox .koma {
    background-color: #f6f6f6;
    display: inline-block;
    font-size: 14px;
    padding: 5px;
    vertical-align: middle;
    margin-left: 10px;
    display: none; }
    @media only screen and (max-width: 640px) {
      #detailbox .koma {
        display: none;
        margin-left: 0;
        margin-bottom: 5px; } }
  #detailbox .icon-blue {
    background-color: #6d6d6d;
    padding: 3px 5px;
    font-size: 13px;
    color: #fff; }
    @media only screen and (max-width: 640px) {
      #detailbox .icon-blue {
        display: block;
        margin-left: 0;
        margin-bottom: 5px; } }
  #detailbox .link-btn {
    font-size: 12px;
    color: #e74388;
    padding: 4px 4px 2px 22px;
    background: url(../images/g_arrow.svg) no-repeat 5px center #fff;
    background-size: auto 70%;
    border-bottom: 2px solid #cccccc;
    margin-left: 10px;
    word-break: break-all; }
    @media only screen and (max-width: 640px) {
      #detailbox .link-btn {
        background-size: 15px;
        display: block;
        width: 100%;
        margin-left: 0; } }
  #detailbox .text {
    color: #095478;
    font-size: 14px;
    margin-top: 20px; }
  #detailbox .left {
    width: 650px;
    float: left; }
    @media only screen and (max-width: 640px) {
      #detailbox .left {
        width: 100%; } }
  #detailbox .right {
    width: 200px;
    float: right;
    font-size: 12px; }
    @media only screen and (max-width: 640px) {
      #detailbox .right {
        margin-bottom: 10px;
        width: 100%; } }
  #detailbox .right p {
    text-align: center;
    margin-top: 5px; }
  #detailbox #addbox {
    height: auto;
    width: 100%;
    margin-top: 20px; }
    #detailbox #addbox:after {
      display: block;
      clear: both;
      content: ""; }
    #detailbox #addbox dl {
      width: 210px;
      float: left;
      margin-right: 20px; }
      #detailbox #addbox dl:last-child {
        margin-right: 0px; }
      @media only screen and (max-width: 640px) {
        #detailbox #addbox dl {
          width: 100%;
          margin-bottom: 10px; } }
    #detailbox #addbox dl dt {
      background-color: #a4c17f;
      text-align: center;
      color: #fff;
      font-size: 14px; }
    #detailbox #addbox dl dd {
      background-color: #e1e6e2;
      font-size: 13px;
      text-align: center;
      padding-top: 40px;
      padding-bottom: 40px; }
  #detailbox .grdbox {
    margin-top: 30px;
    padding-top: 20px; }
    @media only screen and (max-width: 640px) {
      #detailbox .grdbox {
        padding: 20px 10px 10px; } }
  #detailbox .title {
    font-size: 12px;
    border-bottom: 1px solid #fff;
    margin-bottom: 10px; }
    #detailbox .title span {
      font-size: 22px;
      display: inline-block;
      margin-right: 10px; }
      @media only screen and (max-width: 640px) {
        #detailbox .title span {
          display: block; } }
  #detailbox table {
    width: 100%;
    margin-top: 10px;
    font-size: 12px; }
    @media only screen and (max-width: 640px) {
      #detailbox table.booth .tit01:before {
        display: block;
        content: "イベント名"; } }
    @media only screen and (max-width: 640px) {
      #detailbox table.booth .tit02:before {
        display: block;
        content: "日時"; } }
    @media only screen and (max-width: 640px) {
      #detailbox table.booth .tit03:before {
        display: block;
        content: "イベント内容"; } }
    @media only screen and (max-width: 640px) {
      #detailbox table.booth .tit04:before {
        display: block;
        content: "出演者名など"; } }
    @media only screen and (max-width: 640px) {
      #detailbox table.syuten .tit01:before {
        display: block;
        content: "出展タイトル"; } }
    @media only screen and (max-width: 640px) {
      #detailbox table.syuten .tit02:before {
        display: block;
        content: "ジャンル"; } }
    @media only screen and (max-width: 640px) {
      #detailbox table.syuten .tit03:before {
        display: block;
        content: "発売日/配信日"; } }
    @media only screen and (max-width: 640px) {
      #detailbox table.syuten .tit04:before {
        display: block;
        content: "プラットフォーム"; } }
    @media only screen and (max-width: 640px) {
      #detailbox table.syuten .tit05:before {
        display: block;
        content: "VR対応"; } }
    @media only screen and (max-width: 640px) {
      #detailbox table.syuten .tit06:before {
        display: block;
        content: "備考欄"; } }
    @media only screen and (max-width: 640px) {
      #detailbox table.sale .tit01:before {
        display: block;
        content: "商品名"; } }
    @media only screen and (max-width: 640px) {
      #detailbox table.sale .tit02:before {
        display: block;
        content: "価格"; } }
    @media only screen and (max-width: 640px) {
      #detailbox table.sale .tit03:before {
        display: block;
        content: "備考欄"; } }
  #detailbox table th {
    border-bottom: 5px solid #fff;
    padding-bottom: 5px; }
    @media only screen and (max-width: 640px) {
      #detailbox table th {
        display: none; } }
  #detailbox table th:nth-child(2n) {
    border-bottom: 5px solid #ededed; }
  #detailbox table td {
    vertical-align: middle;
    padding-top: 10px;
    padding-bottom: 10px;
    border-bottom: 1px solid #fff; }
    @media only screen and (max-width: 640px) {
      #detailbox table td {
        display: block;
        width: 100%; } }

.gray-box {
  width: 100%;
  overflow: hidden;
  border-radius: 15px;
  -webkit-border-radius: 15px;
  -moz-border-radius: 15px;
  padding: 20px 28px 28px;
  background-color: #e1e6e2;
  margin-top: 30px; }
  @media only screen and (max-width: 640px) {
    .gray-box {
      padding: 20px 10px 10px; } }
  .gray-box.secbox {
    margin-top: 30px; }

.syuten th, .booth th, .sale th {
  color: #000;
  font-family: "UD Shin Go NT Medium"; }

table td, table th {
  padding: 8px !important; }

#food, .gray-box {
  margin-top: 40px; }

.food-dl {
  width: 100%;
  display: block;
  overflow: hidden; }
  .food-dl > dt {
    font-size: 21px; }
    @media only screen and (max-width: 640px) {
      .food-dl > dt {
        font-size: 18px; } }
    .food-dl > dt > h3 {
      border-bottom: 3px solid #5fbac0;
      display: inline-block; }
  .food-dl > dd {
    margin-top: 5px;
    padding-top: 7px; }
    .food-dl > dd > ul {
      display: block;
      overflow: hidden;
      width: 100%; }
      .food-dl > dd > ul > li {
        width: 31%;
        float: left;
        margin-left: 20px;
        margin-top: 20px; }
        @media only screen and (max-width: 640px) {
          .food-dl > dd > ul > li {
            width: 45%; } }
        .food-dl > dd > ul > li > p:nth-of-type(1) {
          font-size: 18px;
          color: #6ea1db;
          font-weight: 500;
          margin-top: 5px; }
          @media only screen and (max-width: 640px) {
            .food-dl > dd > ul > li > p:nth-of-type(1) {
              font-size: 14px; } }
        .food-dl > dd > ul > li > img {
          width: 100%; }
      .food-dl > dd > ul > li:nth-of-type(1) {
        margin-left: 0;
        margin-top: 0; }
      .food-dl > dd > ul > li:nth-of-type(2) {
        margin-top: 0; }
      .food-dl > dd > ul > li:nth-of-type(3) {
        margin-top: 0; }
        @media only screen and (max-width: 640px) {
          .food-dl > dd > ul > li:nth-of-type(3) {
            margin-top: 20px;
            margin-left: 0; } }
      .food-dl > dd > ul > li:nth-of-type(4) {
        margin-left: 0; }
        @media only screen and (max-width: 640px) {
          .food-dl > dd > ul > li:nth-of-type(4) {
            margin-top: 20px;
            margin-left: 20px; } }
      .food-dl > dd > ul > li:nth-of-type(7) {
        margin-left: 0; }
      .food-dl > dd > ul > li:nth-of-type(10), .food-dl > dd > ul > li:nth-of-type(13) {
        margin-left: 0; }
        @media only screen and (max-width: 640px) {
          .food-dl > dd > ul > li:nth-of-type(10), .food-dl > dd > ul > li:nth-of-type(13) {
            margin-top: 20px;
            margin-left: 20px; } }
      @media only screen and (max-width: 640px) {
        .food-dl > dd > ul > li:nth-child(odd) {
          margin-left: 0; } }

.food-dl:nth-of-type(2) {
  margin-top: 40px; }

.foodt {
  line-height: 1.2; }

.foodh {
  margin-top: 5px; }

.link-btn-pmap {
  font-size: 12px;
  color: #e74388;
  padding: 4px 4px 2px 22px;
  background: url(../images/listarrow.png) no-repeat center #fff;
  background-size: auto 100%;
  background-color: #555555; }

.karaagewrap {
  width: 100%; }

.karaage {
  overflow: hidden;
  width: 100% !important; }
  .karaage .itemname {
    color: #6ea1db;
    font-size: 18px; }
  .karaage dt {
    width: 31%;
    float: left; }
    @media only screen and (max-width: 640px) {
      .karaage dt {
        width: 50%; } }
    .karaage dt img {
      width: 100%; }
  .karaage dd {
    margin-left: 32%; }
    @media only screen and (max-width: 640px) {
      .karaage dd {
        width: 53%; } }

.mapinfo {
  background: url(http://4c281b16296b2ab02a4e0b2e3f75446d.cdnext.stream.ne.jp/tgs/2017/public/01_map.jpg) no-repeat top left;
  background-size: 100% auto;
  width: 100%;
  height: 652px;
  position: relative; }
  @media only screen and (max-width: 640px) {
    .mapinfo {
      background-size: 100% 100%;
      height: 352px; } }
  .mapinfo > div {
    position: absolute;
    border: #fff 3px solid; }
    .mapinfo > div p {
      display: table;
      vertical-align: middle;
      text-align: center;
      width: 100%;
      height: 100%; }
    .mapinfo > div a {
      vertical-align: middle;
      text-align: center;
      width: 100%;
      height: 100%;
      display: table-cell;
      color: #fff;
      font-size: 22px;
      font-family: "UD Shin Go NT DemiBold", UD Shin Go NT DemiBold; }
      @media only screen and (max-width: 640px) {
        .mapinfo > div a {
          font-size: 12px; } }
  .mapinfo .hallall {
    top: 82.38%;
    left: 2.3%;
    width: 25.77%;
    height: 16%;
    background: rgba(79, 69, 82, 0.95);
    z-index: 3; }
  .mapinfo .hall1_3 {
    top: 1.5%;
    left: 63.3%;
    width: 34.77%;
    height: 20%;
    background: rgba(79, 69, 82, 0.95);
    z-index: 3; }
  .mapinfo .hall4_6 {
    top: 1.5%;
    left: 27.3%;
    width: 33.77%;
    height: 20%;
    background: rgba(79, 69, 82, 0.95);
    z-index: 3; }
  .mapinfo .hall7_8 {
    top: 1.5%;
    left: 2.3%;
    width: 23.77%;
    height: 20%;
    background: rgba(79, 69, 82, 0.95);
    z-index: 3; }
  .mapinfo .hall9_11 {
    top: 56.5%;
    left: 52.3%;
    width: 24.77%;
    height: 42%;
    background: rgba(79, 69, 82, 0.95);
    z-index: 3; }
  .mapinfo .hallbus {
    top: 22%;
    left: 24.3%;
    width: 23.77%;
    z-index: 3;
    height: 15%;
    position: absolute;
    border: 0px none; }
    @media only screen and (max-width: 640px) {
      .mapinfo .hallbus {
        height: 22%;
        left: 21.3%;
        width: 25.77%; } }
    .mapinfo .hallbus .hallbus_in {
      height: 100%;
      position: relative;
      display: inline-block;
      margin: 1.5em 0;
      padding: 7px 10px;
      min-width: 100%;
      max-width: 100%;
      background: #5854a3;
      border: solid 3px #fff;
      -webkit-box-sizing: border-box;
      box-sizing: border-box; }
      .mapinfo .hallbus .hallbus_in:before {
        content: "";
        position: absolute;
        top: -24px;
        left: 50%;
        margin-left: -15px;
        border: 12px solid transparent;
        border-bottom: 12px solid #5854a3;
        z-index: 2; }
      .mapinfo .hallbus .hallbus_in:after {
        content: "";
        position: absolute;
        top: -30px;
        left: 50%;
        margin-left: -17px;
        border: 14px solid transparent;
        border-bottom: 14px solid #fff;
        z-index: 1; }
    .mapinfo .hallbus a {
      font-size: 15px; }
      @media only screen and (max-width: 640px) {
        .mapinfo .hallbus a {
          font-size: 10.5px; } }
  .mapinfo .hallnew {
    top: 22%;
    left: 49.3%;
    width: 23.77%;
    z-index: 3;
    position: absolute;
    border: 0px none;
    height: 15%; }
    @media only screen and (max-width: 640px) {
      .mapinfo .hallnew {
        height: 22%; } }
    .mapinfo .hallnew .hallnew_in {
      position: relative;
      display: inline-block;
      margin: 1.5em 0;
      padding: 7px 10px;
      min-width: 100%;
      max-width: 100%;
      height: 100%;
      background: #5854a3;
      border: solid 3px #fff;
      -webkit-box-sizing: border-box;
      box-sizing: border-box; }
      .mapinfo .hallnew .hallnew_in:before {
        content: "";
        position: absolute;
        top: -24px;
        left: 83%;
        margin-left: -15px;
        border: 12px solid transparent;
        border-bottom: 12px solid #5854a3;
        z-index: 2; }
      .mapinfo .hallnew .hallnew_in:after {
        content: "";
        position: absolute;
        top: -30px;
        left: 83%;
        margin-left: -17px;
        border: 14px solid transparent;
        border-bottom: 14px solid #fff;
        z-index: 1; }
    .mapinfo .hallnew a {
      font-size: 15px; }
      @media only screen and (max-width: 640px) {
        .mapinfo .hallnew a {
          font-size: 10.5px; } }
  .mapinfo .hallgame {
    top: 22%;
    left: 74.3%;
    width: 23.77%;
    z-index: 3;
    position: absolute;
    border: 0px none;
    height: 15%; }
    @media only screen and (max-width: 640px) {
      .mapinfo .hallgame {
        height: 22%; } }
    .mapinfo .hallgame .hallgame_in {
      position: relative;
      display: inline-block;
      margin: 1.5em 0;
      padding: 7px 10px;
      min-width: 100%;
      max-width: 100%;
      height: 100%;
      background: #46b034;
      border: solid 3px #fff;
      -webkit-box-sizing: border-box;
      box-sizing: border-box; }
      .mapinfo .hallgame .hallgame_in:before {
        content: "";
        position: absolute;
        top: -24px;
        left: 50%;
        margin-left: -15px;
        border: 12px solid transparent;
        border-bottom: 12px solid #46b034;
        z-index: 2; }
      .mapinfo .hallgame .hallgame_in:after {
        content: "";
        position: absolute;
        top: -30px;
        left: 50%;
        margin-left: -17px;
        border: 14px solid transparent;
        border-bottom: 14px solid #fff;
        z-index: 1; }
    .mapinfo .hallgame a {
      font-size: 15px; }
      @media only screen and (max-width: 640px) {
        .mapinfo .hallgame a {
          font-size: 10.5px; } }

.darkbox {
  overflow: hidden;
  width: 100%;
  margin: 13px 0 0 -20px; }
  .darkbox > li {
    width: 25%;
    float: left; }
    @media only screen and (max-width: 640px) {
      .darkbox > li {
        width: 50%; } }
    .darkbox > li p {
      padding-left: 20px; }
      .darkbox > li p a {
        background: #4f4552 url(/tgs/2017/common/images/g_arrow.png) left 5px center no-repeat;
        background-size: auto 70%;
        display: block;
        color: #fff;
        border-bottom: 3px #c0c0c0 solid;
        padding: 5px 0 5px 32px; }

.bluebox {
  overflow: hidden;
  width: 100%;
  margin: 13px 0 0 -20px; }
  .bluebox > li {
    float: left; }
    .bluebox > li p {
      padding-left: 20px; }
      .bluebox > li p a {
        background: #5854a3 url(/tgs/2017/common/images/g_arrow.png) left 5px center no-repeat;
        background-size: auto 70%;
        display: block;
        color: #fff;
        border-bottom: 3px #c0c0c0 solid;
        padding: 5px 32px 5px 32px; }

.greenbox {
  overflow: hidden;
  width: 100%;
  margin: 13px 0 0 -20px; }
  .greenbox > li {
    float: left; }
    .greenbox > li p {
      padding-left: 20px; }
      .greenbox > li p a {
        background: #46b034 url(/tgs/2017/common/images/g_arrow.png) left 5px center no-repeat;
        background-size: auto 70%;
        display: block;
        color: #fff;
        border-bottom: 3px #c0c0c0 solid;
        padding: 5px 32px 5px 32px; }

.inbox {
  width: 100%; }
  .inbox img {
    width: 100%; }