@charset "UTF-8";
/*------------------------------------------------------------
	layout
------------------------------------------------------------*/

html {
	height: 100%;
	min-height: 768px;
	overflow-y: scroll;
}
html.wiiu-mode{
	min-height: 728px;
}
.wiiu-mode .footer_section{
	bottom: -42px;
}

body {
	position: relative;
	height: 100%;
}

.contents_section{
	background-color: #917c52;
}


/*------------------------------------------------------------
	title_section
------------------------------------------------------------*/
.title {
	position: absolute;
	top: -40px;
    left: 50%;
    margin-left: -270px;
    -webkit-transform-origin: 50% 0%;
    transform-origin: 50% 0%;
    z-index: 100;
}


/*------------------------------------------------------------
	sound_section
------------------------------------------------------------*/
.sound_section {
	position: absolute;
	top: 0;
	left: 0;
	width: 159px;
	height: 190px;
	z-index: 1000;
	background: url(../img/top/sound_bg.png) 0 0 no-repeat;
	transition: all 500ms ease-out;
	-webkit-transition: all 500ms ease-out;
	z-index: 9001;
}
.sound_section.away {
	transform: translate3d(-160px, -140px, 0);
	-webkit-transform: translate3d(-160px, -140px, 0);
}
.sound_title {
	padding-top: 61px;
    padding-left: 15px;
    line-height: 0;
}
.sound_btn_body {
    padding-top: 3px;
    padding-left: 13px;
}
.sound_btn {
	float: left;
	width: 45px;
	height: 27px;
    margin-right: 1px;
}
.sound_btn a {
	display: block;
	height: 100%;
	overflow: hidden;
	background-position: 0 0;
	background-repeat: no-repeat;
	text-indent: -9999px;
}
.sound_btn:first-child a {
	background-image: url(../img/top/sound_btn_on.png);
}
.sound_btn:last-child a {
	background-image: url(../img/top/sound_btn_off.png);
}
.sound_btn.active:first-child a {
	background-image: url(../img/top/sound_btn_on_active.png);
}
.sound_btn.active:last-child a {
	background-image: url(../img/top/sound_btn_off_active.png);
}

.tablet-mode .sound_title,
.tablet-mode .sound_btn_body {
	display: none;
}


/*------------------------------------------------------------
	section1
------------------------------------------------------------*/

.contents_section {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	min-width: 960px;
}
.popup_wrapper {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 900;
	overflow: hidden;
}
.popup_body {
	position: absolute;
	width: 631px;
	height: 347px;
	left: 33px;
	right: 0;
	top: 0;
	bottom: 0;
	margin: auto;
	opacity: 0;
	transform-origin: 50% 90%;
	-webkit-transform-origin: 50% 90%;
}
.popup_txt {
  width: 631px;
	height: 347px;
  background: url(../img/map/popup_pc.png);
}
.touchevents .popup_txt {
	background: url(../img/map/popup_tablet.png);
}
.wiiu-mode .popup_txt {
  background: url(../img/map/popup_wiiu.png);
}
.popup_close {
  position: absolute;
  top: -20px;
  right: 21px;
}

.character_wrapper {
  width: 960px;
  height: 242px;
  position: absolute;
  left: 50%;
  bottom: 175px;
  margin-left: -495px;
  z-index: 800;
  overflow: hidden;
  display: none;
}
.character_wrapper .left_wrapper {
  width: 480px;
  height: 100%;
  float: left;
  position: relative;
}
.character_wrapper .right_wrapper {
  width: 480px;
  height: 100%;
  float: right;
  position: relative;
}
.character_wrapper .left_wrapper .character {
  position: absolute;
  top: 50px;
  left: 0;
}
.character_wrapper .left_wrapper .character_comment {
  position: absolute;
  top: 20px;
  left: 160px;
}
.character_wrapper .left_wrapper .character li {
  position: absolute;
  top: 0;
  left: 0;
}
.character_wrapper .left_wrapper .character_comment li {
  position: absolute;
  top: 0;
  left: 0;
  transform-origin: 0% 100%;
  -webkit-transform-origin: 0% 100%;
}
.character_wrapper .right_wrapper .character {
  position: absolute;
  top: 50px;
  right: 0;
}
.character_wrapper .right_wrapper .character_comment {
  position: absolute;
  top: 20px;
  right: 160px;
}
.character_wrapper .right_wrapper .character li {
  position: absolute;
  top: 0;
  right: 0;
}
.character_wrapper .right_wrapper .character_comment li {
  position: absolute;
  top: 0;
  right: 0;
  transform-origin: 100% 100%;
  -webkit-transform-origin: 100% 100%;
}

