@charset "UTF-8";


/* RESET
-------------------------------------------------------------- */
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, font, 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 {
	background: transparent;
	border: 0;
	margin: 0;
	padding: 0;
	vertical-align: baseline;
}
#copyright{
	color:#efefef;
}
body {
	line-height: 1;
	color: #000;
	font-size: 12px;
	font-family: Helvetica, "ヒラギノ角ゴ ProN W3", HiraKakuProN-W3, sans-serif;
	-webkit-font-smoothing: antialiased;
	overflow-x:hidden;
}
ul {
	list-style: none outside;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
a{
	text-decoration: none;
}
a img {
	border: none;
}




/* COMMON
-------------------------------------------------------------- */
html, body{
	width: 100%;
	height: 100%;
	position: relative;
	min-height: 640px;
}
div.clear{
	display: block !important;
	float: none !important;
	clear: both !important;
	width: 0px !important;
	height: 0px !important;
}
div#unsupported{
	margin: 55px;
}
div#unsupported h1{
	margin: 0 0 45px 0;
}
div#unsupported p{
	margin: 0 0 30px 0;
	font-size: 12px;
	line-height: 24px;
}
div#unsupported p span{
	color: #9A9A9A;
}
::selection {
background: rgba(0, 0, 0, 0);
}


div#site-translate-header-wrapper{
	width: 100% !important;
	background: #000 !important;
	border: none !important;
	padding: 0 !important;
	position: absolute !important;
	top: 0px !important;
	left: 0px !important;
}
#site-translate-message{
	color: #FFF !important;
}
div#site-translate-header-message{
	padding: 0 !important;
	margin: 0 !important;
	float: none !important;
}
div#site-translate-header-message span{
	width: 100%;
	font-size: 10px !important;
	color: #FFF !important;
	display: inline-block !important;
	padding: 0.5em 0px;
	background: rgba(0, 0, 0, 0.5);
}


/* LOADING
-------------------------------------------------------------- */
div#loading{
	width: 100%;
	height: 100%;
	background: #F1F1F1;
	position: absolute;
	top: 0px;
	left: 0px;
	z-index: 9;
	border-bottom: 154px solid rgba(255, 255, 255, 0);
	box-sizing: border-box;
	-moz-box-sizing: border-box;
	
}
div#loading img{
	display: none;
	position: absolute;
	top: 50%;
	left: 50%;
	margin: -30px 0 0 -30px;
}



/* HEADER
-------------------------------------------------------------- */
div#sub{
	height: 144px;
	width: 100%;
	
	position: fixed;
	bottom: 0px;
	left: 0px;
	background: #000;
	filter: alpha(opacity=0.8);
	-moz-opacity:0.8;
	opacity:0.8;
	z-index: 50;
}
div#sub div#sub_wrapper{
	position: relative;
	width: 100%;
	height: 144px;
	min-width: 960px;
}
div#sub div#sub_wrapper img.yomitanson_mark{
	display: block;
	width: 66px;
	height: 66px;
	position: absolute;
	top: 22px;
	right: 85px;
}
div#sub header{
	width: 100%;
	box-sizing: border-box;
	-moz-box-sizing: border-box;
	padding: 0 0 24px 75px;
	position: absolute;
	bottom: 0px;
	font-size: 10px;
}
div#sub header h1{
	display: block;
	width: 202px;
	height: 67px;
	margin: 0 0 12px 0;
	position: relative;
}
div#sub header h1 p{
	position: absolute;
}
div#sub header h1 p#subtitle{
	bottom: 12px;
	left: 230px;
}
div#sub header h1 p#credit{
	bottom: 12px;
	left: 390px;
}
div#sub div#sublink{
	position: absolute;
	bottom: 20px;
	right: -28px;
	width: 300px;
	font-size: 11px;
}
div#sub div#sublink img{margin-left: 5px;}
div#sub div#sublink a#facebook,
div#sub div#sublink a#twitter,
div#sub div#sublink a#photo_credit,
div#sub div#sublink div#lang_menu{
	display: block;
	float: left;
	color: #efefef;
}
div#sub div#sublink a#photo_credit span{
	display: block;
	background: url("../img/index/camera_icon.png") no-repeat 10px 1px;
	line-height: 17px;
	padding: 0 10px 0 37px;
}
div#sub div#sublink a#facebook span{
	display: block;
	background: url("../img/index/fb_icon.png") no-repeat 11px 0px;
	line-height: 17px;
	padding: 0 10px 0 27px;
}

