@charset "utf-8";

/*******************
common styles
********************/

*{
	margin:0;
	padding:0;
	}
html{
	font-size: 62.5%;
	}
body{
	background-color:#FFF;
	color:#000;
	font-family:'ヒラギノ角ゴ Pro W3',Hiragino Kaku Gothic Pro,'メイリオ',Meiryo,'MS Pゴシック',MS PGothic,sans-sans-serif;
	line-height:150%;
	}
body>img{
	display:none;
	}
a{
	text-decoration:none;
	}
a:link{
	text-decoration:none;
	}
a:visited{
	}
a:active{
	}
a:hover{
	text-decoration:none;
	}
h1,h2,h3,h4,h5,h6{
	font-family: 'Noto Sans JP', sans-serif !important;
	font-weight:700;
	line-height:150%;
	margin-bottom:30px;
	transform: rotate(0.001deg);
	}
p{
	line-height:150%;
	margin-bottom:15px;
	}
ul{
	list-style-type:none;
	}
img{	  
	-webkit-touch-callout:none;
	-webkit-user-select:none;
	-moz-touch-callout:none;
	-moz-user-select:none;
	touch-callout:none;
	user-select:none;
	}
hr{
	border:0;
	clear:both;
	display:block;
	height:30px;
	width:100%;
	}	

table{
	border-bottom:1px solid #DDD;
	border-collapse:collapse;
	margin-bottom:30px;
	text-align:center;
	table-layout:fixed;
	width:100%;
	}
table th,
table td{
	border-top:1px solid #DDD;
	border-collapse:collapse;
	padding:5px;
	word-break:break-all;
	}
table th{
	background:#22A4B3;
	border-left:1px solid #FFF;
	color:#FFF;
	}
table th:first-child{
	border-left:0;
	}
table td{
	border-left:1px solid #DDD;
	}
table td:first-child{
	border-left:0;
	}
table th.rank{
	width:20%;
	}


.caution{
	color: #d00 !important;
    font-weight:bold !important;
	}
.invisible {
	transition:opacity 0.5s ease;
	opacity:0.0;
	}
.visible {
	transition:opacity 0.5s ease;
	opacity:1.0;
	}

.modalArea{
	display:none;
	position:fixed;
	z-index:1000000;
	top:0;
	left:0;
	width:100%;
	height:100%;
	}
.modalBg{
	width:100%;
	height:100%;
	background-color:rgba(255,255,255,0.75);
	}
.modalWrapper{
	background-color:#FFF;
	border:2px solid #22A4B3;
	/*border-radius:5px;
	-webkit-border-radius:5px;
	-moz-border-radius:5px;*/
	position:absolute;
	top:50%;
	left:50%;
	text-align:center;
	transform:translate(-50%,-50%);
	padding:50px;
	}
.modalWrapper dl{
	display:block;
	width:100%;
	}
.modalWrapper dt,
.modalWrapper dd{
	margin-bottom:10px;
	}
.modalWrapper dt{
    color: #22A4B3;
	font-family: 'Noto Sans JP', sans-serif !important;
	font-size:2.0rem;
	font-weight:bold;
	padding:5px;
	}
.modalWrapper dd{
	padding:5px;
	}
.closeModal{
	position:absolute;
	top:0.5rem;
	right:1.0rem;
	cursor:pointer;
	}




@media print,screen and (min-width: 768px){

/*******************
common styles
********************/

body{
	background-image:url(../images/bg.png);
    background-repeat: repeat;
    background-position: center -38px;
	position:relative;
	font-size:1.6rem;
	text-align:left;
	}

a{
    transition:all 1.0s;
	}
a:hover{
	opacity:0.75;
	filter:alpha(opacity=75);
	-ms-filter:"alpha( opacity=75 )";
	}

header,
section,
footer{
	display:block;
	width:100%;
	}

header .inner,
section .inner,
footer .inner{
	display:block;
	margin:0 auto;
	padding:0;
	width:960px;
	}

.sp{
	display:none;
	}

.btm{
	margin-bottom:30px;
	}
.note{
	font-size:1.2rem;
	}

#term{
    position: fixed;
    bottom: 20px;
    left: 20px;
    z-index: 10000;
    }




/*******************
header styles
********************/

header{
	background:#FFF;
    border-bottom: 1px solid #FFF;
	position:fixed;
	top:0;
	z-index:10000;
	}
header .inner{
    padding: 20px 0;
	width:960px;
	}
header .inner #logo{
    line-height: 0;
	}
header .inner #logo img{
	height:40px;
	width:auto;
	}

header #gNav{
    background: #22A4B3;
    width: 100%;
	}
header #gNav .gNav{
	border-left:1px solid #FFF;
    display: flex;
	height: 40px;
    margin: 0 auto;
    width: 960px;
	}
header #gNav .gNav li{
    display: block;
	height:40px;
	position:relative;
	}
header #gNav .gNav li span.new,
header #gNav .gNav li span.comingsoon{
	position:absolute;
	top:-5px;
	left:50%;
	-webkit-transform: translate(-50%,-50%);
	-moz-transform: translate(-50%,-50%);
	-ms-transform: translate(-50%,-50%);
	-o-transform: translate(-50%,-50%);
	transform: translate(-50%,-50%);
	}
header #gNav .gNav li span.new img,
header #gNav .gNav li span.comingsoon img{
	height:auto;
	width:60px;
	}
header #gNav .gNav li a{
	border-right:1px solid #FFF;
	color:#FFF;
	display:block;
	font-family: 'Noto Sans JP', sans-serif !important;
	font-size:1.4rem;
	font-weight:700;
	line-height:125%;
	height:20px;
	padding:10px 20px;
	text-align:center;
	}
header #gNav .gNav li a:hover {
    opacity: 1.0;
    background: #BCE1DF;
	}
header #gNav .gNav li a span {
	transform: rotate(0.001deg);
	}
#index header #gNav .gNav li.index a,
#tournament header #gNav .gNav li.tournament a,
#support header #gNav .gNav li.support a,
#messagebottle header #gNav .gNav li.messagebottle a,
#goods header #gNav .gNav li.goods a,
#lastyear header #gNav .gNav li.lastyear a {
    background: #BCE1DF;
	}
header #gNav .gNav li:first-child{
	padding-right:0;
	}
header #gNav .gNav li a.off{
	cursor:default;
	color:#AAA;
	}
header #gNav .gNav li a.off:hover{
	opacity:1.0;
	filter:alpha(opacity=100);
	-ms-filter:"alpha( opacity=100 )";
	}




/*******************
#main styles
********************/

#main{
    margin-bottom: 50px;
	padding-top:80px;
	text-align:center;
	}



/***** #index *****/

#index #main{
	background-image:url(../images/index/bg_main.png);
	background-size:auto;
	background-position:center top 120px;
	background-repeat:repeat-x;
    margin-bottom: 0;
	position:relative;
    padding-top: 120px;
	text-align:center;
	width:100%;
	}

#index #main .inner{
	height:545px;
    margin: 0 auto;
    text-align: center;
    width: 960px;
	}

#index #main h1{
	position:relative;
	}
#index #main h1 .lavel,
#index #main h1 .mark,
#index #main h1 .megapon {
	position:absolute;
	height:auto;
	}
#index #main h1 .lavel{
    background: #FFF33F;
    border-radius: 50%;
    color: #AA965C;
	font-family: 'Noto Sans JP', sans-serif !important;
	font-size:2.0rem;
	font-weight:700;
    height: 105px;
    padding-top: 15px;
	width:120px;
    top: 20px;
    left: 240px;
    text-align: center;
	transform: rotate(-10deg);
	}
#index #main h1 img.mark{
    top: 50px;
    left: 50%;
    transform: translateX(-50%);
    -webkit- transform: translateX(-50%);
	width:220px;
	}
#index #main h1 img.megapon{
    top: 18px;
    right: 130px;
	width:230px;
	}

/***** ##tournament *****/

#tournament #main {
    background: url("../images/tournament/bg_main.png") no-repeat;
    background-position: top 105px left 50%;
    border-bottom: 25px solid #C19D74;
    margin-bottom: 80px;
    width: 100%;
	}
#tournament #main .inner{
    margin: 0 auto;
    height: 300px;
    position: relative;
    width: 960px;
	}
#tournament #main .inner h1{
    position: absolute;
    left: 0;
    right: 0;
    bottom: -20px;
    margin: 0 auto;
	}
#tournament #main .inner h1 img{
    height: 260px;
    width: auto;
	}
#tournament #main .inner nav{
    position: absolute;
    left: 0;
    right: 0;
    bottom: -100px;
    margin: 0 auto;
    width: 200px;
	}
#tournament #main .inner nav figure img{
    height: auto;
    width: 200px;
	}

/***** #support *****/

#support #main{
	background-image:url(../images/support/bg_main.png);
	background-size:960px 980px;
	background-position:center top 150px;
	background-repeat:no-repeat;
	position:relative;
    padding-top: 120px;
	text-align:center;
	width:100%;
	}
#support #main .inner{
	height:1000px;
    margin: 0 auto;
	position:relative;
    text-align: center;
    width: 960px;
	}
#support #main h1{
    background: #FFF;
    display: block;
    padding: 20px;
	position:absolute;
    top: 20px;
    left: 10px;
	width:160px;
	}
#support #main h1 img.mark{
	width:100%;
	}

#support #main ul.map {
    position: relative;
    height: 1000px;
    width: 960px;
	}
#support #main ul.map li {
    position: absolute;
    height: 75px;
    width: 170px;
	}
#support #main ul.map li#hokkaido {
    top: 150px;
    right: 380px;
	}
#support #main ul.map li#hokushinetsu {
    animation-delay: 0.2s;
    top: 320px;
    right: 420px;
	}
#support #main ul.map li#tohoku {
    animation-delay: 0.4s;
    top: 280px;
    right: 80px;
	}
#support #main ul.map li#tokai {
    animation-delay: 0.6s;
    top: 560px;
    right: 180px;
	}
#support #main ul.map li#chugokushikoku {
    animation-delay: 0.8s;
    top: 450px;
    left: 120px;
	}
#support #main ul.map li#kyushu {
    animation-delay: 1.0s;
    top: 680px;
    left: 50px;
	}

#support #main ul.map li dl {
    color: #FFF;
	font-family: 'Noto Sans JP', sans-serif !important;
	font-size:1.4rem;
	font-weight:500;
    height: 65px;
    margin: 0 auto;
    padding-top: 10px;
    position: relative;
    text-align: center;
	transform: rotate(0.001deg);
    width: 160px;
    z-index: 1;
    }
