/* http://meyerweb.com/eric/tools/css/reset/ 
	 v2.0 | 20110126
	 License: none (public domain)
*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  line-height: 1.6;
  font-family: sans-serif;
  /*vertical-align: baseline;*/
}

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
  display: block;
}

body {
  line-height: 1;
}

ol, ul {
  list-style: none;
}

blockquote, q {
  quotes: none;
}

blockquote:before, blockquote:after,
q:before, q:after {
  content: '';
  content: none;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
  width: 100%;
  padding-bottom: 30px;
  background-color: #fff;
  border-top: #dad0ac 1px solid;
  border-left: #dad0ac 1px solid;
  color: #400e11;
}

table th, table td {
  border-right: #dad0ac 1px solid;
  border-bottom: #dad0ac 1px solid;
  padding: 15px 8px;
  font-size: 14px;
}

table th {
  font-weight: bold;
}

table thead {
  white-space: nowrap;
}

table thead th {
  text-align: left;
  background-color: #f6f7de;
  color: #5c564e;
  padding: 5px 10px;
  font-size: 16px;
}

table tbody th {
  background-color: #fffff7;
  text-align: center;
  white-space: nowrap;
  padding: 3px 5px;
}

table tbody td {
  text-align: left;
}

table .thumb {
  background-color: #fff;
  width: 100px;
  text-align: center;
}


/* common
----------------------------------------------------------*/

* {
  -webkit-font-smoothing: antialiased;
}

html {
  color: #000000;
  min-width: 960px;
}

p {
  line-height: 1.7;
}

img {
  vertical-align: bottom;
}

a {
  color: #ffffff;
  text-decoration: underline;
}

a:hover {
  text-decoration: none;
}

.both {
	clear: both;
}

.mb10 {
	margin-bottom: 10px;
}
.mb20 {
	margin-bottom: 20px;
}
.mb30 {
	margin-bottom: 30px;
}

.arrow {
	background-image: url(../img/arrow.png);
	background-repeat: no-repeat;
	background-position: left 2px;
	padding-left: 20px;
}

.inner {
  width: 960px;
  margin: 0 auto;
  position: relative;
}

.fixed {
  position: fixed !important;
  top: 0px !important;
}



#gungho {
  width: 100%;
  height: 31px;
  background: #fff;
  border-bottom: 4px solid #ccc;
}

#gungho .inner {
  width: 1000px;
  height: 31px;
  margin: 0 auto;
  position: relative;
}

#gungho #ragnarok {
  position: absolute;
  top: 0;
  left: 0;
}

#gungho #roInfo {
  position: absolute;
  overflow: hidden;
  top: 0;
  right: 0;
  line-height: 31px;
}

#gungho #roInfo li {
  float: left;
  margin-right: 15px;
}

#gungho #roInfo li a {
  font-size: 12px;
  color: #555;
  text-decoration: underline;
}

#gungho #roInfo li a:hover {
  text-decoration: none;
}

#sns {
  position: absolute;
  top: 24px;
  right: -25px;
  line-height: 48px;
  text-align: right;
  text-indent: initial;
}

#sns li {
  display: inline-block;
}

#pagetop {
  position: absolute;
  bottom: -20px;
  right: 10%;
}

#pagetop:hover {
  bottom: -8px;
}


/* footer
----------------------------------------------------------*/
#footer {
  background: #292424;
  color: #fff;
  min-height: 60px;
  text-align: center;
  padding-top: 50px;
}
#footer h2 {
	margin-bottom: 20px;
}
#footer #moreBtn {
	display: block;
	color: #909495;
	font-size: 14px;
	text-decoration: underline;
	margin-bottom: 40px;
}
#footer #moreBtn:hover {
	text-decoration: none;
}
#footer .col3 {
	overflow: hidden;
	width: 900px;
	margin: 0 auto 30px;
}
#footer .col3 .col {
	width: 33.3333%;
	float: left;
}
#footer .col3 .col img {
	margin-bottom: 10px;
}
#footer .col3 .col:nth-child(2) img,
#footer .col3 .col:nth-child(3) img {
	padding: 20px 0;
}
#footer .col3 .col p {
	text-align: left;
	color: #a79389;
	width: 90%;
	margin: 0 auto;
	font-size: 14px;
}
#footer .sns {
	width: 860px;
	margin: 0 auto;
	text-align: center;
}
#footer .sns li {
	display: inline-block;
	width: 300px;
	margin: 0 10px 30px;
}
#footer #credit {
	font-size: 10px;
	color: #8a8a8a;
	padding-bottom: 50px;
}



