.tab li{
	float: left;
    font-size:20px;
    font-weight:bold;
    text-align:center;
    width:32%;
    border-radius: 6px 6px 0 0 / 6px 6px 0 0;
    -webkit-border-radius: 6px 6px 0 0 / 6px 6px 0 0;
    -moz-border-radius: 6px 6px 0 0 / 6px 6px 0 0;
}

.tab li a{
    	display: block;
	text-decoration: none;
}

.tab li.blue {
    background-color:#bae3f9;
    margin-right:2%;
}

.tab li.blue a {
	color:#1e4e8e;
}

.tab li.green {
    background-color:#d7e7af;
    margin-right:2%;
}

.tab li.green a {
	color:#009944;
}


.tab li.pink {
    background-color:#f7c9dd;
}

.tab li.pink a {
	color:#e4007f;
}

.logo{
    clear: both;
    text-align: center;
    color: #13b5b1;
    text-shadow:3px 3px 0 #FFF, -3px -3px 0 #FFF,
              -3px 3px 0 #FFF, 3px -3px 0 #FFF,
              0px 3px 0 #FFF,  0 -3px 0 #FFF,
              -3px 0 0 #FFF, 3px 0 0 #FFF;
}

.title{
    clear: both;
    text-align: center;
    font-size: 26px;
    color: #330000;
/*    text-shadow:3px 3px 0 #FFF, -3px -3px 0 #FFF,
              -3px 3px 0 #FFF, 3px -3px 0 #FFF,
              0px 3px 0 #FFF,  0 -3px 0 #FFF,
              -3px 0 0 #FFF, 3px 0 0 #FFF;*/
}
td.number{
    text-align:left;
    width:5%;
}

tr {
    background-color:#fff;
}





table.table_blue td {
    color:#1e4e8e;
}

table.table_blue tr.iro {
    background-color:#bae3f9;
}

table.table_green td {
    color:#009944;
}


table.table_green tr.iro {
    background-color:#d7e7af;
}



table.table_pink td {
    color:#e4007f;
}


table.table_pink tr.iro {
    background-color:#f7c9dd;
}


#randomimg {
    clear:both;
    width:100%;
    height:auto;
    background-repeat:no-repeat;
    background-size:cover;
    padding-bottom:10%;
}

#language {
    margin:3% 3% 0 0;
    float:right;
    width:32%;
}

#language img {
    width:100%;
}

#language ul {
}

#language ul li {
    list-style-type:none;
    float:left;
    width:25%;
}


#main {
    clear:both;
   text-align:center;
    width:87%;
    margin:0 auto;
    border:3px solid #330000;
    border-radius: 10px;        /* CSS3草案 */  
    -webkit-border-radius: 10px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 10px;   /* Firefox用 */
    padding:0 1% 0 1%;
    background-color: rgba(255,255,255,0.5);
}

#main img {
    width:100%;
    margin-top:10%;
}
#main_all {
    clear:both;
   text-align:center;
    width:87%;
    margin:0 auto;
    border:3px solid #fff;
    border-radius: 10px;        /* CSS3草案 */  
    -webkit-border-radius: 10px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 10px;   /* Firefox用 */
    padding:0 1% 0 1%;

}

#main_all img {
    width:100%;
    margin-top:10%;
}
#mainnav {
   clear:both;
    width:100%;
    margin-top:10%;
}



#mainnav li  {
list-style-type:none;
width:42.5%;
    height:auto;
    color:#fff;
    text-align:center;
    font-size:20px;
    font-weight:bold;
    border:3px solid #fff;
    border-radius: 10px;        /* CSS3草案 */  
    -webkit-border-radius: 10px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 10px;   /* Firefox用 */
    padding:1% 0 1% 0;
}

#mainnav li a  {
   color:#fff;
    text-decoration: none;
    display: block;
}


#mainnav li.blue {
    background-color: #13b5b1;
    margin-left:5%;
    margin-bottom:2.5%;
    float:left;
}

#mainnav li.green {
    background-color: #8fc31f;
    margin-right:5%;
        margin-bottom:2.5%;
    float:right;
}