#support #main ul.map li dl::before {
    background-color:#22A4B3;
    border: 1px solid #FFF;
    content: "";
    filter: drop-shadow(5px 5px 0 #FFF67F);
    position: absolute;
    top: 0; bottom: 0; left: 0; right: 0;
    transform: skewX(-10deg);
    z-index: -1;
    }
#support #main ul.map li dd {
	font-size:1.6rem;
    }
#support #main ul.map li dd span {
	font-size:2.8rem;
	font-weight:700;
    }
#support #main ul.map li dd.icon {
    position: relative;
	}
#support #main ul.map li dd.icon img {
    position: absolute;
    top: -90px;
    left: 10px;
    height: auto;
    width: 150px;
	}

#support #main p.caution,
#support #main dl.schedule {
	font-family: 'Noto Sans JP', sans-serif !important;
	font-weight:bold;
	position:absolute;
	transform: rotate(0.001deg);
	}
#support #main p.caution {
    color: #555 !important;
    font-size: 1.8rem;
    bottom: 250px;
    right: 0;
	}
#support #main dl.schedule {
    color: #E85298;
    font-size: 2.0rem;
    bottom: 100px;
    line-height: 180%;
    letter-spacing: 0.2rem;
    right: 0;
	}
#support #main dl.schedule dt {
    font-size: 4.0rem;
	}
#support #main dl.schedule dd.time {
    font-size: 3.0rem;
    line-height: 200%;
	}

/***** #goods *****/

#goods #main{
	background-image:url("../images/goods/bg_main.png");
	background-size:auto;
	background-position:center top 120px;
	background-repeat:repeat-x;
	position:relative;
    padding-top: 120px;
	text-align:center;
	width:100%;
	}
#goods #main .inner{
	height:545px;
    margin: 0 auto;
	position:relative;
    text-align: center;
    width: 960px;
	}
#goods #main h1{
    display: block;
	position:absolute;
    top: 25px;
    left: 50%;
    transform: translateX(-50%) ;
    -webkit- transform: translateX(-50%);
	width:410px;
	}
#goods #main h1 img.character{
	width:100%;
	}

/***** #messagebottle *****/

#messagebottle #main {
    margin-bottom: 0;
    }
#messagebottle #main .inner{
    background: url("../images/messagebottle/bg_main.png") no-repeat;
    background-position: top -250px left 0;
    height: 570px;
    margin: 0 auto;
    padding-top: 100px;
	position:relative;
    width: 960px;
	}
#messagebottle #main .copy {
    display: flex;
    align-items: flex-end;
    height: 300px;
	position:absolute;
    bottom: 20px;
    right: 10px;
    width: 453px;
    }
#messagebottle #main .copy h1{
    height: 150px;
    margin: 0;
    padding: 0;
    width: 320px;
    }
#messagebottle #main .copy figure,
#messagebottle #main .copy figure img {
    height: 250px;
    width: 133px;
    }

/***** #lastyear *****/

#lastyear #main{
	background-image:url(../images/lastyear/bg_main.png);
	background-size:auto;
	background-position:center top 120px;
	background-repeat:repeat-x;
	position:relative;
    padding-top: 120px;
	text-align:center;
	width:100%;
	}
#lastyear #main .inner{
	height:545px;
    margin: 0 auto;
	position:relative;
    text-align: center;
    width: 960px;
	}
#lastyear #main h1{
    background: #FFF;
    display: block;
    padding: 20px;
	position:absolute;
    top: 50%;
    left: 50%;
    transform: translateY(-50%) translateX(-50%) ;
    -webkit- transform: translateY(-50%) translateX(-50%);
	width:160px;
	}
#lastyear #main h1 img.mark{
	width:100%;
	}



/*******************
#body styles
********************/
#body .tab{
    clear: both;
    margin: 0 auto 30px;
    width: 940px;
    }
#body .tab li{
    /*float: left;*/
    }

#body .articleWrap {
    margin: 0 auto 30px;
    padding: 0 10px;
    width: 940px;
    }

#body .logoWrap{
    margin: 0 auto;
    padding: 50px 0;
	width:940px;
	}
#body .logoWrap figure{
	float:left;
	}
#body .logoWrap #logo_corp,
#body .logoWrap #logo_ekiden,
#body .logoWrap #logo_tvasahi {
	margin:0 90px;
	/*margin:0 40px;*/
	}
#body .logoWrap #logo_corp img{
	height:60px;
	width:auto;
	}
#body .logoWrap #logo_ekiden img{
	height:60px;
	width:auto;
	}
#body .logoWrap #logo_tvasahi img{
	height:60px;
	width:auto;
	}

/***** #index *****/

#index #body #countdownWrap {
    border-bottom: 25px solid #C19D74;
    margin-bottom: 50px;
    width: 100%;
	}
#index #body #countdownWrap .inner{
    margin: 0 auto;
    height: 150px;
    position: relative;
    width: 960px;
	}
#index #body #countdownWrap .inner .runner,
#index #body #countdownWrap .inner .countdown {
    position: absolute;
	}
#index #body #countdownWrap .inner .runner {
    left: 60%;
    bottom: -25px;
	}
#index #body #countdownWrap .inner .runner img{
    height: 150px;
    width: auto;
	}
#index #body #countdownWrap .inner .runner canvas.apng-image{
    height: 150px !important;
    width: auto !important;
    }
#index #body #countdownWrap .inner .countdown {
    display: flex;
    right: 0;
    bottom: -20px;
	}
#index #body #countdownWrap .inner .countdown img {
    height: 150px;
    width: auto;
	}
#index #body #countdownWrap .inner .countdown canvas.apng-image {
    height: 150px;
    width: auto;
	}
#index #body #countdownWrap .inner .countdown p {
    background: url("../images/index/bg_countdown.png") no-repeat;
    background-size: 160px 80px;
    color: #E85298;
    display: block;
	font-family: 'Noto Sans JP', sans-serif !important;
	font-size:1.6rem;
	font-weight:bold;
    padding: 10px 10px 10px 20px;
    height: 60px;
    width: 140px;
    text-align: center;
	transform: rotate(0.001deg);
	}
#index #body #countdownWrap .inner .countdown p span.d{
	display:inline-block;
	font-size:2.5rem;
	padding:0 0.5rem;
	vertical-align:middle;
	}

#index #body #cheerWrap {
    border-bottom: 25px solid #C19D74;
    margin-bottom: 50px;
    width: 100%;
	}
#index #body #cheerWrap .inner{
    margin: 0 auto;
    height: 150px;
    position: relative;
    width: 960px;
	}
#index #body #cheerWrap .inner .runner,
#index #body #cheerWrap .inner .cheer {
    position: absolute;
	}
#index #body #cheerWrap .inner .runner {
    right: 25%;
    bottom: -25px;
	}
#index #body #cheerWrap .inner .runner img{
    height: 150px;
    width: auto;
	}
#index #body #cheerWrap .inner .runner canvas.apng-image{
    height: 150px !important;
    width: auto !important;
    }
#index #body #cheerWrap .inner .cheer {
    left: 25%;
    bottom: -20px;
	}
#index #body #cheerWrap .inner .cheer img {
    height: 150px;
    transform: scale(-1, 1);
    width: auto;
	}
#index #body #cheerWrap .inner .cheer canvas.apng-image {
    height: 150px;
    transform: scale(-1, 1);
    width: auto;
	}

#index #body #topics{
    margin-bottom: 80px;
    width: 100%;
	}
#index #body #topics .inner{
    background: #FFF;
    border: 1px solid #22A4B3;
    color: #22A4B3;
    display: flex;
	margin:0 auto;
    padding: 14px;
	width:930px;
	}
#index #body #topics h2{
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 0;
    height: 140px;
    width: 220px;
	}
#index #body #topics h2 img{
    height: auto;
    width: 160px;
	}
#index #body #topics ul{
    display: block;
    overflow-y: auto;
    overflow-x: hidden;
    padding: 0 25px;
    height: 140px;
    width: 710px;
	}
#index #body #topics ul::-webkit-scrollbar{
    width: 5px;
    height: 5px;
    }
#index #body #topics ul::-webkit-scrollbar-thumb{
    background: #22A4B3;
    border-radius: 2.5px;
    }
#index #body #topics ul li{
    border-bottom: 1px solid #DDD;
    display: flex;
    width: 100%;
	}
#index #body #topics ul li span{
    display: inline-block;
	}
#index #body #topics ul li:last-child{
    border-bottom: 0;
	}
#index #body #topics ul li a{
    background-image: url("../images/index/arw_topics.png");
    background-repeat: no-repeat;
    background-position: right 15px top 25%;
    background-size: 16px;
    color: #555;
    display: block;
    padding-bottom: 10px;
    margin-top: 10px;
    width: 100%;
	}
#index #body #topics ul li a .date{
    margin-right: 1.0rem;
    }
#index #body #topics ul li a .new{
    background: #E85298;
    color: #FFF;
	font-family: 'Noto Sans JP', sans-serif !important;
	font-size:1.0rem;
	font-weight:bold;
    display: inline-block;
    line-height: 150%;
    margin-right: 1.0rem;
    padding: 5px;
    height: 1.6rem;
    width: 3.0rem;
    text-align: center;
    vertical-align: middle;
	transform: rotate(0.001deg);
	}
    
#index #body #outline{
    margin-bottom: 50px;
    width: 100%;
	}
#index #body #outline .inner{
    color: #22A4B3;
	margin:0 auto;
    padding: 0 160px;
	width:600px;
	}
#index #body #outline .inner h2{
	font-size:3.5rem;
	line-height:150%;
	letter-spacing:0.2rem;
	}
#index #body #outline .inner p{
	font-size:2.0rem;
	margin-bottom:50px;
	}
#index #body #outline .inner p.btn{
	text-align:center;
	}
#index #body #outline .inner p.btn a{
    background-image: url("../images/arw.png");
    background-repeat: no-repeat;
    background-position: top 50% right 15px;
    background-size: 16px 20px;
	background-color:#22A4B3;
	color:#FFF;
	font-family: 'Noto Sans JP', sans-serif !important;
	font-weight:bold;
	line-height:100%;
	padding: 15px 40px 15px 20px;
	width:260px;
	transform: rotate(0.001deg);
	}

#index #body #activity{
    width: 100%;
	}
#index #body #activity .inner{
	position:relative;
	margin:0 auto 50px;
    padding: 0 10px;
	width:940px;
	}
#index #body #activity .contWrap {
    clear: both;
    margin-bottom: 20px;
	}
#index #body #activity .contWrap li{
    float: left;
    width: 300px;
	}
#index #body #activity .contWrap li:nth-child(2n){
    margin: 0 20px;
	}