/* header
----------------------------------------------------------*/

#header {
	height: 578px;
	border-bottom: 3px solid #1B1918;
	background-image: url(../img/main_bg.jpg);
	background-repeat: no-repeat;
	background-position: center top;
	background-size: cover;
	z-index: 50;
	background-color: #ebb94f;
}

#main_bg {
	height: 578px;
	background-repeat: no-repeat;
	background-position: center top;
	background-size: cover;
	z-index: 100;
}
#chara_bg {
	height: 578px;
	background-image: url(../img/chara_bg.png);
	background-repeat: no-repeat;
	background-position: center top;
	z-index: 150;
}

#mainTitle {
	width: 580px;
	margin-left: auto;
	margin-right: auto;
}
#mainDate {
	width: 547px;
	margin-left: auto;
	margin-right: auto;
}

/* menu
----------------------------------------------------------*/


#gnav {
	height: 59px;
	background: url(../img/menu_bg.gif) repeat-x transparent;
	position: absolute;
	width: 100%;
	z-index: 10000;
}
#gnav .inner {
	width: 950px;
	height: 59px;
	margin: 0 auto;
	position: relative;
}

#gnav .inner li {
	float: left;
}
#gnav .inner li a {
	margin-top: 6px;
	display: block;
	margin-right: 1px;
	text-indent: -9999px;
	height: 50px;
	width: 189px;
}

#gnav .inner #menu01 a {
	background-image: url(../img/menu_1.jpg);
	background-repeat: no-repeat;
	background-position: 0px 0px;
}
#gnav .inner #menu02 a {
	background-image: url(../img/menu_2.jpg);
	background-repeat: no-repeat;
	background-position: 0px 0px;
}
#gnav .inner #menu03 a {
	background-image: url(../img/menu_3.jpg);
	background-repeat: no-repeat;
	background-position: 0px 0px;
}
#gnav .inner #menu04 a {
	background-image: url(../img/menu_4.jpg);
	background-repeat: no-repeat;
	background-position: 0px 0px;
}
#gnav .inner #menu05 a {
	background-image: url(../img/menu_5.jpg);
	background-repeat: no-repeat;
	background-position: 0px 0px;
}

#gnav .inner #menu01 a:hover,
#gnav .inner #menu02 a:hover,
#gnav .inner #menu03 a:hover,
#gnav .inner #menu04 a:hover,
#gnav .inner #menu05 a:hover {
	background-position: 0px -50px;
}

#gnav .inner #pop {
	position: absolute;
	top: -110px;
	left: 740px;
}

.noimg {
	display: none;
}


/* Slider
----------------------------------------------------------*/

#slider {
  background: url(../img/slide_bg.jpg) repeat-x center bottom #5f5846;
  height: 354px;
  padding-top: 58px;
}

#slider .inner {
	width: 996px;
  	background-repeat: no-repeat;
	background-position: center top no-repeat;
	background-image: url(../img/slide_board.png);
}


/* content
----------------------------------------------------------*/

#content {
	background-color: #605A49;
	background-image: url(../img/content_bg.jpg);
	background-position: center top;
	background-repeat: repeat;
}
#content .inner {
	width: 960px;
	margin-left: auto;
	margin-right: auto;
}
	
#shirotora {
	height: 450px;
	background-image: url(../img/shirotora_bg.jpg);
	background-repeat: repeat-x;
	background-position: center top;
	position: relative;
}
#shirotoraImg {
	position: absolute;
	top: -100px;
	left: 0;
	right: 0;
	bottom: 0;
	margin: auto;
	width: 1040px;
	height: 450px;
}

.paperTop {
	background-image: url(../img/paper_top.png);
	background-repeat: no-repeat;
	background-position: center 70px;
}

.paperBtm {
	background-image: url(../img/paper_btm.png);
	background-repeat: no-repeat;
	background-position: center bottom;
	padding-bottom: 150px;
}

.paperMid {
	background-image: url(../img/paper_mid.png);
	background-repeat: repeat-y;
	background-position: center top;
	margin-top: 44px;
}



.inbox {
	width: 820px;
	margin-left: auto;
	margin-right: auto;
}

#about h2,
#camp h2,
#map h2,
#data h2,
#bonus h2 {
	padding-top: 50px;
	text-align: center;
}


