@charset "UTF-8";

body {
margin:0;
padding:0;
font-family: 'Noto Sans JP', 'Hiragino Sans', 'Hiragino Kaku Gothic ProN', Meiryo, 'sans-serif';
font-size:12px;
    letter-spacing: 1px;
    line-height: 18px;
}

img {
width:100%;
vertical-align:top;
}

table, td, th { border-collapse:collapse;
border: 1px #494949 solid;
}

table {
width:90%;
margin:0 auto;
}

    th {
    width:50%;
    line-height:250%;
    }

    td {
    width:50%;
    line-height:250%;
    text-align:center;
        font-weight:bold;
    }

    div.crowdicon_ex img {
    width:80%;
    }

    div.fl_w20 {
    text-align:center;
    }

    div.fl_w20 p {
    font-size: 9px;
    letter-spacing: -1px;
    margin: 1em auto;
    font-weight: bold;
    }

/*//////// header //////////*/

header{
margin-bottom:20px;
}

header .all_box {
background-color:#029d9a;
border-bottom:10px solid #0264a6;
height:50px;
display:flex;
align-items:center;
}

header .header_box {
max-width:640px;
margin:0 auto;
display:flex;
align-items:center;
}

header .header_box .back{
width:5%;
margin-left:5%;
opacity: 0.75;
}

header .logobox {
width:60%;
margin:0 auto;
padding-top:10px;
padding-bottom:10px;
}

header .logobox img{
    width: 640px;
}

/*//////// footer //////////*/

footer {
background-color:#029d9a;
border-top:10px solid #0264a6;
margin-top:auto;
}

footer .footer_box {
max-width:640px;
margin:0 auto;
}

footer .logobox {
font-size:10px;
color:#fff;
margin:0 auto;
padding-top:5px;
padding-bottom:5px;
    text-align: center;
}



/*//////// TOP //////////*/
#wrapper {
    position: relative;
    flex: 1;
}

#top {
    width: 96%;
margin-top:0;
margin-bottom:auto;
margin-left:auto;
margin-right:auto;
}

#top .form {
    border: solid 2px #0264a6;
    border-radius: 10px;
    margin: 20px auto;
}

#top .slick02 {
    margin-bottom: 140px;
}

#top .form .title {
    background-color: #0264a6;
    color: #fff;
    font-size: 14px;
    text-align: center;
    padding: 12px;
    font-weight: bold;
    margin-bottom: 15px;
}

#top .form .attention {
    width: 92%;
    margin: auto;
    margin-bottom: 25px;
}
#top .form .attention p {
    margin-bottom: 10px;
}

#top .form .subcaption {
    display: inline-block;
    color: #2264A6;
    margin-right: 3px;
}

#top .form dl dt span {
  display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #029d9a;
    margin-right: 3px;
}

#top form {
    width: 80%;
    margin: auto;
    margin-bottom: 30px;
}
#top form dl {
    margin-bottom: 30px;
}
#top form dl dt {
    font-size: 12px;
    margin-bottom: 2px;
}
#top form dl dd {
    margin-bottom: 15px;
    border-radius: 5px;
}
#top form dl dd#sheet_area {
    border: solid 1px;
    padding: 15px;
}

#top form input {
    width: 100%;
    border-radius: 5px;
    border: solid 1px;
    height: 40px;
    font-size: 18px;
  }

#top form input.check {
    width: auto;
    height: auto;
}

#top form div.seat_select_area {
    margin-top: 5px;
}

#top form select {
    width: 100%;
    border-radius: 5px;
    border: solid 1px;
    height: 40px;
    font-size: 18px;
}

#top .terms {
    margin-bottom: 20px;
    overflow: scroll;
    height: 130px;
    border: solid 1px;
    padding: 7px;
    font-size: 11px;
}
#top .terms .title {
    background: none;
    color: #000;
    padding: 0;
    margin-bottom: 10px;
}
#top .checkbox input[type="submit"] {
    width: 8em;
    height: 3em;
    background-color: rgb(102, 102, 102);
    color: #FFFFFF;
    border-style: none;
    cursor: pointer;
    border-radius: 5px;
    font-size: 17px;
    letter-spacing: 2px;
}
#top .checkbox p {
    text-align: center;
    padding-bottom: 10px;
}
.konzatsu {
   display: block;
    width: 100%;
    position: fixed;
    left: 0px;
    bottom: 0px;
    z-index: 9999;
    text-align: center;
    padding: 0 auto;
    right: 0;
}