.map_wrapper {
	box-sizing: border-box;
	position: relative;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	padding-top: 40px;
	padding-bottom: 190px;
}

.map_wrapper #stage {
	position: relative;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	overflow: hidden;
}

.map_wrapper #stage .map {
	position: absolute;
	top: 0;
	left: 0;
	width: 4800px;
	height: 2700px;
	transform-origin: 0 0;
	-webkit-transform-origin: 0 0;
}

.map_wrapper #stage .map .bg {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	cursor: move;
}
.map_wrapper #stage .map .bg img {
	width: 100%;
	height: auto;
}

.map_wrapper #stage .map .clickable {
	position: absolute;
	width: 48px;
	height: 44px;
	margin: -22px 0 0 -24px;
	transition: transform 500ms cubic-bezier(0.455, 0.03,  0.515, 0.955);
	-webkit-transition: -webkit-transform 500ms cubic-bezier(0.455, 0.03,  0.515, 0.955);
}


/* icon */
.map_wrapper #stage .map .clickable .icon {
	display: block;
	width: 48px;
	height: 44px;
	background: url(../img/map/ico_active.png) 0 0 no-repeat;
	transform: translate3d(0,0,0);
	-webkit-transform: translate3d(0,0,0);
}
.map_wrapper #stage .map .disabled {
	cursor: default;
	pointer-events: none;
}
.map_wrapper #stage .map .disabled .icon {
	background: url(../img/map/ico_disabled.png) 0 0 no-repeat;
}
.map_wrapper #stage .map .disabled .balloon {
	display: none;
}
.map_wrapper #stage .map .visited .icon {
	background: url(../img/map/ico_visited.png) 0 0 no-repeat;
}
.map_wrapper #stage .map .hidden {
	visibility: visible;
}
.map_wrapper #stage .map .hidden .icon {
	background: none;
	/*background:#ffffff;*/
}


/* star */
.map_wrapper #stage .map .clickable .stars {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	transform: translate3d(0,0,0);
	-webkit-transform: translate3d(0,0,0);
}
.map_wrapper #stage .map .clickable .stars img {
	position: absolute;
	opacity: 0;
	transform: translate3d(0,0,0);
	-webkit-transform: translate3d(0,0,0);
}


/* balloon */
.map_wrapper #stage .map .clickable .balloon {
	position: absolute;
	bottom: 30px;
	left: -58px;
	opacity: 0;
	z-index: 1;
	transform: scale(0.1);
	transition: opacity 200ms ease, transform 200ms ease;
	transform-origin: 50% 100%;
	-webkit-transform: scale(0.1);
	-webkit-transition: opacity 200ms ease, -webkit-transform 200ms ease;
	-webkit-transform-origin: 50% 100%;
}
.map_wrapper #stage .map .clickable:hover {
	z-index: 10;
}
.map_wrapper #stage .map .clickable:hover .balloon {
	opacity: 1;
	transform: scale(1);
	transition: opacity 100ms ease, transform 400ms cubic-bezier(0.175, 0.885, 0.32,  1.275);
	-webkit-transform: scale(1);
	-webkit-transition: opacity 100ms ease, -webkit-transform 400ms cubic-bezier(0.175, 0.885, 0.32,  1.275);
}
.map_wrapper #stage.zoom_1 .map .clickable:hover .balloon {
	transform: scale(2.5);
	-webkit-transform: scale(2.5);
}
.map_wrapper #stage.zoom_2 .map .clickable:hover .balloon {
	transform: scale(2);
	-webkit-transform: scale(2);
}
.map_wrapper #stage.zoom_3 .map .clickable:hover .balloon {
	transform: scale(1.333);
	-webkit-transform: scale(1.333);
}
.map_wrapper #stage.zoom_4 .map .clickable:hover .balloon {
	transform: scale(1);
	-webkit-transform: scale(1);
}