#about,
#camp,
#map,
#data,
#bonus {
	padding-top: 30px;
	padding-bottom: 30px;
}


#aboutUp {
	background-image: url(../img/line.png);
	background-repeat: no-repeat;
	background-position: center bottom;
	padding-bottom: 30px;
	margin-bottom: 30px;
	font-size: 20px;
}
#aboutUpBG {
	background-image: url(../img/about_1.png);
	background-repeat: no-repeat;
	background-position: right top;
	padding-top: 30px;
	height: 270px;
}

#aboutUpBG p {
	width: 420px;
	padding-left: 20px;
	margin-bottom: 20px;
}

#aboutDownBG {
	background-image: url(../img/about_2.png);
	background-repeat: no-repeat;
	background-position: center top;
	padding-top: 30px;
	height: 220px;
	font-size: 18px;
}

#aboutDownBG p {
	width: 460px;
	margin-left: 150px;
	margin-right: auto;
	margin-bottom: 20px;
}

.subTxt {
	color: #a12110;
	font-size: 12px;
}
.boldTxt {
	font-size: 24px;
	font-weight: bold;
}
.exsampleTxt {
	color: #c4aaaa;
}


#camp .boldTxt {
	font-size: 20px;
	font-weight: bold;
}

#camp #subNavi {
	margin-bottom: -40px;
}

#camp #subNavi li {
	float: left;
	width: 124px;
	height: 110px;
	margin-left: 9px;
	margin-right: 9px;
}
#camp #subNavi #navi1 a {
	display: block;
	width: 124px;
	height: 110px;
	background-image: url(../img/navi_1.png);
	background-repeat: no-repeat;
	background-position: 0px 0px;
	text-indent: -9999px;
}

#camp #subNavi #navi2 a {
	display: block;
	width: 124px;
	height: 110px;
	background-image: url(../img/navi_2.png);
	background-repeat: no-repeat;
	background-position: 0px 0px;
	text-indent: -9999px;
}

#camp #subNavi #navi3 a {
	display: block;
	width: 124px;
	height: 110px;
	background-image: url(../img/navi_3.png);
	background-repeat: no-repeat;
	background-position: 0px 0px;
	text-indent: -9999px;
}

#camp #subNavi #navi4 a {
	display: block;
	width: 124px;
	height: 110px;
	background-image: url(../img/navi_4.png);
	background-repeat: no-repeat;
	background-position: 0px 0px;
	text-indent: -9999px;
}

#camp #subNavi #navi5 a {
	display: block;
	width: 124px;
	height: 110px;
	background-image: url(../img/navi_5.png);
	background-repeat: no-repeat;
	background-position: 0px 0px;
	text-indent: -9999px;
}

#camp #subNavi #navi6 a {
	display: block;
	width: 124px;
	height: 110px;
	background-image: url(../img/navi_6.png);
	background-repeat: no-repeat;
	background-position: 0px 0px;
	text-indent: -9999px;
}

#camp #subNavi #navi1 a:hover,
#camp #subNavi #navi2 a:hover,
#camp #subNavi #navi3 a:hover,
#camp #subNavi #navi4 a:hover,
#camp #subNavi #navi5 a:hover,
#camp #subNavi #navi6 a:hover {
	background-position: 0px -110px;
}

#camp .inbox {
	width: 860px;
	margin-left: auto;
	margin-right: auto;
}

#camp .programTop {
	background-image:url(../img/box_top.png);
	background-repeat: no-repeat;
	background-position: center top;
	padding-top: 40px;
}
#camp .programBtm {
	background-image:url(../img/box_btm.png);
	background-repeat: no-repeat;
	background-position: center bottom;
	padding-bottom: 40px;
}
#camp .programMid {
	background-image:url(../img/box_mid.png);
	background-position: center top;
	background-repeat: repeat-y;
	color: #FFFFFF;	
}

#camp .subTxt {
	color: #e39702;
	font-size: 12px;
}
#camp .subTxt a {
	color: #e39702;
}
#camp .programInbox {
	width: 760px;
	margin: 0 auto;
}
#camp table td.specialBounus {
	color: #D43333;
	font-weight: bold;
}
#camp table {
	background-color: #492f2f;
	color: #de8e8e;
	border-top: #351717 1px solid;
	border-left: #351717 1px solid;
}
#camp table th {
	background-color: #351717;
	color: #b94e4e;
	border-right: #351717 1px solid;
	border-bottom: #351717 1px solid;
}
#camp table td {
	border-right: #351717 1px solid;
	border-bottom: #351717 1px solid;
}
#camp table span {
	color: #ff944c;
}

