@charset "utf-8";
/* CSS Document */

#mainContents{ 
	margin-bottom:5px;
	padding-bottom:8px;
	background:url(../../img/topics/desert/bg_new.png) repeat;
}
.mainIslandCont h2{
	margin-top:20px;
	margin-bottom:8px;
	border-top:4px solid #0066cc;
	border-bottom:4px solid #0066cc;
	padding:13px 0;
	text-align:center;
	font-size:1.3em;
	clear:both;
	background:#fff!important;
	font-family: -apple-system, BlinkMacSystemFont, 'Helvetica Neue', 'Hiragino Sans', 'Hiragino Kaku Gothic ProN', '游ゴシック  Medium', meiryo, sans-serif;
}
#mainBg{
	background-size: 100%;
	height: 200px;
}
#mainBg p.topMainArea{
	width: 25%;
}
#mainBg p.topMainImg{
	width: 60%;
}
/*ナビ*/
#menu_mujin2 {
	background:url(../../img/topics/desert/bg_new.png) repeat;
}
#menu_mujin2 p{
	width: 80%;
}
#menu_mujin2 ul li{
	width:50%;
}
#menu_mujin2 ul li span{
	margin:3px;
}
#menu_mujin2 ul li span.islandName{
	background:url(../../img/topics/desert/menuIcon_03.png) no-repeat; 
	padding-left:18px;
}
#menu_mujin2 ul li.tabCurrent{
	color:#003300;
}
#menu_mujin2 img{
	opacity:0.5;
}
#menu_mujin2 ul li.tabCurrent img,#menu_mujin2 a:hover img{
	opacity:1;
}
#menu_mujin2 ul li a:hover{
	color:#003300;
}
#pageNav {
	padding:8px 0;
}
#pageNav ul li{
	float:left;
	width:33%;
}
#pageNav ul li img{
	width:100%;
}
.mainIslandCont #pageNav ul {
	 display: table;
	  table-layout: fixed;
	  text-align: center;
	  width: 100%;
}
.mainIslandCont #pageNav ul li{
	display: table-cell;
	float:none;
    vertical-align: middle;
	padding:5px 0;
	text-align:center;
	border-right: 1px solid #0066cc;
}
.mainIslandCont #pageNav ul li a{
	text-decoration:none;
}
.mainIslandCont #pageNav ul li:hover{
	background:#fff;
}
.mainIslandCont #pageNav ul li i{
	margin-left:5px;
}
.mainIslandCont #pageNav ul li:last-child{
	border-right:none;
}

