@charset "UTF-8";


/* --------------------------------------------------------------------------------------------------------------------------------------------- */
/* common */
/* --------------------------------------------------------------------------------------------------------------------------------------------- */
body{
margin:0;
padding:0;
font-size:14px;
line-height:1.7;
font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
-webkit-text-size-adjust:100%;
}

h1{
margin:0;
padding:0;
position:absolute;
left:9px;
top:13px;
}

#ctrl{
height:116px;
margin:0;
pading:0;
position:fixed;
right:40px;
bottom:-78px;
z-index:5;
}

#boxInner img{
display:block;
border:0;
}



#scroll{
width:100%;
height:100%;
overflow:hidden;
cursor:move;
}

#boxInner{
width:100%;
height:100%;
position:relative;
}



/* --------------------------------------------------------------------------------------------------------------------------------------------- */
/* メガホン */
/* --------------------------------------------------------------------------------------------------------------------------------------------- */

.icon{
margin:0;
padding:0;
cursor:pointer;
position:absolute;
z-index:2;
}

#ohenPoint{
top:1180px;
left:30px;
}


#icon01{
top:515px;
left:450px;
}

#icon02{
top:635px;
left:353px;
}

#icon03{
top:745px;
left:377px;
}

#icon04{
top:709px;
left:430px;
}

#icon05{
top:580px;
left:514px;
}

#icon06{
top:610px;
left:575px;
}

#icon07{
top:659px;
left:605px;
}

#icon08{
top:535px;
left:610px;
}

#icon09{
top:305px;
left:670px;
}

#icon10{
top:205px;
left:739px;
}

#icon11{
top:210px;
left:864px;
}

#icon12{
top:187px;
left:886px;
}

#icon13{
top:173px;
left:928px;
}

#icon14{
top:218px;
left:992px;
}

#icon15{
top:272px;
left:1050px;
}

#icon16{
top:277px;
left:1087px;
}
/*ジョギングの部*/
#icon001{
top:297px;
left:1064px;
}

#icon17{
top:670px;
left:1259px;
}

#icon18{
top:670px;
left:1292px;
}

#icon19{
top:532px;
left:1430px;
}

#icon20{
top:532px;
left:1466px;
}

#icon21{
top:602px;
left:1469px;
}

#icon22{
top:703px;
left:1630px;
}

#icon23{
top:712px;
left:1664px;
}

#icon24{
top:1013px;
left:1888px;
}

#icon25{
top:1036px;
left:1896px;
}

#icon26{
top:1020px;
left:2012px;
}

#icon27{
top:1027px;
left:2045px;
}

#icon28{
top:969px;
left:2059px;
}

#icon29{
top:997px;
left:2064px;
}

#icon30{
top:983px;
left:2091px;
}


/* --------------------------------------------------------------------------------------------------------------------------------------------- */
/* エイドステーション */
/* --------------------------------------------------------------------------------------------------------------------------------------------- */

.aid{
margin:0;
padding:0;
cursor:pointer;
position:absolute;
z-index:2;
transform:scale(0.5);
-webkit-transform:scale(0.5);
}

#aidCont{
background-color:#fff;
}

#aidCont h1{
min-height:40px;
margin:0 0 10px;
padding:8px 0 0 60px;
font-size:16px;
color:#0091da;
background:URL(../img/bg_aid.gif) left top no-repeat;
position:inherit;
}

#aidCont table{
width:100%;
margin:0 0 10px;
border-collapse:separate;
border-spacing:5px;
}
#aidCont table th,
#aidCont table td{
padding:5px 10px;
vertical-align:top;
}
#aidCont table th{
width:30%;
text-align:left;
background-color:#eee;
}

#aidCont p{
margin:0 0 10px;
padding:0;
font-size:14px;
}

#aid00{
top:492px;
left:463px;
}

#aid01{
top:720px;
left:323px;
}

#aid02{
top:615px;
left:506px;
}

#aid03{
top:411px;
left:663px;
}

/*#aid04{
top:478px;
left:858px;
}*/

#aid05{
top:212px;
left:692px;
}

#aid06{
top:238px;
left:868px;
}