#index #body #activity .contWrap li img{
    height: auto;
    width: 300px;
	}
#index #body #activity .contWrap li#bottle{
    animation-delay: 0.2s;
	}
#index #body #activity .contWrap li#lastyear{
    animation-delay: 0.4s;
	}

#index #body #cf{
    margin-bottom: 50px;
	width:100%;
	}
#index #body #cf h2{
    text-align: center;
    margin-bottom: 0;
    height: 85px;
    overflow: hidden;
    }
#index #body #cf h2 img{
    backface-visibility: hidden;
    height: 100%;
    width: auto;
    }
#index #body #cf .inner{
    position: relative;
    background: #22A4B3;
    display: flex;
    justify-content: space-between;
    height: 330px;
    margin: 0 auto;
    padding: 0;
	width:940px;
	}
#index #body #cf .inner span{
    background-color: rgba(0,0,0,0.75);
	color:#FFF;
    display: block;
	font-size:2.0rem;
	font-family: 'Noto Sans JP', sans-serif !important;
	font-weight:normal;
	line-height:180%;
    letter-spacing: 0.5rem;
    height: 180px;
    padding-top: 150px;
    position: absolute;
	text-align:center;
	transform: rotate(0.001deg);
    width: 100%;
    z-index: 5;
    }
#index #body #cf .inner dl{
    padding: 20px 0;
    margin: 0;
	width:440px;
	}
#index #body #cf .inner dt{
	color:#FFF;
	font-family: 'Noto Sans JP', sans-serif !important;
	font-weight:bold;
    font-size: 2.0rem;
    margin-bottom: 10px;
    text-align: center;
	transform: rotate(0.001deg);
	}
#index #body #cf .inner dd img{
	width:100%;
	}

/***** ##tournament *****/

#tournament #body .bottledesign{
    background: url("../images/tournament/bg_bottle.png") repeat-x center top;
    margin: 120px 0 50px;
    padding-top: 450px;
    position: relative;
    width: 100%;
    min-width: 960px;
	}
#tournament #body .bottledesign h2{
    height: 85px;
    overflow: hidden;
    position: absolute;
    top: -85px;
    left: 50%;
    transform: translateY(0) translateX(-50%) ;
    -webkit- transform: translateY(0) translateX(-50%);
	}
#tournament #body .bottledesign h2 img{
    height: 85px;
    width: auto;
	}
#tournament #body .bottledesign .inner{
    position: relative;
    background: #22A4B3;
    margin: 0 auto;
    padding: 20px 20px 0;
	width:900px;
	}
#tournament #body .bottledesign .inner h3{
    position: absolute;
    top: -60px;
    left: 50%;
    transform: translateY(0) translateX(-50%) ;
    -webkit- transform: translateY(0) translateX(-50%);
	}
#tournament #body .bottledesign .inner h3 img{
    height: 40px;
    width: auto;
	}
#tournament #body .bottledesign .inner .btn{
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    flex-wrap: wrap;
    width: 900px;
	}
#tournament #body .bottledesign .inner .btn li{
    margin-bottom: 20px;
	}
#tournament #body .bottledesign .inner .btn li a{
    background: #FFEF40;
	border-radius:18px;
	-webkit-border-radius:18px;
	-moz-border-radius:18px;
	color:#22A4B3;
    display: block;
	font-size:1.8rem;
	font-family: 'Noto Sans JP', sans-serif !important;
	font-weight:700;
	line-height:120%;
    height: 26px;
    padding: 5px 0;
	text-align:center;
	transform: rotate(0.001deg);
    width: 170px;
	}

#tournament #body #resultWrap{
    margin-top: -150px;
    padding-top: 150px;
	width:100%;
    }
#tournament #body #resultWrap h2{
    text-align: center;
    margin-bottom: 0;
    height: 79px;
    overflow: hidden;
    }
#tournament #body #resultWrap h2 img{
    height: auto;
    width: 270px;
    }
#tournament #body #resultWrap .inner{
	background:#FFF;
	border:3px solid #22A4B3;
	margin:0 auto 50px;
	padding:46px 76px;
	width:790px;
    }
#tournament #body .results .source{
	text-align:right;
	}

/***** #support *****/

#support #body .state {
    margin: 0 0 50px;
    width: 100%;
    }
#support #body .state ul{
    display: flex;
    width: 100%;
    }
#support #body .state ul li{
    width: 50%;
    }
#support #body .state ul li img{
    height: auto;
    width: 100%;
    }

#support #body #resultWrap{
    margin-top: -150px;
    padding-top: 150px;
	width:100%;
    }
#support #body #resultWrap h2{
    text-align: center;
    margin-bottom: 0;
    height: 84px;
    overflow: hidden;
    }
#support #body #resultWrap h2 img{
    height: auto;
    width: 270px;
    }
#support #body #resultWrap .inner{
	background:#FFF;
	border:3px solid #22A4B3;
	margin:0 auto 50px;
	padding:46px 76px;
	width:790px;
    }

#support #body #resultWrap nav ul.tab{
    display: flex;
    flex-wrap:wrap;
    justify-content:space-between;
    margin-bottom: 50px;
    padding: 0;
    width: 760px;
	}
#support #body #resultWrap nav ul li{
    margin-bottom: 20px;
    position: relative;
    width: 175px;
	}
#support #body #resultWrap nav ul li a{
    background: #22A4B3;
	color:#FFF;
    display: block;
	font-size:1.6rem;
	font-family: 'Noto Sans JP', sans-serif !important;
	font-weight:normal;
	line-height:180%;
    height: 3.0rem;
	opacity:1.0;
    padding: 10px 0;
	text-align:center;
	transform: rotate(0.001deg);
    width: 175px;
	}
#support #body #resultWrap nav ul li a.active{
	transition:opacity 0.5s ease;
	opacity:0.5;
	}
#support #body #resultWrap nav ul li span{
	font-size:1.2rem;
    margin-left: 0.5rem;
	}
#support #body #resultWrap .results{
	display:none;
	}
#support #body #resultWrap .results.show{
	display:block;
	}
#support #body .results caption{
	color:#22A4B3;
	font-size:3.0rem;
	font-family: 'Noto Sans JP', sans-serif !important;
	font-weight:bold;
	line-height:150%;
	margin-bottom:20px;
	text-align:center;
	transform: rotate(0.001deg);
	}
#support #body .results .ex,
#support #body .results .source{
	text-align:right;
	}
#support #body .results .ex span{
	background-color:#FFF67F;
	border:1px solid #DDD;
	display:inline-block;
	height:1.6rem;
	margin-right:1.0rem;
	width:3.0rem;
	vertical-align:middle;
	}
#support #body .results .source{
	text-align:right;
	}

    /* 北海道地区予選 */
    #support #body .results#hokkaido tr:nth-child(-n+2){
        background-color:#FFF67F;
        color: #E85298;
        }
    /* 東北地区予選 */
    #support #body .results#tohoku tr:nth-child(-n+2){
        background-color:#FFF67F;
        color: #E85298;
        }
    /* 北信越地区予選 */
    #support #body .results#hokushinetsu tr:nth-child(-n+2){
        background-color:#FFF67F;
        color: #E85298;
        }
    /* 東海地区予選 */
    #support #body .results#tokai tr:nth-child(-n+2){
        background-color:#FFF67F;
        color: #E85298;
        }
    /* 中国四国地区予選 */
    #support #body .results#chugokushikoku tr:nth-child(-n+2){
        background-color:#FFF67F;
        color: #E85298;
        }
    /* 九州地区予選 */
    #support #body .results#kyushu tr:nth-child(-n+2){
        background-color:#FFF67F;
        color: #E85298;
        }

#support #body #seedWrap{
    margin-top: -150px;
    padding-top: 150px;
	width:100%;
    }
#support #body #seedWrap h2{
    text-align: center;
    margin-bottom: 0;
    height: 85px;
    overflow: hidden;
    }
#support #body #seedWrap h2 img{
    height: auto;
    width: 300px;
    }
#support #body #seedWrap .inner{
	background:#FFF;
	border:3px solid #22A4B3;
	margin:0 auto 50px;
	padding:46px 76px;
	width:790px;
    }
#support #body #seedWrap .results{
	display:block;
	}

/***** #goods *****/

#goods #body article.goods {
    background: url("../images/goods/bg_goods.png") repeat-y center top;
    border: 1px solid #22A4B3;
    border-left: 0;
    border-right: 0;
    padding: 0;
    margin-bottom: 20px;
    width: 100%;
    }
#goods #body article.goods .inner{
    display: flex;
    padding: 0;
    width: 960px;
    }
#goods #body article.goods .inner .title{
    display: flex;
    width: 480px;
    }
#goods #body article.goods .inner .title dt{
    background: #22A4B3;
	position:relative;
    width: 200px;
    }
#goods #body article.goods .inner .title dt img{
    height: auto;
    width: 140px;
	position:absolute;
    top: 50%;
    left: 50%;
    transform: translateY(-50%) translateX(-50%) ;
    -webkit- transform: translateY(-50%) translateX(-50%);
    }
#goods #body article.goods .inner .title dd{
    width: 280px;
    }
#goods #body article.goods .inner .title dd figure{
    display: block;
    height: 100%;
    width: 100%;
    }
#goods #body article.goods .inner .title dd figure img{
    display: none;
    }
#goods #body article.goods .inner .text{
    min-height: 350px;
    padding: 25px;
    position: relative;
    width: 430px;
    }