#mainnav li.pink {
    background-color: #e4007f;
    margin-left:5%;
    float:left;
}

#mainnav li.orange {
    background-color: #f08300;
    margin-right:5%;
    float:right;
}


#ranking {
    clear:both;
    margin:3% 5% 0 5%;
}

#ranking h2 {
    font-size:30px;
    font-weight:bold;
    color:#e4007f;
    text-align:center;
    line-height: 1em;
}


.ya {
    float:left;
    width:15%;
    background-color: #fff;
    height:45px;
    text-align:center;
    padding-top:5px;
    margin-bottom:3%;
    
}

.ya img {
    width:auto;
    height:40px;
    
}

.bar {
/*    float:left;
    width:83.6%;*/
    height:45px;
    padding:5px 0 0 5px;
/*    margin-bottom:5%;*/
}
.bar img{
    width:auto;
    height:40px;
    float:left;
    padding-left: 1%;
}
.moji {
    float: left;
    color: #fff;
    font-weight: bold;
    font-size: 1.3em;
    margin-left: 1%;
/*    background: url(../img/common/kao.png) no-repeat left center;*/
    padding-left: 17%;
    line-height: 40px;
    height: 40px;
    background-size: contain;
}
/*.moji {
    float:left;
    color:#fff;
    font-weight:bold;
    font-size:1.3em;
    margin-left:2%;
}
*/
.shikaku {
    background-color:#fff;
    margin:0 5% 0 5%;
    padding:2%;
    border-radius: 10px;        /* CSS3草案 */  
    -webkit-border-radius: 10px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 10px;   /* Firefox用 */
    font-size:20px;
    line-height:1.2em;
}
.shikaku_map {
    background-color:#fff;
    margin:5% 5% 0 5%;
    padding:2%;
    border-radius: 10px;        /* CSS3草案 */  
    -webkit-border-radius: 10px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 10px;   /* Firefox用 */
    font-size:20px;
    line-height:1.2em;
}
.shikaku_map a{
    color: #3b1d0a;
    text-decoration: none;
    display: block;
    text-align: center;
}
.shikaku_how {
    background-color:#fff;
    margin:0 5% 3% 5%;
    padding:3%;
    border-radius: 10px;        /* CSS3草案 */  
    -webkit-border-radius: 10px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 10px;   /* Firefox用 */
    font-size:20px;
    line-height:1.2em;
}

.how_shikakupik {
    background-color:#e4007f;
    margin:0 5% 3% 5%;
    padding:3%;
    border:3px solid #fff; 
    border-radius: 10px;        /* CSS3草案 */  
    -webkit-border-radius: 10px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 10px;   /* Firefox用 */
    overflow: auto;
}
.how_shikakublu {
    background-color:#13b5b1;
    margin:0 5% 3% 5%;
    padding:3%;
    border:3px solid #fff; 
    border-radius: 10px;        /* CSS3草案 */  
    -webkit-border-radius: 10px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 10px;   /* Firefox用 */
    overflow: auto;
}

.how_shikakugrn {
    background-color:#8fc31f;
    margin:0 5% 3% 5%;
    padding:3%;
    border:3px solid #fff; 
    border-radius: 10px;        /* CSS3草案 */  
    -webkit-border-radius: 10px;    /* Safari,Google Chrome用 */
    -moz-border-radius: 10px;   /* Firefox用 */
    overflow: auto;
}
.how_t2{
    color: #fdd000;
    font-size: 1.5em;
    font-weight: bold;
    line-height:1.2em;
    margin-bottom: 3%;
}
.how_t3{
    color: #fff;
    line-height: 1.2em;
    width: 65%;
    width: 100%;
}
.how_shikakuimg{
    float:right;
    width: 30%;
    margin:1%;
}