#aid07{
top:391px;
left:1090px;
}

#aid08{
top:288px;
left:1286px;
}

#aid09{
top:566px;
left:1279px;
}

#aid10{
top:592px;
left:1308px;
}

#aid11{
top:643px;
left:1466px;
}

#aid12{
top:671px;
left:1574px;
}

#aid13{
top:756px;
left:1827px;
}

#aid14{
top:855px;
left:1872px;
}

#aid15{
top:926px;
left:1881px;
}

#aid16{
top:939px;
left:2005px;
}



/*エイドステーション提供品一覧*/
#offer{
width:2530px;
margin:0 0 0 30px;
padding:30px 0;
overflow:hidden;
}
#offer h2{
margin:0 30px 20px 0;
padding:0 0 10px;
min-height:24px;
font-size:22px;
line-height:1.3;
border-bottom:solid 5px #009d24;
}
#offer ul{
margin:0;
padding:0;
list-style:none;
}
#offer ul li{
width:200px;
height:258px;
margin:0 30px 30px 0; 
float:left;
}
#offer ul li h3{
margin:5px 0;
padding:0;
font-size:14px;
color:#008edc;
border-bottom:solid 1px #ccc;
}
#offer ul li p{
margin:0;
padding:0;
font-size:14px;
line-height:1.5;
}

/* modal */
#modal-content{
width:40%;
height:70vh;
margin:auto;
padding:20px;
border:solid 6px #009843;
background: #fff;
position:fixed;
left:0;
top:0;
right:0;
bottom:0;
z-index:999;
}
#modal-content img{
	display:block;
	width:100%;
	max-width:400px;
	height:auto;
	margin:0 auto;
}

#modal-overlay{
display:none;
z-index:900;
position:fixed;
top:0;
left:0;
width:100%;
height:120%;
background-color:rgba( 0,0,0, 0.75 );
background:rgba( 0,0,0, 0.75 );/*IE9*/
filter:progid:DXImageTransform.Microsoft.Gradient(GradientType=0,StartColorStr=#99000000,EndColorStr=#99000000);/*IE8以下用*/
}

#modal-close{
margin:0 auto;
padding:10px;
text-align:center;
color:#fff;
background-color:#DA0400;
cursor:pointer;
}

/*エイド情報*/
#aidCont ul{
width:520px;
margin:0;
padding:0;
list-style:none;
}
#aidCont ul li{
width:70px;
margin:0 10px 10px 0;
float:left;
}




@media screen and (min-width: 770px){

#scrollSP{
display:none;
}

}



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

h1 img{
width:430px;
height:auto;
}

#scroll{
display:none;
}

#scrollSP{
display:block;	
}

#ctrl{
display:none;
}

/*エイド情報*/
#aidCont ul{
width:100%;
margin:0;
padding:0;
list-style:none;
}
#aidCont ul li{
width:70px;
margin:0 10px 10px 0;
float:left;
}

/* modal */
#modal-content{
width:80%;
height:80vh;
margin:auto;
padding:20px;
font-size:10px;
border:solid 6px #009843;
background: #fff;
position:fixed;
left:0;
right:0;
z-index:999;
}
#modal-content img{
width:100%;
height:auto;
}

#modal-overlay{
z-index:900;
display:none;
position:fixed;
top:0;
left:0;
width:100%;
height:120%;
background-color:rgba( 0,0,0, 0.75 );
}

#modal-close{
margin:0 auto;
padding:10px;
text-align:center;
color:#fff;
background-color:#DA0400;
cursor:pointer;
}


/* --------------------------------------------------------------------------------------------------------------------------------------------- */
/* メガホン */
/* --------------------------------------------------------------------------------------------------------------------------------------------- */

.icon{
margin:0;
padding:0;
cursor:pointer;
position:absolute;
z-index:2;
}

#icon01{
top:394px;
left:338px;
}

#icon02{
top:486px;
left:267px;
}

#icon03{
top:564px;
left:290px;
}

#icon04{
top:540px;
left:327px;
}

#icon05{
top:440px;
left:391px;
}

#icon06{
top:468px;
left:442px;
}

#icon07{
top:499px;
left:465px;
}