#camp table a {
	color: #de8e8e;
	text-decoration: underline;
}
#camp table a:hover {
  text-decoration: none;
}

td {
	word-break: break-all;
}

#camp #program1,
#camp #program2,
#camp #program3,
#camp #program4,
#camp #program5,
#camp #program6 {
	position: relative;
	padding-top: 100px;
	margin-bottom: -30px;
}

#camp #program1 h3,
#camp #program2 h3,
#camp #program3 h3,
#camp #program4 h3,
#camp #program5 h3,
#camp #program6 h3 {
	position: absolute;
	top: 70px;
	left: -10px;
	height: 50px;
}

#camp #program4 #item {
	position: absolute;
	top: 570px;
	left: 550px;
	height: 53px;
	width: 53px;
}

#camp #program4 img {
	vertical-align: middle;
}

#camp #program4 h5 {
	background: url(../img/subTitle.png) top left no-repeat;
	font-size: 20px;
	min-height: 52px;
}
#camp #program4 #plusBounus h4 {
	position: relative;
}
#camp #program4 #plusBounus h4 .subTxt {
	position: absolute;
	top: 110px;
	left: 140px;
}
#camp #program4 #bukiService {
	position: relative;
}
#camp #program4 #bukiService .programTxt {
	width: 650px;
	margin: 0;
	position: relative;
	top: -25px;
}
#camp #program4 #bukiService .programImg {
	position: absolute;
	right: -137px;
	top: -70px;
}
#camp #program6 {
	margin-bottom: 0;
}

#camp .programTxt {
	float: left;
	width: 520px;
	margin-top: 80px;
	margin-left: 34px;
	margin-right: 20px;
	
}

#camp .programImg {
	float: left;
	width: 250px;
	margin-top: 80px;
}
#camp .programInbox h4 {
	margin-left: -50px;
}
#camp .attention h4,
#camp .attention h6 {
	background: url(../img/fire_icon.png) top left no-repeat;
	padding: 3px 0 0 30px;
	font-size: 16px;
	font-weight: bold;
	margin-left: 0;
 	margin-bottom: 10px;
}
#camp .attention li {
	font-size: 14px;
	text-indent: -1em;
	margin-left: 1em;
}


#map .paperTop {
	background-image: url(../img/paper_top2.png);
	background-repeat: no-repeat;
	background-position: center 70px;
}
#map .paperMid {
	background-image: url(../img/paper_mid.png);
	background-repeat: repeat-y;
	background-position: center top;
	margin-top: 0px;
}

#mapImg {
	background-image: url(../img/map.png);
	background-repeat: no-repeat;
	background-position: center 0;
	width: 932px;
	height: 1450px;
	margin-left: auto;
	margin-right: auto;
	margin-top: -10px;
	position: relative;
}

#mapImg dl {
	text-indent: -9999px;
}

#mapImg #mapBtn {
	width: 342px;
	height: 76px;
	position: absolute;
	top: 1337px;
	left: 495px;
}
#mapImg #mapBtn a {
	width: 342px;
	height: 76px;
	display: block;
	background-image: url(../img/map_btn.png);
	background-repeat: no-repeat;
	background-position: 0px 0px;
	text-indent: -9999px;
}
#mapImg #mapBtn a:hover {
	background-position: 0px -76px;
}

#bonus {
	color: #5c564e;
	font-size: 13px;
}

#bonus p {
	margin-bottom: 10px;
}

#bonus .inbox {
	width: 700px;
	margin-left: auto;
	margin-right: auto;
}

#bonus ul {
	margin-left: 10px;
}

#bonus .kome {
	font-size: 12px;
	margin-left: 12px;
}

#bonus .mark {
	background-image: url(../img/mark.png);
	background-repeat: no-repeat;
	background-position: left center;
	padding-left: 20px;
	margin-bottom: 0;
}

#bonusBtn {
	width: 445px;
	margin-left: auto;
	margin-right: auto;
}

#bonusBtn a {
	width: 445px;
	height: 66px;
	display: block;
	background-image: url(../img/bonus_btn.png);
	background-repeat: no-repeat;
	background-position: 0px 0px;
	text-indent: -9999px;
}
#bonusBtn a:hover {
	background-position: 0px -66px;
}