.how_yokoso{
    color: #fff;
    text-align: center;
    font-weight: bold;
    font-size: 1.5em;
    line-height: 1.2em;
}
.how_top img{
    display: block;
    width: 70%;
    margin: 3% auto 0;
}
.how_setu{
    margin: 3% 5% 3% 5%;
    line-height: 1.2em;
}
.how_shikakushirosen {
    background-color:#fff;
    margin:0 5% 3% 5%;
    padding:3%;
    border:3px solid #330000; 
    border-radius: 10px;        /* CSS3草案 */  
    -webkit-border-radius: 10px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 10px;   /* Firefox用 */
}
.how_shikakushiro {
    background-color:#fff;
    margin:0 5% 3% 5%;
    padding:3%;
    border:3px solid #fff; 
    border-radius: 10px;        /* CSS3草案 */  
    -webkit-border-radius: 10px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 10px;   /* Firefox用 */
}
.how_co1{
    color: #330000;
    font-size: 1.5em;
    font-weight: bold;
    line-height:1.2em;
    margin-bottom: 3%;
}
.how_co2{
    color: #330000;
    line-height: 1.2em;
}
.how_co_ume{
    background: url(../img/how/course_ume.png) no-repeat top left;
    background-size: 5em;
    color: #330000;
    line-height: 1.2em;
    padding-left: 35%;
    margin-top: 5%;
}
.how_co_take{
    background: url(../img/how/course_take.png) no-repeat top left;
    background-size: 5em;
    color: #330000;
    line-height: 1.2em;
    padding-left: 35%;
    margin-top: 5%;
}
.how_co_matsu{
    background: url(../img/how/course_matsu.png) no-repeat top left;
    background-size: 5em;
    color: #330000;
    line-height: 1.2em;
    padding-left: 35%;
    margin-top: 5%;
}
.bt_pink{
    background-color: #e4007f;
    margin: 0 5% 2% 5%;
    list-style-type: none;
    height: auto;
    color: #fff;
    text-align: center;
    font-size: 20px;
    font-weight: bold;
    border: 3px solid #fff;
    border-radius: 10px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    padding: 1% 0 1% 0;
}
.bt_pink a{
    color: #fff;
    text-decoration: none;
    display: block;
}
.bt_wrap {
    text-align: center;
}
.sankaku {
    text-align:center;
    margin:2% 0 0 0;
}

.sankaku img {
    width:auto;
    height:30px;
}

p.place {
    color:#e4007f;
    font-weight:bold;
    font-size:30px;
    text-align:center;
    margin:0;
}
.slide{
    width:90%;
    margin:0 5% 0 5%;
    text-align: justify;
    line-height:1.4em;
    font-size:18px;
}
.slide p{
    background-color: #fff;
    padding: 2%;
    position: relative;
/*    top: -80px;*/
    text-align: center;
    border-radius: 10px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
}
.setsumei{
    width:90%;
    margin:0 5% 0 5%;
    text-align: justify;
    line-height:1.4em;
    font-size:18px;
}

.setsumei p{
    background-color: #fff;
    padding: 2%;
    position: relative;
    top: -80px;
    text-align: center;
    border-radius: 10px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
}
.setsumei img{
    width:100%;
    border:3px solid #fff;
}

.setsumei_img{
    width:100%;
    border:3px solid #fff;
}
.setsumei_next{
    position: relative;
    top:-100px;
    left: 30%;
}

.setsumei_last{
    background-color: #fff;
    width: 85%;
    margin: 0 5% 0 5%;
    padding: 2%;
    position: relative;
    bottom: 210px;
    text-align: center;
    border-radius: 10px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
}
#hajimeru {
    text-align: center;
    font-size:20px;
    width:90%;
    margin:0 5% 5% 5%;
    line-height:1.5em;
}

div.mail {
    text-align: center;
    font-size:20px;
}
.next {
    width:80%;
    height:50%;
/*    margin-top:10%;*/
    text-align: center;
    font-size:20px;
    font-family: 'rounded-x-mplus-1p';
    color:#fff;
    border:none;
    background-color: #3b1d0a;
}

.cp_bt {
    width:60%;
    height:50%;
    margin-top:5%;
    text-align: center;
    font-size:20px;
    font-family: 'rounded-x-mplus-1p';
    color:#fff;
    border:none;
    background-color: #8fc31f;
}