/*リード*/
#leadtxt{
	margin-top:15px;
}
#leadtxtInner {
	padding:8px;
}
#leadtxt .leadImg{
	width:80%;
	float: none;
	margin:0px auto 8px;
}
#leadtxt .leadImg img{
	width:100%;
	height:auto;
}
#leadtxt .leadCont {
	line-height:1.3em;
	font-size:1em;
	float: none;
    width: 96%;
    margin: 10px auto;
}
#leadtxt .leadCont ul {
	margin-bottom:8px;
}
#leadtxt .leadCont ul li{
	font-size:1.1em;
	line-height:1.5em;
	background: linear-gradient(transparent 40%, #ffff66 40%);
	margin-bottom:5px;
	display:inline;
}
#leadtxt .leadCont .leadData{
	background:#fff;
	padding:5px;
	margin-top:8px;
}
#leadtxt .leadComments ul li,#leadtxt .leadComments ul li.comS,#leadtxt .leadComments ul li.comL{
	width: 100%;
	float: none;
}
/*マップ*/	
#ritouMap {
	margin:20px auto 8px;
}
#ritouMap ul{
	background:url(../../img/topics/desert/mapIslandSp.png);
	background-size: 100% 100%;
    width: 100%;
    height: 250px;
	margin:8px auto;
	position:relative;
}
#ritouMap ul li a{
	position:absolute;
	display:block;
}
#ritouMap ul li a:hover img{
	opacity: 0.5;
  filter: alpha(opacity=50);
  -ms-filter: "alpha(opacity=50)";
}
#ritouMap ul li.mapNagannu a{
	top: 50%;
    left: 16%;
}
#ritouMap ul li.mapMinna a{
	left: 20%;
    top: 12%;
}
#ritouMap ul li.mapSesoko a{
	top: 20%;
    left: 25%;
}
#ritouMap ul li.mapKutaka a{
	top: 78%;
    left: 55%;
}
#ritouMap ul li.mapKerama a{
	top: 80%;
    left: 5%;
}
#ritouMap ul li.mapHamahiga a{
	top: 60%;
    left: 60%;
}
#ritouMap ul li.mapKouri a{
	left: 62%;
    top: 1%;
}
#intro{
	margin:8px auto;
	width: 96%;
}
#intro p{
	float:none!important;
	background:#fff;
	border-bottom:1px dotted #666;
	padding:5px 0;
	background-image: url(/sp/ib/img/common/ico_btn_allow_bottom_orange.png);
    background-repeat: no-repeat;
    background-position: 95% center;
    background-size: 12px auto;
}
#intro p.active{
	background-image: url(/sp/ib/img/common/ico_btn_allow_top_orange.png);
	border-bottom:none;
}
#intro p span{
	display:inline-block;
	vertical-align:middle;
	margin-left:8px;
}
#intro p span.acMenuImg{
	width:20%;
}
#intro p span.acMenuImg img{
	width:100%;
	height:auto;
}
#intro p.introImg{
	width:80%;
	margin:0 auto;
	float:none;
	border-bottom:none;
}
#intro .introImg img{
	width:100%;
	height:auto;
}
#intro h3{
	background:#06c;
	color:#fff!important;
	text-align:center;
	border:none!important;
	padding:10px 0!important;
	font-size:1.3em!important;
	margin-bottom:10px;
}
#intro h3 i{
	margin-right:8px;
}
#intro h4{
	font-size:1.3em;
	color:#333;
	color:#06c;
	background:none!important;
	border:none!important;
	text-align: center;
}

#intro .introCont{
	background:#FFFFFF;
	margin-bottom: 10px;
    padding: 8px;
	/* display:none; */
}
#intro .introCont dl dt{
	font-size:1em;
	font-weight:bold;
}
#intro .introCont dl dd{
	font-size:1em;
	line-height:1.2em;
	margin:5px 0;
}
#intro .introCont dl dd.introData{
	background:#eee;
	padding:5px;
}
#intro .introCont .introLink{
	clear:both;
	width:80%;
	margin:8px auto 0;
}
#intro .introCont .introLink a{
	color:#fff;
	background:#f90;
	border-radius:5px;
	text-align:center;
	padding:10px;
	font-size:1.2em;
	display:block;
	font-weight:bold;
}
#intro .introCont .introLink a:link,#intro .introCont .introLink a:visited{
	color:#fff!important;
	text-decoration:none;
}
#intro .introCont .introLink a:hover{
	opacity:0.8;
}
/*レジャー*/
#activity{
	margin-top:20px;
}
.actInner{
	margin:10px 0;
	padding: 0 8px;
}
.actCont{
    background: #fff;
	margin-bottom:8px;
}
.actCont h3{
	border:none!important;
	text-align:center;
	background:#06c;
	color:#FFFFFF!important;
	padding:8px!important;
	font-size:1.2em!important;
}
.actCont p.actText{
	padding:5px 5px 0px 5px;
	line-height:1.2em;
}
.actCont p.actImg{
	width: 80%;
	margin: 8px;
	margin-left: 30px;
}
.actCont p.actImg img{
	width:100%;
}
.actCont ul{
    font-size: 1.1em;
    float: left;
    width: 70%;
    margin-left: 50px;
}
.actCont ul li {
	margin-bottom:3px;
}
.actCont ul li a{
	background:#f90;
	border-radius:5px;
	color:#fff;
	text-align:center;
	padding:8px 0;
	display:block;
	font-weight:bold;
}
.actCont ul li a:link,.actCont ul li a:visited{
	color:#fff!important;
	text-decoration:none;
}
.actCont ul li a:hover{
	opacity:0.8;
}