.map_wrapper #stage .map #tn_01 {
	top: 45.05%;
	left: 58.08%;
}
.map_wrapper #stage .map #tn_02 {
	top: 44%;
	left: 60%;
}
.map_wrapper #stage .map #tn_03 {
	top: 41%;
	left: 58.7%;
}

.map_wrapper #stage .map #jk_01 {
	top: 32.35%;
	left: 51.81%;
}
.map_wrapper #stage .map #jk_02 {
	top: 28.4%;
	left: 53.5%;
}
.map_wrapper #stage .map #jk_03 {
	top: 32%;
	left: 50%;
}

.map_wrapper #stage .map #r1_01 {
	top: 38.65%;
	left: 61.21%;
}
.map_wrapper #stage .map #r1_02 {
	top: 38.65%;
	left: 62.81%;
}
.map_wrapper #stage .map #r1_03 {
	top: 37.65%;
	left: 59.71%;
}

.map_wrapper #stage .map #r2_01 {
	top: 32.35%;
	left: 61.21%;
}
.map_wrapper #stage .map #r2_02 {
	top: 31.1%;
	left: 62.61%;
}
.map_wrapper #stage .map #r2_03 {
	top: 32%;
	left: 57.31%;
}

.map_wrapper #stage .map #rb_01 {
	top: 32.35%;
	left: 67.21%;
}
.map_wrapper #stage .map #rb_02 {
	top: 28.7%;
	left: 66.21%;
}
.map_wrapper #stage .map #rb_03 {
	top: 26%;
	left: 68.2%;
}
.map_wrapper #stage .map #rb_04 {
	top: 32.9%;
	left: 65.21%;
}

.map_wrapper #stage .map #b1_01 {
	top: 45.05%;
	left: 54.81%;
}
.map_wrapper #stage .map #b1_02 {
	top: 43.5%;
	left: 53.21%;
}
.map_wrapper #stage .map #b1_03 {
	top: 40.5%;
	left: 54.41%;
}
.map_wrapper #stage .map #b1_04 {
	top: 38.25%;
	left: 52.31%;
}

.map_wrapper #stage .map #b2_01 {
	top: 45.05%;
	left: 51.81%;
}
.map_wrapper #stage .map #b2_02 {
	top: 42.9%;
	left: 49.81%;
}
.map_wrapper #stage .map #b2_03 {
	top: 47.3%;
	left: 48.41%;
}
.map_wrapper #stage .map #b2_04 {
	top: 47.55%;
	left: 45.81%;
}

.map_wrapper #stage .map #b3_01 {
	top: 64.05%;
	left: 52.81%;
}
.map_wrapper #stage .map #b3_02 {
	top: 63.5%;
	left: 55.81%;
}
.map_wrapper #stage .map #b3_03 {
	top: 62.7%;
	left: 50.21%;
}
.map_wrapper #stage .map #b3_04 {
	top: 66.95%;
	left: 54.21%;
}

.map_wrapper #stage .map #b4_01 {
	top: 73.55%;
	left: 41.91%;
}
.map_wrapper #stage .map #b4_02 {
	top: 70.97%;
	left: 42.21%;
}
.map_wrapper #stage .map #b4_03 {
	top: 75.8%;
	left: 43.91%;
}

.map_wrapper #stage .map #bb_01 {
	top: 73.55%;
	left: 38.61%;
}
.map_wrapper #stage .map #bb_02 {
	top: 69.97%;
	left: 36.21%;
}
.map_wrapper #stage .map #bb_03 {
	top: 73.5%;
	left: 36.91%;
}

.map_wrapper #stage .map #y1_01 {
	top: 51.45%;
	left: 59.31%;
}
.map_wrapper #stage .map #y1_02 {
	top: 46.27%;
	left: 62.61%;
}
.map_wrapper #stage .map #y1_03 {
	top: 49.3%;
	left: 61.21%;
}

