@charset "utf-8";

	/*----------------------------------------------------------------------
			IMPORT
	----------------------------------------------------------------------*/
	#section .bnr_joyful img.rwdSpImg{
		display: none;
	}
@media screen and (max-width:949px) {
	/*----------------------------------------------------------------------
			Common
	----------------------------------------------------------------------*/
	 
	/*----------------------------------------------------------------------
			IMPORT
	----------------------------------------------------------------------*/
	#wrap {
		min-width: 0;
	}
	#section {
		width: auto !important;
	}
	#section .bnr_joyful{
		padding-left: 15px;
		padding-right: 15px;
	}
	#section .bnr_joyful img{
		max-width:100%;
		width: auto;
		height: auto;
	}
	
	/*------------------
	#ipb_box
	------------------*/
	#section #ipb_box {
		width: auto;
		padding-left: 15px;
		padding-right: 15px;
	}
	#wrap #contents #ipb_box .jrPassBox .passBoxColumn.column1 .passBoxWrap{
		float: none;
	}
	#wrap #contents #section #ipb_box .jrPassBox,
	#wrap #contents #ipb_box .jrPassBox .passBoxColumn.column1 .passBoxWrap,
	#wrap #contents #ipb_box .jrPassBox .passBoxColumn.column1 .passBoxWrap .passBox,
	#wrap #contents #ipb_box .jrPassBox .passBoxColumn.column1 .passBoxWrap .passBoxRight,
	#wrap #contents #ipb_box .jrPassBox .passBoxColumn.column3 .passBoxWrap,
	#wrap #contents #ipb_box .jrPassBox .passBoxColumn.column3 .passBoxWrap .passBox,
	#wrap #contents #ipb_box .jrPassBox .passBoxColumn.column3 .passBoxWrap .passBoxRight{
		width: auto;
	}
	#wrap #contents #ipb_box .jrPassBox .passBoxColumn.column1 .passBoxWrap .passBox,
	#wrap #contents #ipb_box .jrPassBox .passBoxColumn.column3 .passBoxWrap .passBox{
		padding-right: 10px;
	}
	#wrap #contents #ipb_box .jrPassBox .passBoxColumn.column3 .passBoxWrap{
		margin-right: 0;
		margin-bottom: 7px;
		width: 32%;
		max-width: 32%;
    margin: 0 0.8%;
	}
	#wrap #contents #ipb_box .jrPassBox .passBoxColumn.column3 .passBoxWrap:last-child{
		margin-bottom: 0;
	}
	#wrap #contents #ipb_box .jrPassBox .passBoxColumn.column1 .passBoxWrap .passBoxRight,
	#wrap #contents #ipb_box .jrPassBox .passBoxColumn.column3 .passBoxWrap .passBoxRight{
		float: none;
	}
	#wrap #contents .linksBox {
		width: auto;
	}
	#section #ipb_box + .note{
		padding-left: 15px;
	}
	#destinations .inner {
		width: auto;
		padding-left: 15px;
		padding-right: 15px;
	}
	#destinations .inner img{
		max-width:100%;
		width: auto;
		height: auto;
	}
	
	/*----------------------------------------------------------------------
			INDEX
	----------------------------------------------------------------------*/
	/* mv */
	
	#mv .bx-viewport {
		width: auto !important;
	}
	
	/*----------------------------------------------------------------------
			LOWER
	----------------------------------------------------------------------*/
	/* lead */
	#lead .leadImage {
		margin-left: -15px;
		margin-right: -15px;
	}
	#lead .leadImage h1 {
		padding-left: 4%;
		padding-right: 10%;
		width: 86%;
		text-align: left;
	}
	#lead .leadImage img{
		max-width:100%;
		width: auto;
		height: auto;
	}
	#lead .leadMapWrap .txt {
		width: auto;
	}
	
	/* map */
	.map .mapImg img{
		max-width:100%;
		width: auto;
		height: auto;
	}
	.recommended .btn {
		width: 100%;
	}
	.recommended .tableBox .txtBox {
		width: 52%;
		padding-right: 4%;
	}
	.recommended .tableBox .img {
		padding-left: 0;
	}
	
	/* movie */
	.movie .movieBox {
		width: 48%;
		margin-right: 4%;
	}
	.movie .movieListSg .movieSgTxt {
		width: 48%;
	}
	
	/* sights */
	/* cuisine */
	.sights .boxList .box,
	.cuisine .boxList .box {
		width: 48%;
		margin-right: 4%;
	}
	.sights .boxList .box .img iframe,
	.cuisine .boxList .box .img iframe{
		max-width: 100%;
	}
	.sights .boxList .box .img img,
	.cuisine .boxList .box .img img {
		max-width:100%;
		width: auto;
		height: auto;
	}
	.sights .tableBox .txtBox,
	.cuisine .tableBox .txtBox {
		width: 48%;
		margin-right: 4%;
	}
	.sights .tableBox .img img,
	.cuisine .tableBox .img img {
		max-width:100%;
		width: auto;
		height: auto;
	}
	
	/* outline */
	.outline .outlineBox {
		width: 48%;
		margin-right: 4%;
	}
	.outline .outlineBox .img img{
		max-width:100%;
		width: auto;
		height: auto;
	}
	
	/* others */
	.others .destinationList {
		margin: 66px 0 0;
		text-align: center;
	}
	.others .destinationList ul li {
		display: inline-block;
		float: none;
		margin-left: 10px;
		margin-right: 10px;
	}
	.others .destinationList ul li:nth-child(5n) {
		margin-left: 10px;
		margin-right: 10px;
	}
	
}
@media screen and (max-width: 640px) {
	/*----------------------------------------------------------------------
			Common
	----------------------------------------------------------------------*/
	 #contents p.link{
		 padding-left: 0;
	 }
	 #contents p.link:before{
		 display: none;
	 }
	 #contents p.link > a{
    padding-left: 16px;
    background: url(../../../img/multi/icon_arw02.png) no-repeat left center;
	 }
  .sp_menu > ul li.icnPC > a{
    background:url(../../img/renew/common/icon_pc_grn.png) 99% center no-repeat;
    background-size:25px auto;
  }
	/*----------------------------------------------------------------------
			IMPORT
	----------------------------------------------------------------------*/
	#section .bnr_joyful{
		padding-left: 0px;
		padding-right: 0px;
		margin-bottom: 40px;
		text-align: center;
	}
	#section .bnr_joyful a{
		display: inline-block;
	}
	#section .bnr_joyful img.rwdPcImg{
		display: none;
	}
	#section .bnr_joyful img.rwdSpImg{
		display: block;
	}
	
	/*------------------
	#ipb_box
	------------------*/
	#section #ipb_box {
		padding-left: 0px;
		padding-right: 0px;
	}
	#wrap #contents #ipb_box .jrPassBox .passBoxColumn.column1 .passBoxWrap{
		margin-right: 0;
	}
	#wrap #contents #ipb_box .jrPassBox .passBoxColumn.column3 .passBoxWrap{
		margin-right: 0;
		margin-bottom: 7px;
		width: 100%;
		max-width: 100%;
		margin: 0;
	}
	#section #ipb_box + .note{
		padding-left: 0px;
	}
	#destinations .inner {
		padding-left: 10px;
		padding-right: 10px;
	}
	#destinations section h2 {
		font-size: 180%;
	}
	#destinations section h2:before {
		bottom: auto;
		top: 50%;
	}
	#destinations section h2 > span {
		padding: 0 5px;
		margin-left: 10px;
		margin-right: 10px;
    max-width: 70%;
	}
	
	/*----------------------------------------------------------------------
			LOWER
	----------------------------------------------------------------------*/
	/* lead */
	#lead {
		text-align: left;
		padding-bottom: 40px;
	}
	#lead .leadImage {
		margin-left: -10px;
		margin-right: -10px;
	}
	#lead .leadImage h1 {
		text-indent:100%;
		overflow: hidden;
		white-space:nowrap;
		background: none;
		display: none;
	}
	#lead .leadImage h1:before {
		display: none;
	}
	#lead .txt {
		margin-top: 30px;
	}
	#lead .leadMap {
		width: auto;
		float: none;
		padding-left: 0;
		text-align: center;
		margin-bottom: 20px;
	}
	
	/* section_lower */
	#section_lower {
		margin-bottom: 40px;
	}
	#section_lower > div:nth-child(2n+1), #section_lower > section:nth-child(2n+1){
		padding-bottom: 40px;
		margin-bottom: 0px;
	}
	
	/* map */
	.map {
		padding: 40px 0px;
	}
	.map h3 {
		font-size: 160%;
	}
	
	/* recommended */
	.recommended {
		padding-top: 40px;
		padding-bottom: 0px;
		margin-bottom: 40px;
	}
	.recommended h3 {
		font-size: 160%;
	}
	.recommended .btn {
		margin-top: 20px;
		font-size: 130%;
		width: 80%;
	}
	.recommended .btn a {
		padding-left: 3%;
		padding-right: 3%;
	}
	.recommended .tableBox {
		margin-top: 40px;
	}
	.recommended .tableBox .txtBox {
		float: none;
		width: auto;
		margin-right:0;
		display: block;
    margin-top: 20px;
	}
	.recommended .tableBox .img {
		float: none;
		width: auto;
		/*display: block;*/
		margin-top: 20px;
		text-align: center;
    display: table-header-group;
	}
	
	/* movie */
	.movie {
		padding-top: 40px;
		padding-bottom: 40px;
	}
	.movie .txt {
		margin-top: 40px;
		text-align: left;
	}
	.movie .movieBox {
		width: 100%;
		margin-right:0;
	}
	.movie .movieList dl dt {
		font-size: 125%;
	}
	.movie .movieBox {
		margin-top: 15px;
	}
	.movie .movieBox:nth-child(2n){
		margin-top: 30px;
	}
	.movie .movieListSg .movieBox {
		float: none;
	}
	.movie .movieListSg .movieSgTxt {
		width: auto;
		margin-right:0;
	}
	
	/* sights */
	/* cuisine */
	.sights,
	.cuisine {
		padding-top: 40px;
		padding-bottom: 40px;
	}
	.sights h3,
	.cuisine h3 {
		font-size: 160%;
		margin-bottom: 10px;
	}
	.sights .img span,
	.cuisine .img span {
		position: relative;
	}
	.sights .boxList .box,
	.cuisine .boxList .box {
		width: 100%;
		margin-right:0;
		margin-top: 40px;
	}
	.sights .boxList .box .img iframe,
	.cuisine .boxList .box .img iframe{
		width: 100%;
	}
	.sights .boxList .box .img,
	.cuisine .boxList .box .img{
		margin-top: 0;
		margin-bottom: 10px;
	}
	.sights .tableBox .txtBox,
	.cuisine .tableBox .txtBox {
		margin-right:0;
		width: auto;
		display: block;
	}
	.sights .tableBox .img,
	.cuisine .tableBox .img{
		display: block;
	}
	
	/* outline */
	.outline {
		padding-top: 40px;
		padding-bottom: 40px;
	}
	.outline .outlineList {
		margin-top: 40px;
	}
	.outline .outlineBox {
		margin-right:0;
		width: auto;
		display: block;
		margin-bottom: 40px;
	}
	.outline .outlineBox h3 {
		margin-bottom: 10px;
		font-size: 160%;
	}
	
	/* others */
	.others {
		padding-top: 40px;
		padding-bottom: 30px;
	}
	.others .destinationList {
		margin-top: 40px;
	}
	.others .destinationList ul li {
		margin-left: 5px;
		margin-right: 5px;
		margin-bottom: 10px;
	}
	.others .destinationList ul li:nth-child(5n) {
		margin-left: 5px;
		margin-right: 5px;
		margin-bottom: 10px;
	}
	#destinations .destinationList ul li img{
		width: 140px;
		height: auto;
	}


}

@media screen and (min-width: 641px){
	#wrap #contents {
		max-width: none;
	}
}