/*ツアー*/
.tourNavi li{
	width: 100%;
	display: block;
	margin-bottom: 20px;
}
.tourNavi li:before{
	right: 0;
	left: 0;
    margin: auto;
}
.tourCont{
	position:relative;
	margin:8px auto;
	width:90%;
	background:#fff;
	padding:8px;
}
.tourCont.gray::before,.tourCont.gray::after{
	position: absolute;
    left: 0;
    right: 0;
    top:0;
    bottom: 0;
    margin: auto;
}
.tourCont.gray::before{
	content:'';
	background: rgba(196,196,196,0.8);
    width: 100%;
    height: 100%;
}
.tourCont.gray::after{
	content: 'Coming soon';
	top: 40%;
	text-align: center;
    font-size: 1.2rem;
    font-weight: bold;
}
h3.tourCategoryTtl{
	border:none!important;
	background:#06c;
	color:#fff!important;
	text-align:center;
	border:none!important;
	padding:10px 8px!important;
	font-size:1.1em!important;
	width:90%;
	margin:0 auto;
}
.tourCont h3.tourTitle,.tourCont h4{
	border-left:6px solid #06c!important;
	border-bottom:none!important;
	font-size:1em!important;
	color:#06c!important;
	padding:0px 0px 5px 8px!important;
	background:none!important;
	border-top:none!important;
}
.tourCont .tourContInner p.planImg{
	float:none!important;
	width:80%;
	margin:5px auto;
}
.tourCont .tourContInner .planImg img{
	width:100%;
	height:auto;
}
.tourBoxN .tourCont .tourContInner p.planImg{
	width: 80%;
    margin: 5px auto 0;
}
.tourBoxN .tourCont .tourContInner .planImg img{
	width:100%;
	height: 120px;
    object-fit: cover;
}
.tourCont .tourContInner .planDetail{
	font-size:1em;
	line-height:1.3em;
	float: none;
    width: 100%;
}
.tourCont .tourContInner .tourDetail {
    width: 100%;
    margin-bottom: 0;
}
.tourCont .tourContInner .planDetail dl{
	margin-bottom:8px;
	padding-bottom:5px;
	border-bottom: 1px dotted #666;
}
.tourCont .tourContInner .planDetail dt {
	/*float:left;*/
}
.tourCont .tourContInner .planDetail dt span,.tourCont .tourContInner .tourDetail dd.tourPrice{
	color:#F00;
	font-weight:bold;
	font-size:1.6em;
	display:block;
	font-family:Arial, Helvetica, sans-serif;
}
.tourCont .tourContInner .tourDetail dd:first-child{
	padding:5px;
}
.tourCont .tourContInner .tourDetail dd {
	margin-bottom:6px;
	font-size:0.9em;
}
.tourCont .tourContInner .tourDetail dd.tourIcon span{
	padding:3px;
	background:#666;
	color:#fff;
	margin-right:3px;
	
}
.tourCont .tourContInner .tourDetail dd.tourIcon,.tourCont .tourContInner .tourDetail dd.tourPrice {
	text-align:center;
}
.tourCont .tourContInner .tourDetail dd.tourPrice span{
	font-weight:normal;
	color:#666;
	font-size:0.7em;
}

.tourCont .tourContInner .planDetail .tourLink{
	/*width:40%;*/
	margin:8px auto;
	/*float:right;*/
}
.tourCont .tourContInner a{
	background:#f90;
	border-radius:5px;
	color:#fff;
	text-align:center;
	padding:8px 5px;
	display:block;
	font-weight:bold;
	font-size:1.1em;
	border:#f90 2px solid;
	text-decoration:none;
}
.tourCont .tourContInner a:link,.tourCont .tourContInner a:visited{
	color:#fff!important;
}
.tourCont .tourContInner .planDetail a i,.tourCont .tourContInner .tourDetail a i{
	margin-left:5px;
}
.tourCont .tourContInner .planDetail a:hover{
	background:#fff;
	border:#f90 2px solid;
	color:#f90;
}
/*主催会社ショップからツアーを探す*/
.shopCont {
	width:92%;
	margin:8px auto;
}
.shopCont ul li{
	width: 97%;
	float:none;
	background:#fff;
	padding:5px;
	margin-bottom:5px;
}