.map_wrapper #stage .map #y2_01 {
	top: 57.75%;
	left: 59.31%;
}
.map_wrapper #stage .map #y2_02 {
	top: 55.37%;
	left: 57.11%;
}
.map_wrapper #stage .map #y2_03 {
	top: 53.7%;
	left: 60.71%;
}

.map_wrapper #stage .map #y3_01 {
	top: 57.75%;
	left: 67.31%;
}
.map_wrapper #stage .map #y3_02 {
	top: 56.97%;
	left: 64.51%;
}
.map_wrapper #stage .map #y3_03 {
	top: 54.5%;
	left: 67.11%;
}

.map_wrapper #stage .map #y4_01 {
	top: 54.35%;
	left: 75.51%;
}
.map_wrapper #stage .map #y4_02 {
	top: 52.67%;
	left: 79.11%;
}
.map_wrapper #stage .map #y4_03 {
	top: 47.6%;
	left: 79.41%;
}
.map_wrapper #stage .map #y4_04 {
	top: 53.5%;
	left: 73.71%;
}

.map_wrapper #stage .map #yb_01 {
	top: 48.15%;
	left: 70.71%;
}
.map_wrapper #stage .map #yb_02 {
	top: 50.37%;
	left: 72.61%;
}
.map_wrapper #stage .map #yb_03 {
	top: 45.8%;
	left: 74.31%;
}

.map_wrapper #stage .map #v1_01 {
	top: 57.75%;
	left: 49.41%;
}
.map_wrapper #stage .map #v1_02 {
	top: 58.57%;
	left: 47.51%;
}
.map_wrapper #stage .map #v1_03 {
	top: 54.5%;
	left: 49.11%;
}
.map_wrapper #stage .map #v1_04 {
	top: 55.5%;
	left: 51.81%;
}
.map_wrapper #stage .map #v1_05 {
	top: 57.5%;
	left: 53.11%;
}

.map_wrapper #stage .map #v2_01 {
	top: 38.75%;
	left: 44.11%;
}
.map_wrapper #stage .map #v2_02 {
	top: 33.37%;
	left: 39.21%;
}
.map_wrapper #stage .map #v2_03 {
	top: 37.5%;
	left: 35.51%;
}

.map_wrapper #stage .map #o1_01 {
	top: 48.05%;
	left: 67.31%;
}
.map_wrapper #stage .map #o1_02 {
	top: 41.37%;
	left: 64.91%;
}
.map_wrapper #stage .map #o1_03 {
	top: 45.5%;
	left: 69.11%;
}
.map_wrapper #stage .map #o1_04 {
	top: 45.3%;
	left: 65.61%;
}

.map_wrapper #stage .map #o2_01 {
	top: 41.15%;
	left: 70.71%;
}
.map_wrapper #stage .map #o2_02 {
	top: 38.57%;
	left: 69.51%;
}
.map_wrapper #stage .map #o2_03 {
	top: 34.5%;
	left: 69.31%;
}

.map_wrapper #stage .map #g1_01 {
	top: 64.15%;
	left: 69.11%;
}
.map_wrapper #stage .map #g1_02 {
	top: 61.57%;
	left: 71.51%;
}

.map_wrapper #stage .map #g2_01 {
	top: 70.45%;
	left: 69.11%;
}
.map_wrapper #stage .map #g2_02 {
	top: 67.87%;
	left: 74.51%;
}
.map_wrapper #stage .map #g2_03 {
	top: 67.57%;
	left: 66.51%;
}
.map_wrapper #stage .map #g2_04 {
	top: 66.37%;
	left: 70.51%;
}

.map_wrapper #stage .map #v3_01 {
	top: 29.35%;
	left: 35.21%;
}

.map_wrapper #stage .map #v3_02 {
	top: 27.35%;
	left: 36.91%;
}

.map_wrapper #stage .map #v3_03 {
	top: 27.75%;
	left: 33.61%;
}

.map_wrapper #stage .map #v4_01 {
	top: 29.35%;
	left: 28.11%;
}

.map_wrapper #stage .map #v4_02 {
	top: 27.15%;
	left: 25.61%;
}