.bt{
    font-size:20px;
    font-family: 'rounded-x-mplus-1p';
    text-align: center;
    color:#fff;
    border:none;
    background-color: #3b1d0a;
    margin:5% 0 5% 0;
}
.bt_susumu{
    font-size:20px;
    font-family: 'rounded-x-mplus-1p';
    color:#fff;
    border:none;
    background-color: #3b1d0a;
/*    margin:5% 0 5% 0;
*/}
.bt_brown{
    font-family: 'rounded-x-mplus-1p';
    background-color: #e4007f;
    margin: 5% 5% 0 5%;
/*    padding: 1% 1%;*/
    list-style-type: none;
    color: #fff;
    text-align: center;
    font-size: 20px;
    border: 3px solid #fff;
    border-radius: 10px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;

}


.bt_brown input{
    color: #fff;
    text-decoration: none;
    display: block;
}
input[type="radio"] {
/*    -webkit-appearance: none;*/
    border-radius: 0;
    width: 30px;
    height: 30px;
    vertical-align: middle;
}
input[type="button"] {
    -webkit-appearance: none;
    border-radius: 10px;
}
.textbox {
    border:none;
    height:30px;
    width:95%;
        border-radius: 10px;        /* CSS3草案 */  
    -webkit-border-radius: 10px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 10px;   /* Firefox用 */
    text-align:left;
    font-size:20px;
    color: #3b1d0a;
    font-family: 'rounded-x-mplus-1p';
    margin-top:5%;
}
.textbox_regist {
    border:none;
    height:30px;
    width:85%;
        border-radius: 10px;        /* CSS3草案 */  
    -webkit-border-radius: 10px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 10px;   /* Firefox用 */
    text-align:left;
    font-size:20px;
    color: #3b1d0a;
    font-family: 'rounded-x-mplus-1p';
    margin-bottom:3%;
}
.textbox_regist_textarea {
    border:none;
    height:120px;
    width:85%;
        border-radius: 10px;        /* CSS3草案 */  
    -webkit-border-radius: 10px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 10px;   /* Firefox用 */
    text-align:left;
    font-size:20px;
    color: #3b1d0a;
    font-family: 'rounded-x-mplus-1p';
    margin-bottom:3%;
}
#about {
    width:90%;
    margin:0 5% 0 5%;
    font-size: 0.9em;
}

#repeat01{
    background-color: #fff;
    width:85%;
    margin:0 5% 5% 5%;
    padding:2%;
    font-size:20px;
    text-align:center;
     border-radius: 10px;        /* CSS3草案 */  
    -webkit-border-radius: 10px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 10px;   /* Firefox用 */
}

#howlocation{
    width:85%;
    margin:0 5% 5% 5%;
    padding:2%;
    font-size:20px;
    text-align:left;
     border-radius: 10px;        /* CSS3草案 */  
    -webkit-border-radius: 10px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 10px;   /* Firefox用 */
}

#ep_results{
    background-color: #fff;
/*    width:85%;*/
    margin: 0 auto 5%;
    padding:2%;
    font-size:20px;
    text-align:center;
     border-radius: 10px;        /* CSS3草案 */  
    -webkit-border-radius: 10px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 10px;   /* Firefox用 */
}
#repeat01 span{
    background-color: #bae3f9;
    line-height:2em;
    padding:1% 5% 1% 5%;
    color:#1e4e8e;
    border-radius: 10px;        /* CSS3草案 */  
    -webkit-border-radius: 10px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 10px;   /* Firefox用 */
    margin: 0 5%;
}
#ep_results span{
    background-color: #bae3f9;
    line-height:2em;
    padding:1% 5% 1% 5%;
    color:#1e4e8e;
    border-radius: 10px;        /* CSS3草案 */  
    -webkit-border-radius: 10px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 10px;   /* Firefox用 */
    margin: 0 5%;
}

.ep_txt_res{
    background-color: #bae3f9;
    line-height:2em;
    padding:1% 5% 1% 5%;
    color:#1e4e8e;
    border-radius: 10px;        /* CSS3草案 */  
    -webkit-border-radius: 10px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 10px;   /* Firefox用 */
    margin: 0 5%;
}