#goods #body article.goods .inner .text p{
    background: linear-gradient(transparent 95%, #22A4B3 0%);
    color: #22A4B3;
    display: inline;
	font-size:1.5rem;
	font-family: 'Noto Sans JP', sans-serif !important;
	font-weight:normal;
    line-height: 250%;
    padding-bottom: 10px;
	transform: rotate(0.001deg);
    }

    /* グッズ1 */
    #goods #body article#goods01 .title dd figure{
        background: url("../images/goods/thumb_goods_01.png") no-repeat 50% 50%;
        background-size: cover;
        }
    #goods #body article#goods01 .text figure{
        position: absolute;
        bottom: 10px;
        left: 25px;
        width: 200px;
        }
    #goods #body article#goods01 .text figure img{
        width: 100%;
        }
    #goods #body article#goods01 .text ul{
        line-height: 100%;
        position: absolute;
        bottom: 15px;
        right: 25px;
        width: 200px;
        }
    #goods #body article#goods01 .text ul li{
        margin-top: 10px;
        margin-bottom: 0;
        width: 200px;
        }
    #goods #body article#goods01 .text ul li img{
        width: 100%;
        }

    /* グッズ2 */
    #goods #body article#goods02 .title dd figure{
        background: url("../images/goods/thumb_goods_02.png") no-repeat 50% 50%;
        background-size: cover;
        }
    #goods #body article#goods02 .text{
        min-height: 290px;
        padding-top: 60px;
        }
    #goods #body article#goods02 .text figure{
        float: right;
        padding: 30px 0 30px 20px;
        width: 160px;
        }
    #goods #body article#goods02 .text figure img{
        width: 100%;
        }

    /* グッズ3 */
    #goods #body article#goods03 .title dd figure{
        background: url("../images/goods/thumb_goods_03.png") no-repeat 50% 50%;
        background-size: cover;
        }
    #goods #body article#goods03 .title dd{
        position: relative;
        }
    #goods #body article#goods03 .title dd span{
        color: #FFF;
        font-size: 1.2rem;
        position: absolute;
        bottom: 10px;
        right: 10px;
        text-align: right;
        }
    #goods #body article#goods03 .text{
        min-height: 310px;
        padding-top: 40px;
        }
    #goods #body article#goods03 .text figure{
        float: right;
        padding: 0 0 0 20px;
        width: 160px;
        }
    #goods #body article#goods03 .text figure img{
        width: 100%;
        }

    /* グッズ4 */
    #goods #body article#goods04 .title dd figure{
        background: url("../images/goods/thumb_goods_04.png") no-repeat 50% 50%;
        background-size: cover;
        }
    #goods #body article#goods04 .text figure{
        position: absolute;
        bottom: 10px;
        left: 25px;
        width: 160px;
        }
    #goods #body article#goods04 .text figure img{
        width: 100%;
        }
    #goods #body article#goods04 .text ul{
        line-height: 100%;
        position: absolute;
        bottom: 15px;
        right: 40px;
        width: 200px;
        }
    #goods #body article#goods04 .text ul li{
        margin-top: 10px;
        margin-bottom: 0;
        width: 200px;
        }
    #goods #body article#goods04 .text ul li img{
        width: 100%;
        }



/***** #messagebottle *****/

.modalWrapper{
	width:700px;
	}
.modalWrapper img{
	width:700px;
	}
#messagebottle #body article h2 {
    line-height: 0;
    margin-bottom: 0;
    overflow: hidden;
    text-align: center;
    width: 100%;
    }
#messagebottle #body article h2 img{
    width: auto;
    }

#messagebottle #body article.bottledesign {
    background: #FFF;
    border-top: 1px solid #22A4B3;
    border-bottom: 1px solid #22A4B3;
    margin-bottom: 50px;
    padding: 25px 0 0;
    width: 100%;
    }
#messagebottle #body article.bottledesign h2,
#messagebottle #body article.bottledesign h2 img{
    height: 120px;
    }
#messagebottle #body article.bottledesign ul{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    width: 940px;
    }
#messagebottle #body article.bottledesign li {
    line-height: 100%;
    margin-bottom: 20px;
    width: 220px;
    }
#messagebottle #body article.bottledesign li img{
    width: 100%;
    }
#messagebottle #body article.bottledesign p.btn{
    text-align: center;
    width: 100%;
    }
#messagebottle #body article.bottledesign p.btn img{
    height: auto;
    width: 225px;
    }

#messagebottle #body article.message h2,
#messagebottle #body article.message h2 img{
    height: 80px;
    }
#messagebottle #body #messageWrap {
    display: block;
    height: 1000px;
    width: 940px;
    position: relative;
    }
#messagebottle #body #messageWrap li{
    display: none;
    position: absolute;
    }

#messagebottle #body .mainMessageA,
#messagebottle #body .mainMessageB,
#messagebottle #body .mainMessageC {
    z-index: 100;
    }

#messagebottle #body #mainMessageA-01,
#messagebottle #body #mainMessageA-02,
#messagebottle #body #mainMessageA-03 {
    top: 20px;
    }
#messagebottle #body #mainMessageA-01 {
    left: 190px;
    }
#messagebottle #body #mainMessageA-02 {
    top: 0px;
    left: 200px;
    }
#messagebottle #body #mainMessageA-03 {
    left: 180px;
    }
#messagebottle #body #mainMessageA-04 {
    top: 40px;
    left: 210px;
    }

#messagebottle #body #mainMessageB-01,
#messagebottle #body #mainMessageB-02,
#messagebottle #body #mainMessageB-03 {
    top: 320px;
    }
#messagebottle #body #mainMessageB-01 {
    right: 180px;
    }
#messagebottle #body #mainMessageB-02 {
    top: 300px;
    right: 200px;
    }
#messagebottle #body #mainMessageB-03 {
    top: 340px;
    right: 190px;
    }

#messagebottle #body #mainMessageC-01,
#messagebottle #body #mainMessageC-02,
#messagebottle #body #mainMessageC-03 {
    bottom: 20px;
    }
#messagebottle #body #mainMessageC-01 {
    left: 180px;
    }
#messagebottle #body #mainMessageC-02 {
    bottom: 0px;
    left: 200px;
    }
#messagebottle #body #mainMessageC-03 {
    bottom: 40px;
    left: 190px;
    }

#messagebottle #body .subMessageA {
    z-index: 1;
    }
#messagebottle #body .subMessageB {
    z-index: 2;
    }
#messagebottle #body .subMessageC {
    z-index: 3;
    }
#messagebottle #body .subMessageD {
    z-index: 4;
    }
#messagebottle #body .subMessageE {
    z-index: 5;
    }
#messagebottle #body .subMessageF {
    z-index: 6;
    }
#messagebottle #body .subMessageG {
    z-index: 7;
    }
#messagebottle #body .subMessageH {
    z-index: 8;
    }
#messagebottle #body .subMessageI {
    z-index: 9;
    }

#messagebottle #body #subMessageA-01,
#messagebottle #body #subMessageA-02,
#messagebottle #body #subMessageA-03,
#messagebottle #body #subMessageA-04 {
    left: 0px;
    top: 50px;
    }
#messagebottle #body #subMessageA-01 {
    top: 0px;
    }
#messagebottle #body #subMessageA-02 {
    left: 25px;
    }
#messagebottle #body #subMessageA-03 {
    top: 80px;
    }
#messagebottle #body #subMessageA-04 {
    left: 30px;
    }

#messagebottle #body #subMessageB-01,
#messagebottle #body #subMessageB-02,
#messagebottle #body #subMessageB-03,
#messagebottle #body #subMessageB-04 {
    right: 0px;
    top: 0px;
    }
#messagebottle #body #subMessageB-01 {
    }
#messagebottle #body #subMessageB-02 {
    top: 50px;
    }
#messagebottle #body #subMessageB-03 {
    right: 50px;
    }
#messagebottle #body #subMessageB-04 {
    top: 30px;
    }

#messagebottle #body #subMessageC-01,
#messagebottle #body #subMessageC-02,
#messagebottle #body #subMessageC-03,
#messagebottle #body #subMessageC-04 {
    right: 100px;
    top: 160px;
    }
#messagebottle #body #subMessageC-01 {
    }
#messagebottle #body #subMessageC-02 {
    top: 180px;
    }
#messagebottle #body #subMessageC-03 {
    right: 120px;
    }
#messagebottle #body #subMessageC-04 {
    top: 200px;
    }

#messagebottle #body #subMessageD-01,
#messagebottle #body #subMessageD-02,
#messagebottle #body #subMessageD-03,
#messagebottle #body #subMessageD-04 {
    left: 120px;
    top: 300px;
    }
#messagebottle #body #subMessageD-01 {
    }
#messagebottle #body #subMessageD-02 {
    left: 50px;
    }
#messagebottle #body #subMessageD-03 {
    top: 250px;
    }
#messagebottle #body #subMessageD-04 {
    left: 100px;
    }

#messagebottle #body #subMessageE-01,
#messagebottle #body #subMessageE-02,
#messagebottle #body #subMessageE-03,
#messagebottle #body #subMessageE-04 {
    left: 0px;
    top: 500px;
    }
#messagebottle #body #subMessageE-01 {
    }
#messagebottle #body #subMessageE-02 {
    top: 550px;
    }
#messagebottle #body #subMessageE-03 {
    left: 100px;
    }
#messagebottle #body #subMessageE-04 {
    top: 450px;
    }

#messagebottle #body #subMessageF-01,
#messagebottle #body #subMessageF-02,
#messagebottle #body #subMessageF-03 {
    right: 0px;
    top: 420px;
    }
#messagebottle #body #subMessageF-01 {
    }
#messagebottle #body #subMessageF-02 {
    top: 500px;
    }
#messagebottle #body #subMessageF-03 {
    right: 25px;
    }

#messagebottle #body #subMessageG-01,
#messagebottle #body #subMessageG-02,
#messagebottle #body #subMessageG-03 {
    right: 130px;
    bottom: 180px;
    }
#messagebottle #body #subMessageG-01 {
    }
#messagebottle #body #subMessageG-02 {
    bottom: 200px;
    }
#messagebottle #body #subMessageG-03 {
    right: 100px;
    }

#messagebottle #body #subMessageH-01,
#messagebottle #body #subMessageH-02,
#messagebottle #body #subMessageH-03 {
    left: 0px;
    bottom: 50px;
    }
#messagebottle #body #subMessageH-01 {
    }
#messagebottle #body #subMessageH-02 {
    bottom: 0px;
    }
#messagebottle #body #subMessageH-03 {
    left: 50px;
    }

#messagebottle #body #subMessageI-01,
#messagebottle #body #subMessageI-02,
#messagebottle #body #subMessageI-03 {
    right: 0px;
    bottom: 0px;
    }
#messagebottle #body #subMessageI-01 {
    }
#messagebottle #body #subMessageI-02 {
    right: 50px;
    }
#messagebottle #body #subMessageI-03 {
    bottom: 50px;
    }



/***** #lastyear *****/

#lastyear #body .tab li {
    margin: 0 auto;
    width: 460px;
    }
/*#lastyear #body .tab li:first-child {
    margin-right: 20px;
    }*/
#lastyear #body .tab li img {
    width: 100%;
    }
    
#lastyear #body ul.infograph {
    clear: both;
    margin-bottom: 50px;
    width: 100%;
    }
#lastyear #body ul.infograph li {
    float: left;
    margin-right: 20px;
    margin-bottom: 20px;
    width: 300px;
    }
#lastyear #body ul.infograph li:nth-child(3n) {
    margin-right: 0;
    }
#lastyear #body ul.infograph li:nth-child(2) {
    animation-delay: 0.2s;
    }
#lastyear #body ul.infograph li:nth-child(3) {
    animation-delay: 0.4s;
    }
#lastyear #body ul.infograph li:nth-child(5) {
    animation-delay: 0.2s;
    }