div#sub div#sublink a#twitter span{
	display: block;
	background: url("../img/index/tw_icon.png") no-repeat 10px 1px;
	line-height: 17px;
	padding: 0 10px 0 34px;
}
div#sub div#sublink div#lang_menu{
	position: relative;
}
div#sub div#sublink div#lang_menu span#lang_current{
	display: block;
	height: 16px;
	
	padding: 1px 11px 0 31px;
	line-height: 17px;
	cursor: pointer;
}
div#sub div#sublink div#lang_menu span#lang_current img.lang_arrow{
	display: block;
	position: absolute;
	left: 10px;
	top: 4px;
}
div#sub div#sublink div#lang_menu ul{
	display: none;
	width: 111px;
	height: 196px;
	background: url("../img/index/lang_popup.png") no-repeat left top;
	position: absolute;
	top: -196px;
	right: 0px;
	z-index: 10;
}
div#sub div#sublink div#lang_menu ul li{
	display: block;
	width: 105px;
	height: 23px;
	margin: 3px;
	background: #FFF;
}
div#sub div#sublink div#lang_menu ul li a{
	display: block;
	width: 105px;
	height: 23px;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
}
div#sub div#sublink div#lang_menu ul li a#lang_ja{background : url("../img/index/lang_ja.png") no-repeat left top;}
div#sub div#sublink div#lang_menu ul li a#lang_en{background : url("../img/index/lang_en.png") no-repeat left top;}
div#sub div#sublink div#lang_menu ul li a#lang_pt{background : url("../img/index/lang_pt.png") no-repeat left top;}
div#sub div#sublink div#lang_menu ul li a#lang_es{background : url("../img/index/lang_es.png") no-repeat left top;}
div#sub div#sublink div#lang_menu ul li a#lang_zh-hans{background : url("../img/index/lang_zh-hans.png") no-repeat left top;}
div#sub div#sublink div#lang_menu ul li a#lang_zh-hant{background : url("../img/index/lang_zh-hant.png") no-repeat left top;}
div#sub div#sublink div#lang_menu ul li a#lang_kr{background : url("../img/index/lang_kr.png") no-repeat left top;}


/* MAIN
-------------------------------------------------------------- */
div#wrapper{
	position: relative;
	width: 100%;
	height: 100%;
	overflow: auto;
	overflow-x: auto;
	overflow-y: hidden;
	background: #F1F1F1;
}
div#main{
	margin: 0;
	/*width: 2000px;*/
	width: 1920px;
	height: 100%;
	overflow-x:hidden;
}
div#main div#section_banner_wrapper{
	position: relative;
	/*width: 2000px;*/
	width: 1920px;
	height: 100%;
	min-height: 496px;
	margin: 0 auto;
	overflow-x:hidden;
}
div#main div.section_banner{
	position: absolute;
	display: block;
	width: 350px;
	height: 100%;
	overflow: hidden;
	background: #FFF;
	top: 0px;
	left: 0px;
}
div#main div.section_banner a{
	display: block;
}
div#main div.section_banner .section_banner_name{
	z-index: 1;
}
div#main div.section_banner div.mask{
	position: absolute;
	width: 100%;
	height: 100%;
	background: #F1F1F1;
	/*cursor: pointer;*/
}
.maskhover{
		position: absolute;
		width: 100%;
		height: 100%;
		background: rgba(0,0,0,.6);
		/*cursor: pointer;*/
}
div#main div.section_banner:before{
	content:".";
	display:block;
	float:left;
	width:0px;
	height:466px;
	opacity:0;
}
div#main div.section_banner img.section_banner_img{
	height: 100%;
	display: block;
	position: absolute;
	left: 50%;
	margin: 0 0 0 0;
	vertical-align: bottom;
}
div#main div.section_banner img.section_banner_name{
	position: absolute;
	top: 50%;
	left: 50%;
	margin-top: -46px;
}
div#main div.section_banner img.section_banner_name{  transition:.2s; margin-top: -44px;  margin-left: -81px;}
div#main div.section_banner img.section_banner_name2{position: absolute;
  top: 50%;
  left: 50%;  margin-top:-95px;margin-left:-45px; transition:.2s;z-index: 1}
/*div#main div.section_banner img#section_banner_name_yuntanza:hover{margin-left: -75px;}
div#main div.section_banner img.section_banner_name:hover{margin-top:-44px;margin-left:-75px;}
div#main div.section_banner img.section_banner_name2:hover{  margin-top:-95px;margin-left:-40px;}*/
div#main div.section_banner img#section_banner_name_yachimun{margin-left: -95px;}
div#main div.section_banner img#section_banner_name_hanaui{margin-left: -83px;}
div#main div.section_banner img#section_banner_name_haru{margin-left: -46px;}
div#main div.section_banner img#section_banner_name_yukui{margin-left: -56px;}
div#main div.section_banner img#section_banner_name_churasan{margin-left: -87px;}
div#main div.section_banner img#section_banner_name_gusuku{margin-left: -73px;}
div#main div.section_banner img#section_banner_name_ashibi{margin-left: -63px;}

div#wrapper div.move_navigation{
	position: fixed;
	top: 0px;
	box-sizing: border-box;
	-moz-box-sizing: border-box;
	height: 100%;
	padding-bottom: 154px;
	width: 103px;
	filter: alpha(opacity=0);
	-moz-opacity:0;
	opacity:0;
	overflow-x:hidden;
}
div#wrapper div.move_navigation a{
	position: relative;
	display: block;
	width: 100%;
	height: 100%;
	-webkit-touch-callout:none; 
}
div#wrapper div.move_navigation a img{
	position: absolute;
	top: 50%;
	margin: -44px 0 0 0;
}
div#wrapper div#move_left{left: 0px;}
div#wrapper div#move_right{right: 0px;}
div#wrapper div#move_left img{right: 30px;}
div#wrapper div#move_right img{left: 30px;}