.konzatsu .g_t {
    font-size: 12px;
    color: #fff;
    padding: 10px;
    text-align: center;
    font-weight: bold;
    background-color: #029d9a;
}
.konzatsu .foot_menu {
    display: flex;
    background-color: #69c6f9;
    justify-content: space-between;
}

.konzatsu .foot_menu .box {
    flex-basis: 180px;
    display: flex;
    background-color: #0264a6;
    align-items: center;
    color: #fff;
    justify-content: space-around;
   margin: 5px;
    padding: 10px
}
.konzatsu .foot_menu .box p.img {
    width: 40%;
}
.konzatsu .foot_menu .box p img {
    width: 85%;
}
.konzatsu .foot_menu .box p.txt {
    font-size: 16px;
    font-weight: bold;
        width: 60%;
}


/*//////// TOP画面IE用Datepicker //////////*/

div.ui-datepicker {
    font-size: 150%;
}
table.ui-datepicker-calendar th {
    width: auto;
    line-height: normal;
}
table.ui-datepicker-calendar td {
    width: auto;
    line-height: normal;
}


/*//////// トイレ //////////*/

.wrap {
max-width:640px;
margin:0 auto;
}

.wrap .crowd_info {
background-color: #0264a6;
    color: #fff;
    font-weight: bold;
    line-height: 250%;
    padding-left: 12px;
    margin-bottom: 10px;
    font-size: 120%;
    letter-spacing: 2px;
}

.contents {
width:92%;
margin:0 auto;
}


.toilet_detail_head{display: flex;flex-flow: row wrap;align-items: center;padding-bottom:10px;}
.mf_icon{width:8%;margin-right:2%;}

.contents .toilet_name {
font-size:14px;
font-weight:bold;
}

.contents .situation {
display:flex;
justify-content:flex-end;
text-align:center;
font-size:14px%;
font-weight:bold;
padding-bottom:20px;
}

.contents .situation div {
width:33%;
}

.contents .toilet_spec {
    width: 90%;
    margin: 0 auto;
    font-size: 14px;
    margin-bottom: 2px;
}

.contents .crowdiocn_area {
width:60%;
margin:0 auto;
padding-top:20px;
padding-bottom:5px;
}

.contents .crowdiocn_title {
font-size:22px;
font-weight:bold;
margin:0 auto;
text-align:center;
padding-top:15px;
padding-bottom:5px;
}

.contents .crowdiocn_txt {
font-size:120%;
margin:0 auto;
padding-top:5px;
padding-bottom:15px;
}

.contents .crowdicon_ex {
display:flex;
flex-flow:row wrap;
}

.contents .crowdicon_ex .fl_w20 {
width:20%;
}

.contents .txt {
margin-bottom:30px;
}


/*//////// トイレマップ関連///////*/