#lastyear #body ul.infograph li:nth-child(6) {
    animation-delay: 0.4s;
    }
#lastyear #body ul.infograph li:nth-child(8) {
    animation-delay: 0.2s;
    }
#lastyear #body ul.infograph li:nth-child(9) {
    animation-delay: 0.4s;
    }
#lastyear #body ul.infograph li img {
    width: 100%;
    }

#lastyear #body .bnrWrap {
    width: 940px;
    }
#lastyear #body .bnrWrap img {
    height: auto;
    width: 100%;
    }



/*******************
footer styles
********************/

footer{
	background:#22A4B3;
	margin-top:0;
	}
footer .inner{
	font-size:1.4rem;
	height:50px;
	padding:50px 0 25px;
	position:relative;
	text-align:center;
	}

footer .inner nav{
	margin-bottom:30px;
	position:relative;
	overflow:hidden;
	}
footer .inner nav ul{
	float:left;
	left:50%;
	position:relative;
	}
footer .inner nav ul li{
	display:inline-block;
	float:left;
	left:-50%;
	margin-right:20px;
	position:relative;
	}
footer .inner nav ul li a{
	color:#FFF;
	}

footer .inner address{
	color:#FFF;
	font-style:normal;
	}

footer .inner #backtotop{
	position:fixed;
	bottom:20px;
	right:20px;
	z-index:100000;
	}





}

@media print,screen and (min-width:768px) and (max-width: 1024px){

html,body{
	overflow-x:hidden;
	-webkit-overflow-scrolling:touch;
}





}
@media only screen and (max-width: 767px) {

/*******************
common styles
********************/

html,body{
	margin:0;
	padding:0;
	overflow-x:hidden;
	}

body{
	background-image: url(../images/bg.png);
    background-position: center 100px;
    background-repeat: repeat-y;
    background-size: 120%;
	font-size:2.0rem;
	position:relative;
    -webkit-text-size-adjust: none;
	}
body#index{
    background-position: center 150px;
	}

header,
section,
footer{
	display:block;
	width:100%;
	}
section .inner{
	padding:0 3%;
	width:94%;
	}

.pc{
	display:none;
	}

.btm{
	margin-bottom:50px;
	}
.note{
	font-size:1.6rem;
	}

#term{
    position: fixed;
    bottom: 20px;
    left: 20px;
    z-index: 10000;
    }




/*******************
header styles
********************/

header{
	background:#FFF;
	border-bottom:5px solid #22A4B3;
	height:100px;
	position:fixed;
	top:0;
	z-index:10000;
	}
header .inner{
	position:relative;
	}
header .inner #logo{
	position:absolute;
	top:20px;
	left:3.125%;
	}
header .inner #logo img{
	height:60px;
	width:auto;
	}

header #menu {
	display:block;
	position:absolute;
	top:30px;
	right:6.25%;
	height:40px;
	width:40px;
	}
header #menu .bar {
    display:inline-block;
    width:40px;
    height:2px;
    background-color:#000;
    position:absolute;
    left:10px;
    transition:.15s ease-in-out;
}
header #bar01 {
    top:0;
}
header #bar02 {
    top:18px;
}
header #bar03 {
    top:36px;
}
header .active #bar01 {
    top:18px;
    transform:rotate(45deg);
}
header .active #bar02 {
    top:18px;
    transform:rotate(45deg);
}
header .active #bar03 {
    top:18px;
    transform:rotate(-45deg);
}

header #gNav{
	position:absolute;
	z-index:1000;
	height:100vh;
	top:102px;
	width:100%;
	z-index:100;
	}
header #gNav .gNav{
	width:100%;
	}
header #gNav .gNav li{
	position:relative;
	}
header #gNav .gNav li span.new,
header #gNav .gNav li span.comingsoon{
	position:absolute;
	top:20px;
	left:3.125%;
	z-index:10000;
	}
header #gNav .gNav li a{
	background:#22A4B3;
	border-bottom:1px solid #FFF;
    color: #FFF;
	display:block;
	font-family: 'Noto Sans JP', sans-serif !important;
	padding:60px 3.125%;
	font-size:3.0rem;
	width:93.75%;
	}
header #gNav .gNav li a span{
	transform: rotate(0.001deg);
	}
header .inner #gNav .gNav li a.off{
	cursor:default;
	color:#AAA;
	}
header .inner #gNav .gNav li a.off:hover{
	opacity:1.0;
	filter:alpha(opacity=100);
	-ms-filter:"alpha( opacity=100 )";
	}





/*******************
#main styles
********************/

#main{
    margin-bottom: 50px;
	padding-top:100px;
	position:relative;
	text-align:center;
	}



/***** #index *****/

#index #main{
	background-image:url(../images/index/bg_main.png);
	background-size: auto 400px;
	background-position:center top 100px;
    margin-bottom: 0;
	position:relative;
    padding-top: 100px;
	text-align:center;
	width:100%;
	}

#index #main .inner{
	height:400px;
    margin: 0 auto;
    text-align: center;
    width: 600px;
	}

#index #main h1{
	position:relative;
	}
#index #main h1 .lavel,
#index #main h1 .mark,
#index #main h1 .megapon {
	position:absolute;
	height:auto;
	}
#index #main h1 .lavel{
    background: #FFF33F;
    border-radius: 50%;
    color: #AA965C;
	font-family: 'Noto Sans JP', sans-serif !important;
	font-size:1.6rem;
	font-weight:700;
    height: 75px;
    line-height: 120%;
    padding-top: 15px;
	width:90px;
    top: 20px;
    left: 120px;
    text-align: center;
	transform: rotate(-10deg);
	}
#index #main h1 img.mark{
    top: 30px;
    left: 50%;
    transform: translateX(-50%);
    -webkit- transform: translateX(-50%);
	width:160px;
	}
#index #main h1 img.megapon{
    top: 20px;
    right: 50px;
	width:160px;
	}

/***** ##tournament *****/

#tournament #main {
    background: url("../images/tournament/bg_main.png") no-repeat;
    background-position: top 100px left 50%;
    border-bottom: 25px solid #C19D74;
    margin-bottom: 150px;
    width: 100%;
	}
#tournament #main .inner{
    margin: 0 auto;
    height: 300px;
    position: relative;
    width: 100%;
	}
#tournament #main .inner h1{
    position: absolute;
    left: 0;
    right: 0;
    bottom: -20px;
    margin: 0 auto;
	}
#tournament #main .inner h1 img{
    height: 260px;
    width: auto;
	}
#tournament #main .inner nav{
    position: absolute;
    left: 0;
    right: 0;
    bottom: -150px;
    margin: 0 auto;
    width: 300px;
	}
#tournament #main .inner nav figure img{
    height: auto;
    width: 300px;
	}

/***** #support *****/

#support #main{
	background-image:url(../images/support/bg_main.png);
	background-size:100%;
	background-position:center top 150px;
	background-repeat:no-repeat;
	position:relative;
    padding-top: 100px;
	width:100%;
	}
#support #main .inner{
	min-height:900px;
	position:relative;
	}
#support #main h1{
    background: #FFF;
    display: block;
    padding: 20px;
	position:absolute;
    top: 20px;
    left: 3%;
	width:120px;
	}
#support #main h1 img.mark{
	width:100%;
	}

#support #main ul.map {
    position: relative;
    min-height: 900px;
    width: 100%;
	}
#support #main ul.map li {
    position: absolute;
    height: 85px;
    width: 180px;
	}
#support #main ul.map li#hokkaido {
    top: 40px;
    left: 35%;
	}
#support #main ul.map li#hokushinetsu {
    animation-delay: 0.2s;
    top: 220px;
    left: 25%;
	}
#support #main ul.map li#tohoku {
    animation-delay: 0.4s;
    top: 200px;
    right: 3%;
	}
#support #main ul.map li#tokai {
    animation-delay: 0.6s;
    bottom: 380px;
    right: 10%;
	}
#support #main ul.map li#chugokushikoku {
    animation-delay: 0.8s;
    bottom: 480px;
    left: 6%;
	}
#support #main ul.map li#kyushu {
    animation-delay: 1.0s;
    bottom: 320px;
    left: 3%;
	}

#support #main ul.map li dl {
    color: #FFF;
	font-family: 'Noto Sans JP', sans-serif !important;
	font-size:1.6rem;
	font-weight:500;
    height: 70px;
    line-height: 150%;
    margin: 0 auto;
    padding-top: 15px;
    position: relative;
    text-align: center;
	transform: rotate(0.001deg);
    width: 180px;
    z-index: 1;
    }
#support #main ul.map li dl::before {
    background-color:#22A4B3;
    border: 1px solid #FFF;
    content: "";
    filter: drop-shadow(5px 5px 0 #FFF67F);
    position: absolute;
    top: 0; bottom: 0; left: 0; right: 0;
    transform: skewX(-10deg);
    z-index: -1;
    }
#support #main ul.map li dd {
	font-size:1.8rem;
    }
#support #main ul.map li dd span {
	font-size:3.0rem;
	font-weight:700;
    }
#support #main ul.map li dd.icon {
    position: relative;
	}
#support #main ul.map li dd.icon img {
    position: absolute;
    top: -90px;
    left: 15px;
    height: auto;
    width: 160px;
	}

#support #main p.caution,
#support #main dl.schedule {
	font-family: 'Noto Sans JP', sans-serif !important;
	font-weight:bold;
	position:absolute;
	transform: rotate(0.001deg);
	}
#support #main p.caution {
    color: #555 !important;
    font-size: 1.6rem;
    bottom: 220px;
    right: 3%;
	}
#support #main dl.schedule {
    color: #E85298;
    font-size: 2.5rem;
    bottom: 50px;
    line-height: 180%;
    letter-spacing: 0.2rem;
    left: 50%;
    right: 50%;
    transform: translateX(-50%) ;
    -webkit- transform: translateX(-50%);
    width: 100%;
	}
#support #main dl.schedule dt {
    font-size: 4.0rem;
	}
#support #main dl.schedule dd.time {
    font-size: 3.0rem;
    line-height: 200%;
	}

/***** #goods *****/

#goods #main{
	background-image:url("../images/goods/bg_main_sp.png");
	background-size: auto 350px;
	background-position:center top 100px;
    background-repeat: no-repeat;
	position:relative;
    padding-top: 100px;
	text-align:center;
	width:100%;
	}
#goods #main .inner{
	height:350px;
    margin: 0 auto;
	position:relative;
    text-align: center;
	}
#goods #main h1{
    display: block;
	position:absolute;
    top: 20px;
    left: 50%;
    transform: translateX(-50%) ;
    -webkit- transform: translateX(-50%);
	width:260px;
	}
