@charset "UTF-8";

@media only screen and (min-device-width : 320px) and (max-device-width : 480px) {

/*==============================================
global
==============================================*/
#imgBox,
#about,
#spot,
#flight,
#price,
#contact,
#footer
{
	padding:0 20px;
	box-sizing: border-box;
	float:none;
	width:auto!important;
	word-break: break-all!important;
}

#aboutText,
#spotText,
#flightText,
#priceText
{
	font-size:200px;
	position:absolute;
	right:0;
	top:-40px;
}


#aboutBg,
#spotBg,
#flightBg,
#priceBg
{
	background-size:contain;
}

.thisisImg2 {
	display:none!important;
}

.thisisImg3 {
    display: inline-block!important;
	*display: inline!important;
    *zoom: 1;
}

#cloudfont {
     bottom: 40%;
}




/*==============================================
header
==============================================*/
#headerBg {
	padding:20px;
	height:auto!important;
}

#header h1 {
	width:200px!important;
	float:none;
	text-align:left;
}

body#off #header h1 {
	width:159px!important;
	float:none;
	text-align:left;
}

/*==============================================
nav
==============================================*/
#navMobileBtn {
	display:block;
	position:absolute;
	top:-5px;
	right:0px;
	width:40px;
	height:35px;
}

#header #nav {
	width:auto!important;
	float:none;
	display:none;
}

#navMobile {
	width:100%;
	background:#333;
	display:none;
}

.toolSelectorMobile {
	display: block!important;
	margin-right: 40px!important;
}

.toolSelector__tool__Moblie {
	width: 25%;
	display: block!important;
	margin-left: auto;
	margin-right: 30px;
}

#navMobile ul li {
	border-bottom:1px dotted #999;
}

#navMobile ul li:last-child {
	border-bottom:none;
}
#navMobile ul li a  {
	display:block;
	padding-left:10px;
	padding-bottom:10px;
	margin-bottom:10px;
}

#navMobile ul li a:first-child {
	padding-top:10px;
}

#navMobile ul li a:last-child {
	margin-bottom:0px;
}

#navMobile a {
	color:#fff;
}

/*==============================================
img
==============================================*/
#img {
	height:auto!important;
	padding:20px 0;
}

#imgMaru,
#imgCopy,
#imgEn
{
	display:none;
}

#imgLead {
	font-size:15px!important;
}

#imgBox h2 {
	font-size:32px!important;
}

#imgBox h3  {
	font-size:16px!important;
	line-height:1.3!important;
}

body#off h2#imgTit {
	display:none;
}

body#off h2#imgTitMobile {
	display:block;
}

body#off h2 img {
	width:100%!important;
	max-width: 100%!important;
	height: auto!important;
}


/*==============================================
about
==============================================*/
#aboutL {
	width:auto!important;
	float:none;
}

#aboutR {
	width:auto!important;
	float:none;
}

#about h2 {
	font-size:22px;
}

body#off #aboutText {
	position:absolute;
	top:0px;
	right:0px;
	width:100%;
	height:100px;
}


/*==============================================
spot
==============================================*/
.spotBox {
	width:auto!important;
	box-sizing: border-box;
	float:none;
}

body#off #spotText {
	position:absolute;
	top:0px;
	right:0px;
	width:100%;
	height:100px;
}

.spotBox:last-child,
.spotBoxR:last-child
{
	margin-bottom:0;
}

.mr20 {
	margin-right:0!important;
}

.spotBoxL {
	width:auto!important;
	float:none;
	margin-bottom:10px;
}

.spotBoxL img {
	width:100%!important;
	max-width: 100%!important;
	height: auto!important;
}

.spotBoxR {
	width:auto!important;
	float:none;
	margin-bottom:20px;
}

.spotLink {
	display:block;
}
.spotLinkImg {
	display:none;
}

.spotLink a {
	width:auto!important;
	display:block;
	text-align:center;
	font-weight:bold;
}

#spot h2 {
	font-size:22px;
}


/*==============================================
flight
==============================================*/
body#off #flightText {
	position:absolute;
	top:0px;
	right:0px;
	width:100%;
	height:150px;
}


#flightBoradTit, #flightBoard {
	display:none;
}

#flightboardMobile {
	margin-top:10px;
	display:block;
}

.flightSetMobile {
	width:100%;
	height:30px;
	background:#4c4c4c;
	margin-bottom:2px;
	overflow:hidden;
}

.flightSetMobile div {
	padding:5px 10px;
	font-size:11px;
	width:100%;
	box-sizing:border-box!important;
	height:30px;
	overflow:hidden;
}

span.flightMobileTime {
	display:block;
	float:left;
	width:55px;
}

span.flightMobileDep {
	display:block;
	float:left;
	width:90px;
}

span.flightMobileAirline {
	display:block;
}

.E {
	font-family:Helvetica, Arial, sans-serif;
}

#flight h2 {
	font-size:22px;
}


/*==============================================
price
==============================================*/
body#off #priceText {
	position:absolute;
	top:0px;
	right:0px;
	width:100%;
	height:200px;
}


#prices {
	font-size:40px;
	margin-bottom:10px;
}

#priceNotice {
	font-size:12px;
}

#price ul li {
	padding-left:1em;
	text-indent:-1em;
}

#priceBtn {
	display:block;
}

#priceBtn a {
	font-size:14px;
	width:100%!important;
	box-sizing:border-box!important;
	text-align:center;
}

body#off #pricesMobile img,
body#off #priceBtn img
 {
	width:100%!important;
	max-width: 100%!important;
	height: auto!important;
}

body#off #prices,
body#off #priceBtnImg {
	display:none;
}

body#off #pricesMobile {
	margin-top:10px;
	display:block;
}

body#off #priceBtn a {
	font-weight:bold;
}

#price h2 {
	font-size:22px;
}



/*==============================================
footer
==============================================*/
#footerBg {
	padding:5px;
}

#footer small {
	font-size:11px;
}