.shopCont ul li:nth-child(2),.shopCont ul li:nth-child(4){
	margin-right:0px;
}
.shopCont ul li a{
	display:block;
}
.shopCont ul li p{
	float:left;
	vertical-align:middle;
}
.shopCont ul li div{
	float:left;
	width:56%;
}
.shopCont ul li div p{
	font-weight:bold;
	font-size:1.3em;
}
.shopCont ul li div span{
	display:block;
	clear:both;
	color:#666;
	padding: 5px;
}
.shopCont ul li div .introduceTxt{
	border-bottom: #999 1px dotted;
}
.shopCont ul li div i{
	margin-left:5px;
}
.shopCont ul li p.activityImg{
	width:40%;
	margin-right:8px
}
.shopCont ul li p.activityImg img{
	width:100%;
	height: 100px;
}
.shopCont ul li p.activityImg img:nth-child(1){
	margin-bottom:5px;
}

/*アクティビティから選ぶ*/
.activityCont {
	width:92%;
	margin:8px auto;
}
.activityCont ul {
	flex-direction: column;
}
.activityCont ul li{
	width:100%;
	box-sizing:border-box;
	background:#fff;
	padding:5px;
	margin-bottom:5px;
}
.activityCont ul li:nth-child(2),.activityCont ul li:nth-child(4){
	margin-right:0px;
}
.activityCont ul li a{
	display:block;
}
.activityCont ul li p{
	float:left;
	vertical-align:middle;
}
.activityCont ul li div{
	float:left;
	width:56%;
}
.activityCont ul li div p{
	font-weight:bold;
	font-size:1.1em;
}
.activityCont ul li div span{
	display:block;
	clear:both;
	color:#666;
}
.activityCont ul li div i{
	margin-left:5px;
}
.activityCont ul li p.activityImg{
	width:40%;
	margin-right:8px
}
.activityCont ul li p.activityImg img{
	width:100%;
	height:100px;
}
#islandTour .planListBtn{
	width:90%;
	margin:15px auto;
}
.planListBtn a{
	background:#f90;
	border-radius:5px;
	color:#fff!important;
	text-align:center;
	padding:8px 5px;
	display:block;
	font-weight:bold;
	font-size:1.2em;
	border:#f90 2px solid;	
	width: 80%;
	margin: 0 auto;
}
#islandTour .planListBtn a:link,#islandTour .planListBtn a:visited{
	color:#fff!important;
	text-decoration:none;
}
#islandTour .planListBtn a:hover{
	background:#fff;
	border:#f90 2px solid;
	color:#f90;
}
/**/
#photoSlider {
    display: none;
}
#nagannuMov .photoTab{overflow:hidden;width: 95%;margin: 8px auto;}
#nagannuMov .photoTab li{
	float:left; 
	width:47%;
	background:#fff;
	color:#f90;
	text-align:center;
	cursor:pointer;
	border:2px #f90 solid;
	border-radius:5px;
	padding:6px 0;
	margin-left:5px;
	font-size:1.2em;
	font-family: 'Dosis', sans-serif;
	}
#nagannuMov .photoTab li.select,#nagannuMov .photoTab li:hover{
	border:2px #f90 solid;
	background:#f90;
	color:#fff;
	}