#goods #main h1 img.character{
	width:100%;
	}

/***** #lastyear *****/

#lastyear #main{
	background-image:url(../images/lastyear/bg_main.png);
	background-size: auto 350px;
	background-position:center top 100px;
    background-repeat: no-repeat;
	position:relative;
    padding-top: 100px;
	text-align:center;
	width:100%;
	}
#lastyear #main .inner{
	height:350px;
    margin: 0 auto;
	position:relative;
    text-align: center;
	}
#lastyear #main h1{
    background: #FFF;
    display: block;
    padding: 20px;
	position:absolute;
    top: 50%;
    left: 50%;
    transform: translateY(-50%) translateX(-50%) ;
    -webkit- transform: translateY(-50%) translateX(-50%);
	width:160px;
	}
#lastyear #main h1 img.mark{
	width:100%;
	}

/***** #messagebottle *****/

#messagebottle #main {
    margin-bottom: 0;
    }
#messagebottle #main .inner{
    background: url("../images/messagebottle/bg_main.png") no-repeat;
    background-position: top -200px left 0;
    background-size: cover;
    height: 350px;
    padding-top: 100px;
	position:relative;
	width:100%;
	}
#messagebottle #main .copy {
    display: flex;
    align-items: flex-end;
    height: 170px;
	position:absolute;
    bottom: 20px;
    right: 8%;
    width: 453px;
    }
#messagebottle #main .copy h1{
    margin: 0;
    padding: 0;
    width: 320px;
    }
#messagebottle #main .copy h1 img{
    height: auto;
    width: 300px;
    }
/*#messagebottle #main .copy h1{
    background: url("../images/messagebottle/bg_speechbubble.png") no-repeat;
    background-size: contain;
    color: #E85298;
	font-family: 'Noto Sans JP', sans-serif !important;
    font-size: 1.4rem !important;
	font-weight:bold;
	transform: rotate(0.001deg);
    height: 100px;
    margin: 0 0 10px;
    padding: 45px 0 0;
    width: 300px;
    white-space: nowrap;
    text-align: center;
    }*/
#messagebottle #main .copy figure,
#messagebottle #main .copy figure img {
    height: 250px;
    width: 133px;
    }


/*******************
#body styles
********************/

#body .tab{
    padding: 0 3.125%;
    width: 93.75%;
    }
#body .tab li{
    }

#body .articleWrap {
    margin-bottom: 50px;
    }

#body .logoWrap{
    margin: 0 auto;
    text-align: center;
	width:100%;
	}
#body .logoWrap figure{
	}
#body .logoWrap #logo_corp{
    margin-bottom: 20px
	}
#body .logoWrap #logo_corp img{
	height:80px;
	width:auto;
	}
#body .logoWrap #logo_ekiden img{
	height:80px;
	width:auto;
	}

/***** #index *****/

#index #body #countdownWrap {
    border-bottom: 25px solid #C19D74;
    margin-bottom: 50px;
    width: 100%;
	}
#index #body #countdownWrap .inner{
    margin: 0 auto;
    height: 100px;
    position: relative;
    width: 100%;
	}
#index #body #countdownWrap .inner .runner,
#index #body #countdownWrap .inner .countdown {
    position: absolute;
	}
#index #body #countdownWrap .inner .runner{
    left: 50%;
    bottom: -20px;
	}
#index #body #countdownWrap .inner .runner img{
    height: 100px;
    width: auto;
	}
#index #body #countdownWrap .inner .runner canvas.apng-image{
    height: 100px !important;
    width: auto !important;
    }
#index #body #countdownWrap .inner .countdown {
    display: flex;
    right: 7%;
    bottom: -15px;
	}
#index #body #countdownWrap .inner .countdown img {
    height: 100px;
    width: auto;
	}
#index #body #countdownWrap .inner .countdown canvas.apng-image {
    height: 100px;
    width: auto;
	}
#index #body #countdownWrap .inner .countdown p {
    background: url("../images/index/bg_countdown.png") no-repeat;
    background-size: 160px 80px;
    color: #E85298;
    display: block;
	font-family: 'Noto Sans JP', sans-serif !important;
	font-size:1.6rem;
	font-weight:bold;
    padding: 10px 10px 10px 20px;
    height: 60px;
    width: 140px;
    text-align: center;
	transform: rotate(0.001deg);
	}
#index #body #countdownWrap .inner .countdown p span.d{
	display:inline-block;
	font-size:2.0rem;
	padding:0 0.5rem;
	vertical-align:middle;
	}

#index #body #cheerWrap {
    border-bottom: 25px solid #C19D74;
    margin-bottom: 50px;
    width: 100%;
	}
#index #body #cheerWrap .inner{
    margin: 0 auto;
    height: 100px;
    position: relative;
    width: 100%;
	}
#index #body #cheerWrap .inner .runner,
#index #body #cheerWrap .inner .cheer {
    position: absolute;
	}
#index #body #cheerWrap .inner .runner{
    right: 25%;
    bottom: -20px;
	}
#index #body #cheerWrap .inner .runner img{
    height: 100px;
    width: auto;
	}
#index #body #cheerWrap .inner .runner canvas.apng-image{
    height: 100px !important;
    width: auto !important;
    }
#index #body #cheerWrap .inner .cheer {
    display: flex;
    left: 25%;
    bottom: -15px;
	}
#index #body #cheerWrap .inner .cheer img {
    height: 100px;
    transform: scale(-1, 1);
    width: auto;
	}
#index #body #cheerWrap .inner .cheer canvas.apng-image {
    height: 100px;
    transform: scale(-1, 1);
    width: auto;
	}

#index #body #topics{
    margin-bottom: 50px;
    padding: 0 3.125%;
	width:93.75%;
	}
#index #body #topics .inner{
    background: #FFF;
    border: 1px solid #22A4B3;
    color: #22A4B3;
	margin:0 auto;
    padding: 20px 3.125%;
	width:93.75%;
	}
#index #body #topics h2{
    display: block;
    height: 50px;
    margin-bottom: 0;
    padding: 15px 0;
    width: 100%;
    text-align: center;
	}
#index #body #topics h2 img{
    height: auto;
    width: 220px;
	}
#index #body #topics ul{
    display: block;
    overflow-y: auto;
    overflow-x: hidden;
    margin-bottom: 0;
    padding: 0;
    height: 200px;
    width: 100%;
	}
#index #body #topics ul::-webkit-scrollbar{
    width: 5px;
    height: 5px;
    }
#index #body #topics ul::-webkit-scrollbar-thumb{
    background: #22A4B3;
    border-radius: 2.5px;
    }
#index #body #topics ul li{
    border-bottom: 1px solid #DDD;
    width: 100%;
	}
#index #body #topics ul li:last-child{
    border-bottom: 0;
	}
#index #body #topics ul li a{
    background-image: url("../images/index/arw_topics.png");
    background-repeat: no-repeat;
    background-position: right 15px top 25%;
    background-size: 20px;
    color: #555;
    display: block;
    padding-bottom: 15px;
    padding-right: 5%;
    margin-top: 15px;
    width: 95%;
	}
#index #body #topics ul li a .new{
    background: #E85298;
    color: #FFF;
	font-family: 'Noto Sans JP', sans-serif !important;
	font-size:1.4rem;
	font-weight:bold;
    display: inline-block;
    line-height: 120%;
    margin-right: 1.0rem;
    padding: 2px 10px 5px;
    height: 1.4rem;
    width: 3.0rem;
    text-align: center;
    vertical-align: middle;
	transform: rotate(0.001deg);
	}
#index #body #topics ul li a .date{
    margin-right: 1.0rem;
    }
    
#index #body #outline{
    margin-bottom: 50px;
    width: 100%;
	}
#index #body #outline .inner{
    color: #22A4B3;
	margin:0 auto;
    padding: 0 9.375%;
	width:81.25%;
	}
#index #body #outline .inner h2{
	font-size:3.0rem;
	line-height:150%;
	letter-spacing:0.25rem;
	}
#index #body #outline .inner p{
	font-size:2.0rem;
	margin-bottom:50px;
	}
#index #body #outline .inner p.btn{
	text-align:center;
	}
#index #body #outline .inner p.btn a{
    background-image: url("../images/arw.png");
    background-repeat: no-repeat;
    background-position: top 50% right 15px;
    background-size: 16px 20px;
	background-color:#22A4B3;
	color:#FFF;
	font-family: 'Noto Sans JP', sans-serif !important;
	font-weight:bold;
	font-size:2.5rem;
	line-height:100%;
	padding: 15px 40px 15px 20px;
	width:300px;
	transform: rotate(0.001deg);
	}

#index #body #activity{
    margin-bottom: 50px;
    width: 100%;
	}
#index #body #activity .inner{
	position:relative;
	margin:0 auto;
    padding: 0 3.125%;
	width:93.75%;
	}
#index #body #activity .contWrap {
    margin-bottom: 50px;
	}
#index #body #activity .contWrap li{
    margin-bottom: 20px;
    width: 100%;
	}
#index #body #activity .contWrap li img{
    height: auto;
    width: 100%;
	}

#index #body #cf{
    margin-bottom: 50px;
    padding: 0 3.125%;
	width:93.75%;
	}
#index #body #cf h2{
    text-align: center;
    margin-bottom: 0;
    height: 95px;
    overflow: hidden;
    }
#index #body #cf h2 img{
    backface-visibility: hidden;
    height: 100%;
    width: auto;
    }
#index #body #cf .inner{
    position: relative;
    background: #22A4B3;
    height: 850px;
    margin: 0 auto;
    padding: 0;
	width: 100%;
	}
#index #body #cf .inner span{
    background-color: rgba(0,0,0,0.75);
	color:#FFF;
    display: block;
	font-size:3.0rem;
	font-family: 'Noto Sans JP', sans-serif !important;
	font-weight:normal;
	line-height:180%;
    letter-spacing: 0.5rem;
    height: 450px;
    padding-top: 400px;
    position: absolute;
	text-align:center;
	transform: rotate(0.001deg);
    width: 100%;
    z-index: 5;
    }
#index #body #cf .inner dl{
    padding: 25px 3.125%;
    margin: 0;
	width: 93.75%;
	}
#index #body #cf .inner dt{
	color:#FFF;
	font-family: 'Noto Sans JP', sans-serif !important;
	font-weight:bold;
    font-size: 3.5rem;
    margin-bottom: 20px;
    text-align: center;
	transform: rotate(0.001deg);
	}
#index #body #cf .inner dd img{
	width:100%;
	}

/***** ##tournament *****/