.map_wrapper #stage .map #v4_03 {
	top: 23.35%;
	left: 25.41%;
}

.map_wrapper #stage .map #v4_04 {
	top: 24.65%;
	left: 23.31%;
}

.map_wrapper #stage .map #vb_01 {
	top: 15.45%;
	left: 24.41%;
}

.map_wrapper #stage .map #vb_02 {
	top: 15.15%;
	left: 20.11%;
}

.map_wrapper #stage .map #vb_03 {
	top: 13.35%;
	left: 22.21%;
}

.map_wrapper #stage .map #o3_01 {
	top: 41.15%;
	left: 75.51%;
}

.map_wrapper #stage .map #o3_02 {
	top: 39.05%;
	left: 74.31%;
}

.map_wrapper #stage .map #o3_03 {
	top: 35.35%;
	left: 73.21%;
}

.map_wrapper #stage .map #o4_01 {
	top: 41.15%;
	left: 79.41%;
}

.map_wrapper #stage .map #o4_02 {
	top: 36.25%;
	left: 76.91%;
}

.map_wrapper #stage .map #o4_03 {
	top: 32%;
	left: 76.01%;
}

.map_wrapper #stage .map #ob_01 {
	top: 27.25%;
	left: 79.41%;
}

.map_wrapper #stage .map #ob_02 {
	top: 27.25%;
	left: 77.11%;
}

.map_wrapper #stage .map #ob_03 {
	top: 23.05%;
	left: 79.31%;
}

.map_wrapper #stage .map #r3_01 {
	top: 25.95%;
	left: 63.71%;
}

.map_wrapper #stage .map #r3_02 {
	top: 23.95%;
	left: 61.91%;
}

.map_wrapper #stage .map #r3_03 {
	top: 24.25%;
	left: 65.71%;
}

.map_wrapper #stage .map #r4_01 {
	top: 19.65%;
	left: 63.71%;
}

.map_wrapper #stage .map #r4_02 {
	top: 18.05%;
	left: 59.71%;
}

.map_wrapper #stage .map #r4_03 {
	top: 15.05%;
	left: 64.01%;
}

.map_wrapper #stage .map #r4_04 {
	top: 16.45%;
	left: 61.41%;
}

.map_wrapper #stage .map #g3_01 {
	top: 76.85%;
	left: 72.51%;
}

.map_wrapper #stage .map #g3_02 {
	top: 71.15%;
	left: 71.51%;
}

.map_wrapper #stage .map #g3_03 {
	top: 75.05%;
	left: 73.91%;
}

.map_wrapper #stage .map #g4_01 {
	top: 76.85%;
	left: 78.01%;
}

.map_wrapper #stage .map #g4_02 {
	top: 73.85%;
	left: 79.31%;
}

.map_wrapper #stage .map #gb_01 {
	top: 83.25%;
	left: 83.01%;
}

.map_wrapper #stage .map #gb_02 {
	top: 85.75%;
	left: 80.51%;
}

.map_wrapper #stage .map #gb_03 {
	top: 79.95%;
	left: 80.61%;
}

.map_wrapper #stage .map #gb_04 {
	top: 84.75%;
	left: 77.21%;
}

.map_wrapper #stage .map #kp_01 {
	top: 10.55%;
	left: 39.71%;
}

.map_wrapper #stage .map #kp_02 {
	top: 5.55%;
	left: 39.51%;
}


.btn_zoom {
	position: fixed;
	right: 10px;
	top: 100px;
	width: 136px;
	height: 74px;
	z-index: 101;
}

.btn_zoom-body{
	width: 136px;
	height: 74px;
	background: url(../img/map/bg_zoom.png) 0 0 no-repeat;
	position: relative;
}

.btn_zoom .btn_zoom-down{
	position: absolute;
	left: 18px;
	top:16px;
}

.btn_zoom .btn_zoom-up{
	position: absolute;
	left: 82px;
	top: 16px;
}
.btn_zoom .btn_zoom-down.disabled,
.btn_zoom .btn_zoom-up.disabled{
	display: none;
}


.footer_section {
	position: absolute;
	width: 100%;
	bottom: 0;
}
.contents_btn_pagetop {
	display: none;
}