#nagannuMov .photoCont li{}
#nagannuMov .photoCont .hide {display:none;}
#nagannuMov .islandMovie{
	width:94%;
	margin:10px auto;
}
#nagannuMov .islandPhoto {
    width: 90%;
    margin: 8px auto 15px;
	padding-bottom: 15px;
}
#nagannuMov .islandPhoto img{
	width:100%;
	height:250px;
}
#nagannuMov .islandPhoto li span{
	position:absolute;
	padding:8px;
	background:rgba(255,255,255,0.8);
	bottom:0;
	width:100%;
}
/*情報*/
#infomation .infoCont{
	width:94%;
	margin:8px auto;
	padding:8px;
	font-size:1em;
	line-height:1.3em;
}
#infomation .infoWaku{
	border:1px solid #666;
	margin-top:8px;
	padding:5px;
		background:#fff;
}
#infomation .infoWaku .opImage{
	float:right;
	width:40%;
}
#infomation .infoWaku .opImage img{
	width:100%;
}
#infomation p.tel{
    margin-top: 8px;
}
/*スケジュール*/
#schedule .scheduleInner{
	background:url(../../img/topics/desert/mapBg.jpg) no-repeat;
	background-position:10%;
	padding:8px;
	margin:8px auto;
	font-size:1em;
	line-height:1.2em;
}
#schedule .scheduleInner li{
	margin-bottom:5px;
	clear:both;
}
#schedule .scheduleInner li span{
	width:20%;
	display:block;
	float:left;
	font-weight:bold;
}
#schedule .scheduleInner p{
	margin-top:8px;
	font-size:0.8em;
}
/*情報*/
#infomation .infoCont{
	margin:8px auto;
	padding:5px;
	font-size:1.1em;
	line-height:1.2em;
}
#infomation .infoWaku{
	border:1px solid #666;
	margin-top:8px;
	padding:5px;
		background:#fff;
}
#infomation .infoWaku .opImage{
	float:right;
}
#infomation p.tel{
	text-align: center;
    margin-top: 8px;
}
#islandInfo .infoCont{
	float: none;
	width: 100%;
}
#islandInfo .islandInfoInner {
	padding:8px;
	line-height:1.2em;
	flex-direction: column;
}
.infoMapKerama{
	float: none;
    width: 80%;
    margin: auto;
    text-align: center;
}
#islandInfo .infoMap{
	background:url(../../img/topics/desert/mapIslandInner.png) no-repeat;
	background-size:100% 100%;
	background-position:center;
	position:relative;
	width:80%;
	height:250px;	
	margin:8px auto;
}
#islandInfo .infoMapKume{
	background:url(../../img/topics/desert/mapIslandInner2.png) no-repeat;
	background-size:100% 100%;
	position:relative;
	width:45%;
	float:left;
	height:150px;	
	margin-right:8px;
}

#islandInfo .infoMap p{
	position:absolute;
	top:13%;
	left:8%;
}
#islandInfo .infoMap.infoMapSesoko p{
	top:20%;
	left:10%;
}
#islandInfo .infoMap.infoMapHamahiga p{
	top:65%;
	left:60%;
}
#islandInfo .infoMap.infoMapKourijima p{
	top:0%;
	left:60%;
}

#islandInfo .infoMapYoutou{
	background:url(../../img/topics/desert/mapIslandInner.png) no-repeat;
	background-size:100% 100%;
	background-position:center;
	position:relative;
	width:80%;
	height:250px;	
	margin-right:8px;
}
#islandInfo .infoMapYoutou p{
	position:absolute;
	top:18%;
	left:12%;
}
#islandInfo dt{
	font-weight:bold;
	margin-top:8px;
}
#islandInfo dd.infoLink {
	width: 300px;
    margin: 5px auto 8px;
}
#islandInfo dd.infoLink a{
	background:#f90;
	border-radius:5px;
	color:#fff;
	text-align:center;
	padding:6px 0;
	display:block;
	font-size:1em;
	border:#f90 2px solid;	
}
#islandInfo dd.infoLink a:hover{
	background:#fff;
	border:#f90 2px solid;
	color:#f90;
}