.floor_map{position:relative;border:1px solid #686868;margin-bottom:10px;}

.w7{width:7%}
.w12{width:12%}
.w15{width:15%}
.w18{width:18%}
.w20{width:20%}
.w25{width:25%}
.w48{width:48%}
.w50{width:50%}
.w60{width:60%}
.w80{width:80%}
.w98{width:98%}

.m0a{margin:0 auto;}

/*トイレエリア選択*/
.area_btn{position: relative;width:30%;text-align:center;padding:10px;background-color:#fff;border:1px solid #686868;border-radius:5px;}
.area_btn a {position: absolute;top: 0;left: 0;width: 100%;height: 100%;text-indent:-999px;z-index: 2;}
div#sheet2f{position:absolute;top:2%;left:9.5%}
div#sheet2f_group{position:absolute;top:30%;display:flex;flex-flow:row wrap;width:100%;justify-content: space-around;font-size:110%;font-weight:bold;}

div#sheet1f{position:absolute;top:45%;left:9.5%}
div#sheet1f_group{position:absolute;top:75%;display:flex;flex-flow:row wrap;width:100%;justify-content: space-around;font-size:110%;font-weight:bold;}



/*内野1Fトイレマップ*/
div#map108_no{position:absolute;top:45%;left:69.5%;width:8%;z-index:10;}
div#map108{position:absolute;top:45%;left:69.5%;width:8%;}
div#mark108{position:absolute;top:45%;left:79%;width:8%;}

div#map109_no{position:absolute;top:54.5%;left:69.5%;width:8%;z-index:10;}
div#map109{position:absolute;top:54.5%;left:69.5%;width:8%;}
div#mark109{position:absolute;top:54.5%;left:79%;width:8%;}

div#map120_no{position:absolute;top:63.5%;left:45.5%;width:8%;z-index:10;}
div#map120{position:absolute;top:63.5%;left:45.5%;width:8%;}
div#mark120{position:absolute;top:63.5%;left:55%;width:8%;}

div#map124_no{position:absolute;top:73%;left:40.5%;width:8%;z-index:10;}
div#map124{position:absolute;top:73%;left:40.5%;width:8%;}
div#mark124{position:absolute;top:73%;left:51%;width:8%;}

div#map133_no{position:absolute;top:62%;left:15%;width:8%;z-index:10;}
div#map133{position:absolute;top:62%;left:15%;width:8%;}
div#mark133{position:absolute;top:62%;left:24.5%;width:8%;}

div#map134_no{position:absolute;top:71.5%;left:20%;width:8%;z-index:10;}
div#map134{position:absolute;top:71.5%;left:20%;width:8%;}
div#mark134{position:absolute;top:71.5%;left:29.5%;width:8%;}

div#map142_no{position:absolute;top:21%;left:2%;width:8%;z-index:10;}
div#map142{position:absolute;top:21%;left:2%;width:8%;}
div#mark142{position:absolute;top:21%;left:11.5%;width:8%;}

div#map141_no{position:absolute;top:32.5%;left:0.5%;width:8%;z-index:10;}
div#map141{position:absolute;top:32.5%;left:0.5%;width:8%;}
div#mark141{position:absolute;top:32.5%;left:10%;width:8%;}

div#map1f05_no{position:absolute;top:52.5%;left:5%;width:8%;z-index:10;}
div#map1f05{position:absolute;top:52.5%;left:5%;width:8%;}
div#mark1f05{position:absolute;top:52.5%;left:14.5%;width:8%;}

div#map1f06_no{position:absolute;top:25%;left:74.5%;width:8%;z-index:10;}
div#map1f06{position:absolute;top:25%;left:74.5%;width:8%;}
div#mark1f06{position:absolute;top:25%;left:84%;width:8%;}

div#map1f07_no{position:absolute;top:34.5%;left:79.5%;width:8%;z-index:10;}
div#map1f07{position:absolute;top:34.5%;left:79.5%;width:8%;}
div#mark1f07{position:absolute;top:34.5%;left:89%;width:8%;}

div#map1f08_no{position:absolute;top:12.5%;left:79.5%;width:8%;z-index:10;}
div#map1f08{position:absolute;top:12.5%;left:79.5%;width:8%;}
div#mark1f08{position:absolute;top:12.5%;left:89%;width:8%;}

div#map1f09_no{position:absolute;top:2.5%;left:79.5%;width:8%;z-index:10;}
div#map1f09{position:absolute;top:2.5%;left:79.5%;width:8%;}
div#mark1f09{position:absolute;top:2.5%;left:89%;width:8%;}

div#map1f10_no{position:absolute;top:43%;left:5%;width:8%;z-index:10;}
div#map1f10{position:absolute;top:43%;left:5%;width:8%;}
div#mark1f10{position:absolute;top:43%;left:14.5%;width:8%;}


#btn_108,#btn_109,#btn_120,#btn_124,#btn_133,#btn_134,#btn_142,#btn_141,#btn_1f05,#btn_1f06,#btn_1f07,#btn_1f08,#btn_1f09,#btn_1f10,#btn_202,#btn_203_1,#bnt_204,#btn_211,#btn_203_2,#btn_210,#btn_403,#btn_406,#btn_411,#btn_404,#btn_409,#btn_412,#btn_4f04,#btn_4f05,#btn_149,#btn_162,#btn_147,#btn_148,#btn_161{position:relative;}
#btn_108 p,#btn_109 p,#btn_120 p,#btn_124 p,#btn_133 p,#btn_134 p,#btn_142 p,#btn_141 p,#btn_1f05 p,#btn_1f06 p,#btn_1f07 p,#btn_1f08 p,#btn_1f09 p,#btn_1f10 p,#btn_202 p,#btn_203_1 p,#btn_211 p,#btn_203_2 p,#btn_204 p,#btn_210 p,#btn_403 p,#btn_406 p,#btn_411 p,#btn_404 p,#btn_409 p,#btn_412 p,#btn_4f04 p,#btn_4f05 p,#btn_149 p,#btn_162 p,#btn_147 p,#btn_148 p,#btn_161 p{position:absolute;top:0;left:0;z-index:10;}

/*外野トイレマップ*/

div#map147_no{position:absolute;top:66%;left:3.5%;width:8%;z-index:10;}
div#map147{position:absolute;top:66%;left:3.5%;width:8%;}
div#mark147{position:absolute;top:66%;left:13%;width:8%;}

div#map148_no{position:absolute;top:55.5%;left:9%;width:8%;z-index:10;}
div#map148{position:absolute;top:55.5%;left:9%;width:8%;}
div#mark148{position:absolute;top:55.5%;left:18.5%;width:8%;}

div#map149_no{position:absolute;top:43%;left:15.5%;width:8%;z-index:10;}
div#map149{position:absolute;top:43%;left:15.5%;width:8%;}
div#mark149{position:absolute;top:43%;left:25%;width:8%;}

div#map161_no{position:absolute;top:38%;left:57.5%;width:8%;z-index:10;}
div#map161{position:absolute;top:38%;left:57.5%;width:8%;}
div#mark161{position:absolute;top:38%;left:67%;width:8%;}

div#map162_no{position:absolute;top:51%;left:65.5%;width:8%;z-index:10;}
div#map162{position:absolute;top:51%;left:65.5%;width:8%;}
div#mark162{position:absolute;top:51%;left:75%;width:8%;}

/*内野２Fトイレマップ*/

div#map202_no{position:absolute;top:50%;left:73.5%;width:8%;z-index:10;}
div#map202{position:absolute;top:50%;left:73.5%;width:8%;}
div#mark202{position:absolute;top:50%;left:83%;width:8%;}
div#map203_1_no{position:absolute;top:60%;left:53.5%;width:8%;z-index:10;}
div#map203_1{position:absolute;top:60%;left:53.5%;width:8%;}
div#mark203_1{position:absolute;top:60%;left:63%;width:8%;}
div#map203_2_no{position:absolute;top:70%;left:53.5%;width:8%;z-index:10;}
div#map203_2{position:absolute;top:70%;left:53.5%;width:8%;}
div#mark203_2{position:absolute;top:70%;left:63%;width:8%;}
div#map204_no{position:absolute;top:70%;left:53.5%;width:8%;z-index:10;}
div#map204{position:absolute;top:70%;left:53.5%;width:8%;}
div#mark204{position:absolute;top:70%;left:63%;width:8%;}
div#map210_no{position:absolute;top:60%;left:20.5%;width:8%;z-index:10;}
div#map210{position:absolute;top:60%;left:20.5%;width:8%;}
div#mark210{position:absolute;top:60%;left:30%;width:8%;}
div#map211_no{position:absolute;top:47%;left:7.5%;width:8%;z-index:10;}
div#map211{position:absolute;top:47%;left:7.5%;width:8%;}
div#mark211{position:absolute;top:47%;left:17%;width:8%;}

/*内野4Fトイレマップ*/

div#map403_no{position:absolute;top:35%;left:79.5%;width:8%;z-index:10;}
div#map403{position:absolute;top:35%;left:79.5%;width:8%;}
div#mark403{position:absolute;top:35%;left:89%;width:8%;}

div#map404_no{position:absolute;top:48%;left:73.5%;width:8%;z-index:10;}
div#map404{position:absolute;top:48%;left:73.5%;width:8%;}
div#mark404{position:absolute;top:48%;left:83%;width:8%;}

div#map406_no{position:absolute;top:60%;left:53.5%;width:8%;z-index:10;}
div#map406{position:absolute;top:60%;left:53.5%;width:8%;}
div#mark406{position:absolute;top:60%;left:63%;width:8%;}

div#map409_no{position:absolute;top:60%;left:20.5%;width:8%;z-index:10;}
div#map409{position:absolute;top:60%;left:20.5%;width:8%;}
div#mark409{position:absolute;top:60%;left:30%;width:8%;}

div#map411_no{position:absolute;top:50%;left:5.5%;width:8%;z-index:10;}
div#map411{position:absolute;top:50%;left:5.5%;width:8%;}
div#mark411{position:absolute;top:50%;left:15%;width:8%;}

div#map412_no{position:absolute;top:38%;left:0.5%;width:8%;z-index:10;}
div#map412{position:absolute;top:38%;left:0.5%;width:8%;}
div#mark412{position:absolute;top:38%;left:10%;width:8%;}

div#map4f04_no{position:absolute;top:28.5%;left:0.5%;width:8%;z-index:10;}
div#map4f04{position:absolute;top:28.5%;left:0.5%;width:8%;}
div#mark4f04{position:absolute;top:28.5%;left:10%;width:8%;}

div#map4f05_no{position:absolute;top:25%;left:80.5%;width:8%;z-index:10;}
div#map4f05{position:absolute;top:25%;left:80.5%;width:8%;}
div#mark4f05{position:absolute;top:25%;left:90%;width:8%;}

/*トイレ混雑状況凡例*/
.crowdicon_ex_toilet{display:flex;flex-flow:row wrap;margin-bottom:10px;font-weight:bold;}
.crowdicon_ex_toilet p{font-size:60%;text-align: center}

/*トイレ混雑表示男女トップ*/
.toilet-category{display:flex;flex-flow:row wrap;justify-content :space-around;padding-bottom:20px;}
.male_toilet_top{background-color:#205bac;color:#fff;display:flex;flex-flow:row wrap;padding-left:10%;padding-right:0
    ;padding-top:10px;padding-bottom:10px;align-items:center;}
.female_toilet_top{background-color:#e70311;color:#fff;display:flex;flex-flow:row wrap;padding-left:10%;padding-right:0;padding-top:10px;padding-bottom:10px;align-items:center;}
.shared_toilet_top{background-color:#686868;color:#fff;display:flex;flex-flow:row wrap;padding-left:10%;padding-right:0;padding-top:10px;padding-bottom:10px;align-items:center;}
.mf_toilet_txt{width:75%;text-align:center;font-size:1.5rem;font-weight:bold;}

/*トイレ混雑表示ボタン*/

.toilet_btn_wrap{display:flex;flex-flow:row wrap;justify-content :space-around;padding-bottom:10px;}
.toilet_btn{display:flex;flex-flow:row wrap;padding-left:5%;padding-right:5%;padding-top:10px;padding-bottom:10px;border:solid 1px #686868;border-radius:10px;align-items:center;justify-content: space-around;position: relative;z-index: 1;}
.toilet_btn_txt{width:60%;text-align:center;font-size:1.2rem;font-weight:bold;}
.toilet_btn_txt p{text-align:center;font-size:0.8rem;font-weight:bold;letter-spacing:0.2px}
.toilet_btn a {position: absolute;top: 0;left: 0;width: 100%;height: 100%;text-indent:-999px;z-index: 12;}


/*ゲート混雑マップ*/

#gate11_map{position:absolute;top:43%;left:6%;width:12%;}

#gate25_map{position:absolute;top:5%;left:22%;width:12%;}
#gate20_map{position:absolute;top:9%;left:77%;width:12%;}
#gate21_map{position:absolute;top:43%;left:83%;width:12%;}

#gate22_map{position:absolute;top:77%;left:79%;width:12%;}
#gate23_map{position:absolute;top:82%;left:42%;width:12%;}
#gate24_map{position:absolute;top:79%;left:11%;width:12%;}

#gate30_map{position:absolute;top:25%;left:69%;width:12%;}
#gate31_map{position:absolute;top:60%;left:69%;width:12%;}
#gate33_map{position:absolute;top:69%;left:25%;width:12%;}
#gate40_map{position:absolute;top:43%;left:69%;width:12%;}
#gate41_map{position:absolute;top:69%;left:42%;width:12%;}

.crowdicon_ex_gete{display:flex;flex-flow:row wrap;margin-bottom:10px;font-weight:bold;justify-content:center;}
p.gatecrowd_txt{font-size:60%;text-align: center}

.gates{display:flex;flex-flow:row wrap;padding-bottom:20px}

.gate_box{width:90%;margin:0 auto;border:1px solid #686868;border-radius:5px;padding-top:5px;padding-bottom:5px;justify-content:center;}
.gate_txt{font-size:100%;font-weight:bold;text-align:center;padding-top:5px;}


/*仕組みページ*/
.step_title{font-weight:bold;color:#fff;padding:5px;background-color:#029d9a;margin-bottom:5px;}
.fs75p{font-size:75%}
.green{color:#029d9a;}


/**/
ol.pp li {
    margin: 0;
    padding: 0;
    list-style:decimal;
    margin-left:15px;
}

/*PCのみ*/
@media screen and (min-width: 769px) {
    #top, .konzatsu {
        max-width:640px;
    }

    header {
        margin-bottom:20px;
    }

    .konzatsu {
        margin: auto;
    }

    .male_toilet_top{background-color:#205bac;color:#fff;display:flex;flex-flow:row wrap;padding-left:10%;padding-right:10%;padding-top:10px;padding-bottom:10px;align-items:center;}
    .female_toilet_top{background-color:#e70311;color:#fff;display:flex;flex-flow:row wrap;padding-left:10%;padding-right:10%;padding-top:10px;padding-bottom:10px;align-items:center;}
    .shared_toilet_top{background-color: #686868;color:#fff;display:flex;flex-flow:row wrap;padding-left:10%;padding-right:10%;padding-top:10px;padding-bottom:10px;align-items:center;}
}