#tournament #body .bottledesign{
    background: url("../images/tournament/bg_bottle_sp.png") no-repeat;
    margin: 150px 0 50px;
    padding-top: 450px;
    position: relative;
    width: 100%;
	}
#tournament #body .bottledesign h2{
    height: 140px;
    overflow: hidden;
    position: absolute;
    top: -140px;
    left: 50%;
    transform: translateY(0) translateX(-50%) ;
    -webkit- transform: translateY(0) translateX(-50%);
	}
#tournament #body .bottledesign h2 img{
    height: 140px;
    width: auto;
	}
#tournament #body .bottledesign .inner{
    position: relative;
    background: #22A4B3;
    margin: 0 auto;
    padding: 40px 3.125% 20px;
	width:93.75%;
	}
#tournament #body .bottledesign .inner h3{
    position: absolute;
    top: -80px;
    left: 50%;
    transform: translateY(0) translateX(-50%) ;
    -webkit- transform: translateY(0) translateX(-50%);
	}
#tournament #body .bottledesign .inner .btn{
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    flex-wrap: wrap;
    width: 100%;
	}
#tournament #body .bottledesign .inner .btn li{
    margin-bottom: 20px;
	}
#tournament #body .bottledesign .inner .btn li a{
    background: #FFEF40;
	border-radius:30px;
	-webkit-border-radius:30px;
	-moz-border-radius:30px;
	color:#22A4B3;
    display: block;
	font-size:3.0rem;
	font-family: 'Noto Sans JP', sans-serif !important;
	font-weight:700;
	line-height:90%;
    height: 30px;
    padding: 15px 0;
	text-align:center;
	transform: rotate(0.001deg);
    width: 290px;
	}

#tournament #body #resultWrap{
    margin-top: -120px;
    padding-top: 120px;
	width:100%;
    }
#tournament #body #resultWrap h2{
    text-align: center;
    margin-bottom: 0;
    height: 120px;
    overflow: hidden;
    }
#tournament #body #resultWrap h2 img{
    height: 120px;
    width: auto;
    }
#tournament #body #resultWrap .inner{
	background:#FFF;
	border:3px solid #22A4B3;
	margin:0 auto 100px;
	padding:6%;
	width:80%;
    }
#tournament #body .results .source{
	text-align:right;
	}

/***** #support *****/

#support #body .state {
    margin: 0 0 100px;
    width: 100%;
    }
#support #body .state ul{
    width: 100%;
    }
#support #body .state ul li{
    line-height: 0;
    margin-bottom: 0;
    width: 100%;
    }
#support #body .state ul li img{
    height: auto;
    width: 100%;
    }

#support #body #resultWrap{
    margin-top: -120px;
    padding-top: 120px;
	width:100%;
    }
#support #body #resultWrap h2{
    text-align: center;
    margin-bottom: 0;
    height: 95px;
    overflow: hidden;
    }
#support #body #resultWrap h2 img{
    height: 95px;
    width: auto;
    }
#support #body #resultWrap .inner{
	background:#FFF;
	border:3px solid #22A4B3;
	margin:0 auto 100px;
	padding:6%;
	width:80%;
    }
#support #body #resultWrap nav ul.tab{
    display: flex;
    flex-wrap:wrap;
    justify-content:space-between;
    margin: 0 0 50px;
    padding: 0;
    width: 100%;
	}
#support #body #resultWrap nav ul li{
    margin-bottom: 20px;
    position: relative;
    width: 48%;
	}
#support #body #resultWrap nav ul li a{
    background: #22A4B3;
	color:#FFF;
    display: block;
	font-size:2.5rem;
	font-family: 'Noto Sans JP', sans-serif !important;
	font-weight:normal;
	line-height:120%;
    height: 3.0rem;
    padding: 10px 0;
	text-align:center;
	transform: rotate(0.001deg);
    width: 100%;
	}
#support #body #resultWrap nav ul li a{
    cursor: default;
	transform: rotate(0.001deg);
	}
#support #body #resultWrap nav ul li a.active{
	transition:opacity 0.5s ease;
	opacity:0.5;
	}
#support #body #resultWrap nav ul li span{
	font-size:1.6rem;
    margin-left: 0.5rem;
	}
#support #body #resultWrap .results{
	display:none;
	}
#support #body #resultWrap .results.show{
	display:block;
	}
#support #body .results caption{
	color:#22A4B3;
	font-size:4.0rem;
	font-family: 'Noto Sans JP', sans-serif !important;
	font-weight:bold;
	line-height:150%;
	margin-bottom:20px;
	text-align:center;
	transform: rotate(0.001deg);
	}
#support #body .results .ex,
#support #body .results .source{
	font-size:1.4rem;
	text-align:right;
	}
#support #body .results .ex span{
	background-color:#FFF67F;
	border:1px solid #DDD;
	display:inline-block;
	height:1.6rem;
	margin-right:1.0rem;
	width:3.0rem;
	vertical-align:middle;
	}
#support #body .results .source{
	text-align:right;
	}

    /* 北海道地区予選 */
    #support #body .results#hokkaido tr:nth-child(-n+2){
        background-color:#FFF67F;
        color: #E85298;
        }
    /* 東北地区予選 */
    #support #body .results#tohoku tr:nth-child(-n+2){
        background-color:#FFF67F;
        color: #E85298;
        }
    /* 北信越地区予選 */
    #support #body .results#hokushinetsu tr:nth-child(-n+2){
        background-color:#FFF67F;
        color: #E85298;
        }
    /* 東海地区予選 */
    #support #body .results#tokai tr:nth-child(-n+2){
        background-color:#FFF67F;
        color: #E85298;
        }
    /* 中国四国地区予選 */
    #support #body .results#chugokushikoku tr:nth-child(-n+2){
        background-color:#FFF67F;
        color: #E85298;
        }
    /* 九州地区予選 */
    #support #body .results#kyushu tr:nth-child(-n+2){
        background-color:#FFF67F;
        color: #E85298;
        }

#support #body #seedWrap{
    margin-top: -150px;
    padding-top: 150px;
	width:100%;
    }
#support #body #seedWrap h2{
    text-align: center;
    margin-bottom: 0;
    height: 95px;
    overflow: hidden;
    }
#support #body #seedWrap h2 img{
    height: 95px;
    width: auto;
    }
#support #body #seedWrap .inner{
	background:#FFF;
	border:3px solid #22A4B3;
	margin:0 auto 100px;
	padding:6%;
	width:80%;
    }
#support #body #seedWrap .results{
	display:block;
	}

/***** #goods *****/

#goods #body article.goods {
    border: 1px solid #22A4B3;
    border-left: 0;
    border-right: 0;
    padding: 0;
    margin-bottom: 50px;
    width: 100%;
    }
#goods #body article.goods .inner{
    padding: 0;
    width: 100%;
    }
#goods #body article.goods .inner .title{
    display: flex;
    width: 100%;
    }
#goods #body article.goods .inner .title dt{
    background: #22A4B3;
	position:relative;
    width: 40%;
    }
#goods #body article.goods .inner .title dt img{
    height: auto;
    width: 180px;
	position:absolute;
    top: 50%;
    left: 50%;
    transform: translateY(-50%) translateX(-50%) ;
    -webkit- transform: translateY(-50%) translateX(-50%);
    }
#goods #body article.goods .inner .title dd{
    width: 60%;
    }
#goods #body article.goods .inner .title dd figure img{
    height: 100%;
    object-fit: cover;
    font-family: 'object-fit: cover;';
    width: 100%;
    }
#goods #body article.goods .inner .text{
    background: #FFF;
    min-height: 500px;
    padding: 25px 5%;
    position: relative;
    width: 90%;
    }
#goods #body article.goods .inner .text p{
    background: linear-gradient(transparent 95%, #22A4B3 0%);
    color: #22A4B3;
    display: inline;
	font-size:3.0rem;
	font-family: 'Noto Sans JP', sans-serif !important;
	font-weight:normal;
    line-height: 250%;
    padding-bottom: 10px;
	transform: rotate(0.001deg);
    }
#goods #body article.goods .inner .text hr{
    clear: both;
    margin-bottom: 25px;
    }

    /* グッズ1 */
    #goods #body article#goods01 .text figure{
        float: left;
        padding-bottom: 25px;
        width: 45%;
        }
    #goods #body article#goods01 .text figure img{
        width: 100%;
        }
    #goods #body article#goods01 .text ul{
        float: right;
        padding-top: 50px;
        width: 45%;
        }
    #goods #body article#goods01 .text ul li{
        margin-top: 10px;
        margin-bottom: 0;
        width: 100%;
        }
    #goods #body article#goods01 .text ul li img{
        width: 100%;
        }

    /* グッズ2 */
    #goods #body article#goods02 .text{
        min-height: 450px;
        }
    #goods #body article#goods02 .text figure{
        float: right;
        padding: 80px 0 0 20px;
        width: 240px;
        }
    #goods #body article#goods02 .text figure img{
        width: 100%;
        }

    /* グッズ3 */
    #goods #body article#goods03 .title dd{
        position: relative;
        }
    #goods #body article#goods03 .title dd span{
        color: #FFF;
        font-size: 1.4rem;
        position: absolute;
        bottom: 10px;
        right: 10px;
        text-align: right;
        }
    #goods #body article#goods03 .text{
        min-height: 500px;
        }
    #goods #body article#goods03 .text figure{
        float: right;
        padding: 0 0 0 20px;
        width: 240px;
        }
    #goods #body article#goods03 .text figure img{
        width: 100%;
        }

    /* グッズ4 */
    #goods #body article#goods04 .text{
        min-height: 650px;
        }
    #goods #body article#goods04 .text figure{
        float: left;
        width: 45%;
        }
    #goods #body article#goods04 .text figure img{
        width: 100%;
        }
    #goods #body article#goods04 .text ul{
        float: right;
        width: 45%;
        }
    #goods #body article#goods04 .text ul li{
        padding-top: 80px;
        margin-bottom: 0;
        width: 100%;
        }
    #goods #body article#goods04 .text ul li img{
        width: 100%;
        }

/***** #lastyear *****/

#lastyear #body .tab li {
    margin-bottom: 20px;
    width: 100%;
    }
#lastyear #body .tab li img {
    width: 100%;
    }
    
#lastyear #body ul.infograph {
    margin-bottom: 50px;
    width: 100%;
    }
#lastyear #body ul.infograph li {
    margin-bottom: 20px;
    width: 100%;
    }
#lastyear #body ul.infograph li img {
    width: 100%;
    }

#lastyear #body .bnrWrap {
    width: 100%;
    }
#lastyear #body .bnrWrap img {
    height: auto;
    width: 100%;
    }

/***** #messagebottle *****/