/*検索*/
#searchTour ul {
    display: -webkit-flex;
    display: flex;
}
#searchTour li:first-child {
    border-right: 1px dotted #999;
}
#searchTour li {
    -webkit-flex: 1 1 100px;
    flex: 1 1 100px;
    text-align: center;
    padding: 8px 0;
}
#searchTour li a{
	text-decoration: underline;
}
#searchTour p#searchDate{
	padding:0px 0px 0px 8px;
	border-left:5px solid #666;
}
#selectDateBox{
	padding:8px 0;
}
#selectDateBox select {
    padding: 5px;
    height: auto!important;
    border: 1px solid #666;
    font-size: 1.1em;
    margin-left: 5px;
}
#selectDateBox form button.searchDateBtn{
	padding: 5px 16px;
    background: #f90;
    color: #fff;
    font-weight: bold;
    font-size: 1.1em;
    margin-left: 5px;
    display: inline-block;
    margin-top: 5px;
    border-radius: 5px
}
/*Q&A*/
#QandA dl{
	font-size:13px;
	line-height:1.5em;
	padding:10px;
	background-color:#FFF;
	width: 90%;
	padding: 8px;
	margin: 8px auto;
}
#QandA dt{
	
	margin-bottom:5px;
	padding-bottom:5px;
}
#QandA dd{
	margin-bottom:10px;
	border-bottom:#999999 1px dotted;
	padding-bottom:5px;
}
#QandA dt:before{
	content:"Q";
	background:#666;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    border-radius: 20px;
	color:#FFFFFF;
	padding:3px 5px;
	margin-right:5px;
	font-size:12px;
	font-weight:bold;
}
#QandA dd:before{
	content:"A";
	background:#06c;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    border-radius: 20px;
	color:#FFFFFF;
	padding:3px 5px;
	margin-right:5px;
	font-size:12px;
	font-weight:bold;
}

.timeTable.introCont{
	display: none;
}
#acMenu.toggleBtn p{
	border:1px solid #666;
	border-radius: 1000px;
	width:80%;
	margin:8px auto;
	padding:8px 0;
	text-align: center;
}
#acMenu.toggleBtn span:after{
	font-family: FontAwesome;
  	content: '\f055';
  	font-weight: 900;
}

.timeTable .tableTtl{
	background: #666;
    color: #fff;
    text-align: center;
    padding: 5px 0;
    border-radius: 0!important;
    width: 100%!important;
}
.timeTable{
	overflow-x: scroll;
}
.timeTable table{
	width: 180%;
	margin-bottom:8px;
	font-size:0.8em;
}
.timeTable tr {
    border-bottom: 1px dotted #666;
}
.timeTable th {
    border: none;
    text-align: left;
    font-weight: bold;
    vertical-align: middle;
    background: #eee;
    padding: 5px;
}
.timeTable .shipCode th{
	text-align: center!important;
	color:blue;
}
.timeTable .tableTtl td{
	padding:3px;
	border: none;
	border: 1px solid #666;
    color: #000;
}
#islandTour .timeTable .planListBtn a{
	font-size: 1em;
	padding:5px;
}
#islandTour .timeTable ul{
	display:table;
	width:100%;
	table-layout: fixed;
}
#islandTour .timeTable li.planListBtn {
    display:table-cell;
    padding: 0 2px;
    margin: 0!important;
    box-sizing: border-box;
}
#islandInfo.infoKerama .infoCont{
	width: 100%;
}
/*絞り込み追加*/
.selectInner{
	width:96%;
	margin:8px auto;
	padding:8px;
	background:#fff;
	border:1px solid #666;
	    box-sizing: border-box;
}
.selectInner label{
	margin-right:3px;
	cursor: pointer;
}
.selectInner input{
	margin-right:2px;
}
.selectInner p{
	font-weight:bold;
	margin:5px 0;
}
#planList [class*="hidden-"] {display: none!important;}

.notice {
    background: #fff;
    border: 2px solid #c00;
    width: 95%;
    margin: 8px auto;
    padding: 8px;
}
.notice_ttl {
    font-weight: bold;
    text-align: center;
    margin-bottom: 8px;
}