p.mondai {
    font-size:20px;
    text-align:center;
    background-color: #3b1d0a;
    line-height:2em;
    width:60%;
    margin:5% auto;
    padding:0;
    color:#fff;
    border-radius: 10px;        /* CSS3草案 */  
    -webkit-border-radius: 10px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 10px;   /* Firefox用 */
}

.mondai p a {
    color: #fff;
    text-decoration: none;
    display: block;
}


.kotae{
    width:90%;
    margin:0 5% 0 5%;
    text-align: justify;
    line-height:1.4em;
    font-size:18px;
}

.final_kotae{
    text-align: justify;
    line-height:1.4em;
    font-size:18px;
}


.kotae ol li {
    background-color: #fff;
    margin:5% 0 0 0;
    list-style-type: none;
    font-size:20px;
    padding:1% 0 1% 5%;
    border-radius: 10px;        /* CSS3草案 */  
    -webkit-border-radius: 10px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 10px;   /* Firefox用 */
}

.kotae ol li a {
    color:#3b1d0a;
    text-decoration: none;
    display: block;
}

p.link {
    text-align:center;
    font-size:20px;
}

#map {
    width: auto;
    height: 300px;
}

#map1 {
    width: auto;
    height: 300px;
}

div.info{
    text-align: center;
    margin:5%;
    font-size: 20px;
}
div.spot_info{
    background-color: #fff;
    width:85%;
    margin:0 5% 0 5%;
    padding:2%;
    font-size:20px;
    text-align:left;
     border-radius: 10px;        /* CSS3草案 */  
    -webkit-border-radius: 10px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 10px;   /* Firefox用 */
}

.bt_fnl_word {
    height: 50px;
    width: 20%;
    background-color: #1e4e8e;
    color: #fff;
    font-size: 30px;
    border: none;
    margin: 1%;
    text-align: center;
}

.bt_fnl_ans {
    height: 50px;
    width: 20%;
    background-color: #e4007f;
    color: #fff;
    font-size: 30px;
    border: none;
    margin: 1%;
    text-align: center;
}
.ep_thank{
    width: 100%;
    margin:0% auto 5%;
}
.penalty{
    width: 100%;
    margin:0% auto 5%;
}

@font-face {
    font-family: 'kirin';
    font-style: normal;
    src: url('/fonts/kirin-Regular.ttf') format('truetype');
}


.penalty_font{
font-family: 'kirin';
color:#e4007f;
font-size:5em;
text-align:center;
margin:0px auto;
}

.w1per {width: 1%;}
.w2per {width: 2%;}
.w3per {width: 3%;}
.w4per {width: 4%;}
.w5per {width: 5%;}
.w6per {width: 6%;}
.w7per {width: 7%;}
.w8per {width: 8%;}
.w9per {width: 9%;}
.w10per {width: 10%;}
.w11per {width: 11%;}
.w12per {width: 12%;}
.w13per {width: 13%;}
.w14per {width: 14%;}
.w15per {width: 15%;}
.w16per {width: 16%;}
.w17per {width: 17%;}
.w18per {width: 18%;}
.w19per {width: 19%;}
.w20per {width: 20%;}
.w21per {width: 21%;}
.w22per {width: 22%;}
.w23per {width: 23%;}
.w24per {width: 24%;}
.w25per {width: 25%;}
.w26per {width: 26%;}
.w27per {width: 27%;}
.w28per {width: 28%;}
.w29per {width: 29%;}
.w30per {width: 30%;}
.w40per {width: 40%;}
.w50per {width: 50%;}
.w60per {width: 60%;}
.w70per {width: 70%;}
.w80per {width: 80%;}
.w85per {width: 85%;}
.w90per {width: 90%;}
.w100per {width: 100%;}


.font16px{font-size:16px;}
.font20px{font-size:20px;}
.font30px{font-size:30px;}
.font40px{font-size:40px;}


.align_r{text-align: right;}
.align_center{text-align: center;}