#icon08{
top:405px;
left:470px;
}

#icon09{
top:235px;
left:516px;
}

#icon10{
top:158px;
left:570px;
}

#icon11{
top:166px;
left:655px;
}

#icon12{
top:150px;
left:669px;
}

#icon13{
top:181px;
left:715px;
}

#icon14{
top:168px;
left:743px;
}

#icon15{
top:200px;
left:805px;
}

#icon16{
top:211px;
left:829px;
}
/*ジョギングの部*/
#icon001{
top:223px;
left:807px;
}

#icon17{
top:516px;
left:956px;
}

#icon18{
top:515px;
left:980px;
}

#icon19{
top:405px;
left:1085px;
}

#icon20{
top:406px;
left:1108px;
}

#icon21{
top:458px;
left:1115px;
}

#icon22{
top:532px;
left:1236px;
}

#icon23{
top:542px;
left:1261px;
}

#icon24{
top:772px;
left:1430px;
}

#icon25{
top:790px;
left:1493px;
}

#icon26{
top:750px;
left:1522px;
}

#icon27{
top:773px;
left:1520px;
}

#icon28{
top:743px;
left:1558px;
}

#icon29{
top:767px;
left:1558px;
}

#icon30{
top:754px;
left:1580px;
}

#icon31{
top:755px;
left:1581px;
}



/* --------------------------------------------------------------------------------------------------------------------------------------------- */
/* エイドステーション */
/* --------------------------------------------------------------------------------------------------------------------------------------------- */

.aid{
margin:0;
padding:0;
cursor:pointer;
position:absolute;
z-index:2;
transform:scale(0.5)!important;
-webkit-transform:scale(0.5)!important;
}

#aidCont h1{
min-height:40px;
margin:0 0 10px;
padding:8px 0 0 60px;
font-size:16px;
color:#0091da;
background:URL(../img/bg_aid.gif) left top no-repeat;
position:inherit;
}

#aidCont p{
margin:0 0 10px;
padding:0;
font-size:14px;
}

#aid00{
top:368px;
left:340px;
}

#aid01{
top:551px;
left:252px;
}

#aid02{
top:457px;
left:377px;
}

#aid03{
top:314px;
left:502px;
}

#aid04{
top:300px;
left:548px;
}

#aid05{
top:159px;
left:534px;
}

#aid06{
top:197px;
left:768px;
}

#aid07{
top:299px;
left:830px;
}

#aid08{
top:225px;
left:988px;
}

#aid09{
top:413px;
left:977px;
}

#aid10{
top:420px;
left:1010px;
}

#aid11{
top:457px;
left:1115px;
}

#aid12{
top:506px;
left:1195px;
}

#aid13{
top:579px;
left:1391px;
}

#aid14{
top:648px;
left:1427px;
}

#aid15{
top:733px;
left:1406px;
}

#aid16{
top:716px;
left:1523px;
}

/*エイドステーション提供品一覧*/
#offer{
width:1891px;
margin:0 0 0 30px;
padding:30px 0;
overflow:hidden;
}
#offer h2{
margin:0 0 20px;
padding:0 0 10px;
min-height:24px;
font-size:18px;
line-height:1.3;
border-bottom:solid 5px #009d24;
}
#offer ul{
margin:0;
padding:0;
list-style:none;
}
#offer ul li{
width:180px;
min-height:230px;
margin:0 30px 30px 0; 
float:left;
}
#offer ul li img{
width:100%;
height:auto;
}

#offer ul li h3{
margin:5px 0;
padding:0;
font-size:12px;
color:#008edc;
border-bottom:solid 1px #ccc;
}
#offer ul li p{
margin:0;
padding:0;
font-size:12px;
line-height:1.5;
}

}

@media screen and (max-width: 321px){
	#modal-content{
		width:80%;
		height:70vh;
	}


/* IE8 Hack */
#scrollSP{
display:none\9;
}
.aid{
width:36px\9;
height:36px\9;
margin:20px 0 0 20px\9;
}
:root .aid{
width:74px\0/;
height:74px\0/;
margin:0\0/;
}

.aid a img{
width:100%\9;
height:auto\9;
}