.modalWrapper{
	width:80%;
	}
.modalWrapper img{
    width: 100%;
	max-width:700px;
	}
.modalWrapper dt{
	font-size:3.5rem;
    margin-bottom: 30px;
	}
.closeModal{
    font-size: 5.0rem;
	top:2.0rem;
	right:1.0rem;
	}
#messagebottle #body article h2 {
    line-height: 0;
    margin-bottom: 0;
    overflow: hidden;
    text-align: center;
    width: 100%;
    }
#messagebottle #body article h2 img{
    width: auto;
    }

#messagebottle #body article.bottledesign {
    background: #FFF;
    border-top: 1px solid #22A4B3;
    border-bottom: 1px solid #22A4B3;
    margin-bottom: 50px;
    padding: 25px 0 0;
    width: 100%;
    }
#messagebottle #body article.bottledesign h2,
#messagebottle #body article.bottledesign h2 img{
    height: 180px;
    }
#messagebottle #body article.bottledesign ul{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    width: 100%;
    }
#messagebottle #body article.bottledesign li {
    line-height: 100%;
    margin-bottom: 20px;
    width: 48.5%;
    }
#messagebottle #body article.bottledesign li img{
    width: 100%;
    }
#messagebottle #body article.bottledesign p.btn{
    text-align: center;
    width: 100%;
    }
#messagebottle #body article.bottledesign p.btn img{
    height: auto;
    width: 300px;
    }

#messagebottle #body article.message h2,
#messagebottle #body article.message h2 img{
    height: 120px;
    }
#messagebottle #body #messageWrap {
    display: block;
    min-height: 800px;
    padding: 0;
    width: 100%;
    position: relative;
    }
#messagebottle #body #messageWrap li{
    display: none;
    position: absolute;
    }
#messagebottle #body #messageWrap li img{
    height: auto;
    width: 75%;
    }

#messagebottle #body .mainMessageA,
#messagebottle #body .mainMessageB,
#messagebottle #body .mainMessageC {
    z-index: 100;
    }

#messagebottle #body #mainMessageA-01,
#messagebottle #body #mainMessageA-02,
#messagebottle #body #mainMessageA-03 {
    top: 20px;
    }
#messagebottle #body #mainMessageA-01 {
    left: 20%;
    }
#messagebottle #body #mainMessageA-02 {
    top: 0px;
    left: 20.3%;
    }
#messagebottle #body #mainMessageA-03 {
    left: 20.1%;
    }
#messagebottle #body #mainMessageA-04 {
    top: 40px;
    left: 20.2%;
    }

#messagebottle #body #mainMessageB-01,
#messagebottle #body #mainMessageB-02,
#messagebottle #body #mainMessageB-03 {
    top: 250px;
    }
#messagebottle #body #mainMessageB-01 {
    right: -3%;
    }
#messagebottle #body #mainMessageB-02 {
    top: 280px;
    right: -2.8%;
    }
#messagebottle #body #mainMessageB-03 {
    top: 260px;
    right: -2.6%;
    }

#messagebottle #body #mainMessageC-01,
#messagebottle #body #mainMessageC-02,
#messagebottle #body #mainMessageC-03 {
    bottom: 20px;
    }
#messagebottle #body #mainMessageC-01 {
    left: 20%;
    }
#messagebottle #body #mainMessageC-02 {
    bottom: 0px;
    left: 20.2%;
    }
#messagebottle #body #mainMessageC-03 {
    bottom: 10px;
    left: 20.1%;
    }

#messagebottle #body .subMessageA {
    z-index: 1;
    }
#messagebottle #body .subMessageB {
    z-index: 2;
    }
#messagebottle #body .subMessageC {
    z-index: 3;
    }
#messagebottle #body .subMessageD {
    z-index: 4;
    }
#messagebottle #body .subMessageE {
    z-index: 5;
    }
#messagebottle #body .subMessageF {
    z-index: 6;
    }
#messagebottle #body .subMessageG {
    z-index: 7;
    }
#messagebottle #body .subMessageH {
    z-index: 8;
    }
#messagebottle #body .subMessageI {
    z-index: 9;
    }

#messagebottle #body #subMessageA-01,
#messagebottle #body #subMessageA-02,
#messagebottle #body #subMessageA-03,
#messagebottle #body #subMessageA-04 {
    left: 0px;
    top: 50px;
    }
#messagebottle #body #subMessageA-01 {
    top: 0px;
    }
#messagebottle #body #subMessageA-02 {
    left: -3%;
    }
#messagebottle #body #subMessageA-03 {
    top: 80px;
    }
#messagebottle #body #subMessageA-04 {
    }

#messagebottle #body #subMessageB-01,
#messagebottle #body #subMessageB-02,
#messagebottle #body #subMessageB-03,
#messagebottle #body #subMessageB-04 {
    right: -8%;
    top: 0px;
    }
#messagebottle #body #subMessageB-01 {
    right: -8%;
    }
#messagebottle #body #subMessageB-02 {
    right: -5%;
    top: 10px;
    }
#messagebottle #body #subMessageB-03 {
    right: -5%;
    }
#messagebottle #body #subMessageB-04 {
    top: 30px;
    }

#messagebottle #body #subMessageC-01,
#messagebottle #body #subMessageC-02,
#messagebottle #body #subMessageC-03,
#messagebottle #body #subMessageC-04 {
    right: -5%;
    top: 150px;
    }
#messagebottle #body #subMessageC-01 {
    }
#messagebottle #body #subMessageC-02 {
    right: -3%;
    top: 180px;
    }
#messagebottle #body #subMessageC-03 {
    right: -3%;
    top: 140px;
    }
#messagebottle #body #subMessageC-04 {
    top: 160px;
    }

#messagebottle #body #subMessageD-01,
#messagebottle #body #subMessageD-02,
#messagebottle #body #subMessageD-03,
#messagebottle #body #subMessageD-04 {
    left: 3%;
    top: 200px;
    }
#messagebottle #body #subMessageD-01 {
    }
#messagebottle #body #subMessageD-02 {
    left: 5%;
    }
#messagebottle #body #subMessageD-03 {
    left: 8%;
    top: 220px;
    }
#messagebottle #body #subMessageD-04 {
    left: 0;
    }

#messagebottle #body #subMessageE-01,
#messagebottle #body #subMessageE-02,
#messagebottle #body #subMessageE-03,
#messagebottle #body #subMessageE-04 {
    left: 0;
    top: 400px;
    }
#messagebottle #body #subMessageE-01 {
    left: 5%;
    top: 350px;
    }
#messagebottle #body #subMessageE-02 {
    top: 450px;
    }
#messagebottle #body #subMessageE-03 {
    left: 3%;
    }
#messagebottle #body #subMessageE-04 {
    top: 420px;
    }

#messagebottle #body #subMessageF-01,
#messagebottle #body #subMessageF-02,
#messagebottle #body #subMessageF-03 {
    right: -7%;
    top: 300px;
    }
#messagebottle #body #subMessageF-01 {
    }
#messagebottle #body #subMessageF-02 {
    right: -10%;
    top: 350px;
    }
#messagebottle #body #subMessageF-03 {
    right: -9%;
    top: 350px;
    }

#messagebottle #body #subMessageG-01,
#messagebottle #body #subMessageG-02,
#messagebottle #body #subMessageG-03 {
    right: -7%;
    bottom: 120px;
    }
#messagebottle #body #subMessageG-01 {
    right: -6%;
    }
#messagebottle #body #subMessageG-02 {
    bottom: 160px;
    }
#messagebottle #body #subMessageG-03 {
    bottom: 140px;
    }

#messagebottle #body #subMessageH-01,
#messagebottle #body #subMessageH-02,
#messagebottle #body #subMessageH-03 {
    left: 0;
    bottom: 0px;
    }
#messagebottle #body #subMessageH-01 {
    }
#messagebottle #body #subMessageH-02 {
    bottom: 50px;
    }
#messagebottle #body #subMessageH-03 {
    left: 3%;
    }

#messagebottle #body #subMessageI-01,
#messagebottle #body #subMessageI-02,
#messagebottle #body #subMessageI-03 {
    right: -7%;
    bottom: 0px;
    }
#messagebottle #body #subMessageI-01 {
    }
#messagebottle #body #subMessageI-02 {
    right: -3%;
    }
#messagebottle #body #subMessageI-03 {
    right: -9%;
    bottom: 30px;
    }



/*******************
footer styles
********************/

footer{
	background:#22A4B3;
	margin-top:50px;
	text-align:center;
	}
footer .inner{
	font-size:1.8rem;
	height:50px;
	padding:50px 0 30px;
	position:relative;
	}

footer .inner nav{
	position:relative;
	margin-bottom:50px;
	text-align:center;
	}
footer .inner nav ul{
	float:left;
	margin-bottom:30px;
	position:relative;
	left:50%;
	}
footer .inner nav ul li{
	font-size:2.0rem;
	float:left;
	line-height:180%;
	margin-right:30px;
	position:relative;
	left:-50%;
	}
footer .inner nav ul li:nth-child(4n){
	clear:both;
	}
footer .inner nav ul li:last-child{
	margin-right:0;
	}
footer .inner nav ul li a{
	color:#FFF;
	}

footer .inner address{
	color:#FFF;
	font-style:normal;
	}

footer .inner #backtotop{
	position:fixed;
	bottom:0;
	right:3.125%;
	z-index:100000;
	}





}





/*******************
clearfix styles
********************/

/* For modern browsers */
.clearfix:before,
.inner:before,
.contWrap:before,
.contWrap .article:before,
.articleWrap:before,
.logoWrap:before,
.text:before,
nav.tab:before,
ul.infograph:before,
header:before,
section:before,
article:before,
footer:before,

.clearfix:after,
.inner:after,
.contWrap:after,
.contWrap .article:after,
.articleWrap:after,
.logoWrap:after,
.text:after,
nav.tab:after,
ul.infograph:after,
header:after,
section:after,
article:after,
footer:after
{
	content:"";
	display:table;
}

.clearfix:after,
.inner:after,
.contWrap:after,
.contWrap .article:after,
.articleWrap:after,
.logoWrap:after,
.text:after,
nav.tab:after,
ul.infograph:after,
header:after,
section:after,
article:after,
footer:after
{
	clear:both;
}

/* For IE 6/7 (trigger hasLayout) */
.clearfix,
.inner,
.contWrap,
.contWrap .article,
.articleWrap,
.logoWrap,
.text,
nav.tab,
ul.infograph,
header,
section,
article,
footer
{
	zoom:1;
}





/********************************************

HASEKO Corporation. © ALL RIGHTS RESERVED.

********************************************/