@charset 'utf-8';

/************************************************************
							PC用
************************************************************/
@media screen and (min-width: 980px){



}


/************************************************************
					min769px－max979px
************************************************************/
@media screen /*and (min-width: 769px)*/ and (max-width: 979px){

#container, .w950,.w750{
	min-width: 100%;  
	width: 100%;
	margin: 0;
	padding: 0;
}

img{max-width:100%;}
/*br{display: none}*/

/*----------------------------------------------------------
					ヘッダー用
-----------------------------------------------------------*/
#header,
#header .inner  {
	width: 100%;
	margin: 0;
	padding: 0;
}
#header ul.gnav4 li.jtour,
#header ul.gnav4 li.jtour_nav01,
#header ul.gnav4 li.jtour_nav02,
#pankuzu{
	display: none;
}

#header .logo,
#header .copy{
	left: 10px;	
}
#header ul.txtnav{
	padding-right: 10px;
}

/*---------------------------------------------コンテナ用★★★★★★★★-----*/


/*---------------------------------------------------------------------------------------menu*/
#menu{
	margin: 0 auto;
	padding: 1em 0.5em 2em;
}
/*------------------------------------------------------------------------------------調整------*/
.ttl_box p{	padding: 0; }


/*---------------------------------------------------------------------------------------spot*/
#spot .ttl_box p {
	padding-top: 1.5em;
	padding-bottom:0.5em;
}
#spot .box_C {
	padding: 1em;
	font-size: 100%;
}
#spot .flex_33 dt {	min-height: 47.5%;}
/*---------------------------------------------------------------------------------------food*/	
.foods_box01{position: relative; padding: 55% 50%;}
.coment.paella{	top:0;}
.photo.halo{	bottom:6em;}

.restaurant {
	width: 50%;
	background: url(../img/food_ball.png) no-repeat top left;
	background-size:  100%;
	padding: 3.5em 1.5em 1em !important;
	font-size: 95%;
}	
/*---------------------------------------------------------------------------------------insta*/	

#insta .box_A .coment {	padding:0.5em;}
#insta .box_B .coment {	padding: 0.5em;}
.oakada .coment{	top:0; }
/*--------------------------------------------------------------------------booking*/		
.booking{
	margin: 5em auto;
	background:url(../img/line.png)  no-repeat top center/80%;
}
	
	
	
}




/************************************************************
					タブレット対応
************************************************************/
@media screen /*and (min-width:600px) */and (max-width:768px)  {

#container{
	min-width: 100%;  
	width: 100%;
	margin: 0;
	padding: 0;
}

img{
    width /***/: auto;
    max-width: 100%;
    height: auto;
}
.w950{
    width: 100%;
    margin: 0;
/*    padding: 0 2%;*/
}

/* tb用画像 */
.pc {display: none;}
.tb {display: block;}
.sp {display: none;}

/* 非表示指定 */
#container{background: none;}
/*br{display: none}*/
/*.left {	float: none;}
.right { float: none;}*/
#breadcrumbs,#pankuzu {display: none;}

/*--------------------------------------------------- ヘッダー用*/
#header,
#header .inner  {
	width: 100%;
	margin: 0;
	padding: 0;
}
#header ul.gnav4 li.jtour,
#header ul.gnav4 li.jtour_nav01,
#header ul.gnav4 li.jtour_nav02,
#pankuzu{
	display: none;
}

#header .logo,
#header .copy{
	left: 10px;	
}
#header ul.txtnav{
	padding-right: 10px;
}
/*--------------------------------------------------- contact */
#contact .w950{	padding: 50px 2%;}
#contact .infoBox{width: 100%;padding-top: 20px;}

#contact .circle{display:none;}
#contact dl{margin-bottom: 15px;width: 100%;}
#contact dd {margin: 0 0 3px 0;}
#contact dd span {width: 120px;margin-right: 10px;}

/*--------------------------------------------------- page-top */
#page-top img,
#page-top a{
    width: 80%;
    padding: 7% 0;
    border-radius: 2px;
}

/*---------------------------------------------コンテナ用★★★★★★★★-----*/
/*---------------------------------------------------------------------main*/

#main {background: none;}
#main .w950{
	padding: 0;
	position: static;
	height: auto;
}
#main h3 {
	background: none;
	width: 100%;
	max-width: 750px;
}
#main h4{	width:95%;}
#main h4 span{	font-size: 1.4em;}
#main .coment br{display: none;}
#main .coment {	padding: 1em 2em 2em; text-align: left;}
	

/*-------------------skd*/
.skd_box {	margin-top: 0em; padding: 1em;}
.skd_box .flex_container{display:block;}
.skd_box h5{	left: 0;	right: 0;}
.skd_box table {
	margin-top:3em;
	width: 100%;
	margin-left: 0;
	margin-right: 0;
	}
.skd_box table caption{	text-align: left;}
.skd_box table caption img{	top:-3em;}
.skd_box table caption.skd_01 img {	left:21%;}
.skd_box table caption.skd_02 img {	left:30%;	top:-2.5em;}
/*---------------------------------------------------------------------------------------intro*/
#intro .ttl .coment {
	width: 95%;
	margin: 40% 1em 0;
	line-height: 1.4;
}
/*------------------------------------------------------------------------------------調整------*/
.ttl_box p{	font-size: 1.1em;}
.box_B{  background-color: #FFF; margin-top: 1em;}  
.box_B .photo{	width: 60%;}
.box_B .coment{	padding:0.5em;	line-height: normal;}
/*---------------------------------------------------------------------------------------spot*/
#spot .ttl_box p {
	padding-top: 0.5em;
	padding-bottom: 0em;
	line-height: normal;
}	
#spot .box_C {	line-height: 1.5;}
#spot .flex_33 dt {	
	line-height: 1.5;
	padding: 0.5em;
}

/*---------------------------------------------------------------------------------------shopping*/	

#shopping .box_B .left,#shopping .box_B .right{	float: none;}	

#shopping .box_B .coment{	width: 100% !important;}
#shopping .box_B .photo{
	width: 60% !important;
	margin: 0 auto;
}
#shopping .box_A .coment{	padding: 1em ;}
#shopping .glorietta {
	background: 
		url(../img/sp_2.jpg) no-repeat right 20% top 2em,
		#FFF;
	background-size: 
		100%,
		100%;
	padding: 80% 0 0;
}


/*---------------------------------------------------------------------------------------food*/	
#food .coment{line-height: 1.4;	}

.foods_box01{padding: 68% 50%;}

	
.coment.paella{
	width: 50%;
	top:0;
	right: -0.5em;
}
.coment.halo{
	font-size: 95%;
	line-height: 1.3;
	width: 60%;
	bottom:-1em;
	left: -1em;
}
.photo.halo{
	width: 40%;
	bottom:7em;
	left: 1em;
}
.coment.sea{
	width: 60%;
	bottom:-1em;
	right: -1em;
	line-height: 1;
}
.photo.sea{
	width: 53%;
	top:37%;
	right: 0.5em;
}

.foods_box02{
/*	position: relative;*/
	padding: 3em 0 0;
	background: url(../img/food_4.jpg) no-repeat right top,#FFF;
	background-size: 100%,100%;
}

.foods_box02 dt{
	padding: 0.5em !important;
	font-size: 100%;
	margin-bottom:50%;
	background: rgba(255,255,255,0.70)
}
.foods_box02 dt span{	background:none;}

.restaurant {
	width: 60%;
	margin-left: 40%;;
	background:rgba(255,239,186,0.50) ;
	background-size:  100%;
	padding:1em !important;
	font-size: 90%;
}	

/*---------------------------------------------------------------------------------------insta*/	
#insta .ttl_box p {
	padding-top: 0.5em;
	padding-bottom: 0.5em;
}
.oakada {
	background:		url(../img/insta_3.jpg) no-repeat left top 4.5em,	#FFF;
	background-size: 85%,100%;
	position: relative;
	padding: 57% 0; 
}
.oakada .coment{
	right:0;
	top:0; 
	width: 100%;
	line-height: 1.3;
}
.oakada .photo{	width: 65%;}	
	
/*--------------------------------------------------------------------------booking*/		
.booking{
	margin: 5em auto;
	background:url(../img/line.png)  no-repeat top center/95%;
}	
.booking dl{	width: 95%;}	
	
}
	
	
	
	
	




/************************************************************
						スマホ対応
************************************************************/
@media screen and (max-width:599px)  {

#container{
	min-width: 100%;  
	width:100%; 
	margin: 0;
	padding: 0;
}
.w950{
	width: 100%;
	padding-left: 2%;
	padding-right: 2%;
}

/*--- 非表示 ---*/
br{display: none}
img{max-width:100%;}
.flex_container{display:block;}

.left {	float: none;}
.right { float: none;}

#breadcrumbs,#pankuzu {display: none;}
.pc{display: none;}
.tb{display: block;}
.sp{display: block;}


/*--------------------------------------------------- contact */
#contact .w950{	padding: 5% 2%;}
#contact .infoBox{width: 100%;padding-top: 20px;}

#contact .circle{display:none;}
#contact dl{margin-bottom: 15px;width: 100%;}
#contact dd {margin: 0 0 3px 0;}
#contact dd span {width: 120px;margin-right: 10px;}
/*--------------------------------------------------- page-top */
#page-top img,
#page-top a{
	width:80%;
	height:auto;
	border-radius: 2px;
	padding:7% 0;
}
/*-----------------------------------------------------------
		スマホ対応 ヘッダー＆フッター
-----------------------------------------------------------*/
/* 非表示 */
#header h1.copy,#sub_menu,.txtnav,
#header ul.gnav4 li.jtour,
#header ul.gnav4 li.jtour_nav01,
#header ul.gnav4 li.jtour_nav02,
#header ul.gnav4 li.jwcruise,
#header ul.gnav4 li.jwcruise_nav01,
#header ul.gnav4 li.wtour,
#pankuzu{display: none;}

/* wtour調整 */
body.wtour #header {
	height:auto;
	margin-bottom:50px;
	background: url(http://www.mwt.co.jp/kaigai/common/img/line_wtour.gif) repeat-x center bottom;
}
body.wtour #header .inner {width:100%; height:66px;}

body.wtour #header .logo {top:5px; left:5px;}
body.wtour #header .season {
	display:block;
	position:absolute;
	right:0;
	left:auto;
}

body.wtour #header ul.gnav4 {
	position:absolute;
	bottom:-45px;
	left:5px;
}
body.wtour #header ul.gnav4 li{
	float: left;
	padding: 2%;
	text-align: center;
	font-weight: bold;
}
body.wtour #header ul.gnav4 li.wtour_nav01 {
    width: 24%;
    border: 2px solid #196bb8;
    background: #d2ebff;
    color: #196bb8;
    padding: 8px 0;
}
body.wtour #header ul.gnav4 li.wtour_nav01 a {
	width:100%;
	height:auto;
	background:none;
	text-indent:0;
}
body.wtour #header ul.gnav4 li.wtour_nav02 {
	width:76%;
    border: 2px solid #CCCCCC;
    padding: 8px 0;
}
body.wtour #header ul.gnav4 li.wtour_nav02 a {
	width:100%;
	background:none;
	text-indent:0;
    color: #0066cc;
}
body.wtour #header ul.gnav4 li.wtour_nav01 a,
body.wtour #header ul.gnav4 li.wtour_nav01 a:hover,
body.wtour #header ul.gnav4 li.wtour_nav02 a,
body.wtour #header ul.gnav4 li.wtour_nav02 a:hover {
	background:none;
	width:auto;
	height:auto;
	text-align:center;
	margin:0;
	text-decoration:none;
	font-weight:bold;
}
body.wtour #header ul.gnav4 li.wtour_nav02 a:hover {color: #ff6600;}


/*-------------------------- footer-kaigai*/
#footer-kaigai{
    padding: 5% 0 !important;
}

/*---------------------------------------------コンテナ用★★★★★★★★-----*/
/*---------------------------------------------------------------------main*/

#main .coment {	padding: 1em 1em 4em;}
#main h4{	height: auto;}	
	
/*-------------------skd*/
.skd_box table {	margin-top:5em;	width: 100%;}
.skd_box table caption img{	top:-4.5em;}
.skd_box table caption.skd_01 img {	left:50%; top:-3.5em;}
.skd_box table caption.skd_02 img {	left:52%; top:-3.5em;}
	
.skd_box table caption img{max-width: 54%;}	
/*---------------------------------------------------------------------------------------intro*/

#intro {
	background: url(../img/intro.png) center top -5em no-repeat;
	}
#intro h4 {
	background: url(../img/intro_ttl.png) no-repeat  top 1em left -0.5em/100%;
	margin: 1em 0 0;
}
/*---------------------------------------------------------------------------------------menu*/
#menu li {
	width: 100%;
	line-height: 1.5;
	margin:0.5em auto;
}

#menu li:hover{
	width:calc(50%);
	height:calc(50%);	
}

/*------------------------------------------------------------------------------------調整------*/
#spot br,#shopping br,#food br,#insta br {display: block}	
.flex_hafe{	width: 100%;	margin: 0 auto 10px;}
.flex_65{	width: 100%;	margin: 0 auto 10px;}
.flex_35{	width: 100%;	margin: 0 auto 10px;} 
.flex_33{	width: 100%;	margin: 0 auto 10px;} 
.box_B{  background-color: #FFF; margin-top: 1em;}  
.box_B .photo{	width: 100%;}
.box_B .coment{	padding:0.5em;	line-height: normal;	width: 100%;}
.box_A .photo{	width: 100%;}
#spot .ttl_box p,#shopping .ttl_box p,#food .ttl_box p,#insta .ttl_box p {
	padding-top: 0.5em;
	padding-bottom: 0em;
	line-height: normal;
}
/*---------------------------------------------------------------------------------------spot*/	
#spot .box_C {	padding: 1em 1em 80%;}	
/*---------------------------------------------------------------------------------------shopping*/	
#shopping .box_B .photo{	width: 80% !important;}
#shopping .glorietta {
	background: 
		url(../img/sp_2.jpg) no-repeat right 20% top 0,
		#FFF;
	background-size: 
		100%,
		100%;
	padding: 58% 0 0;
}
/*---------------------------------------------------------------------------------------food*/	
.foods_box01{padding: 75% 50%;}
.foods_box01 .coment{ background:rgba(255,255,255,0.71);	padding: 0; }
.coment.paella{
	width: 97%;
	margin: auto;
	top:0.5em;
	left:0;
	right:0 ;
	z-index: 51;
}
.photo.paella{	z-index: 30;}
.coment.halo{
	bottom:0.5em;
	left:0.5em;
	width: 40%; 
	z-index: 53;
	}
.photo.halo{
	width: 45%;
	bottom:6em;
	left: 0;
	z-index: 40;
}
.coment.sea{
	width: 50%;
	bottom:2em;
	right: 0.5em;
	line-height: 1;
	z-index: 52;
}
.photo.sea{
	width: 70%;
	top:47%;
	z-index: 3;
}
.foods_box02 .flex_container{display:flex;}
.foods_box02 .flex_container p{border: 5px #FFF solid;}
.foods_box02 dt{	margin-bottom:70%;}
	
/*---------------------------------------------------------------------------------------insta*/	

.oakada {	padding: 55% 0; }
.oakada .photo{	width: 85%;}	

	
/*--------------------------------------------------------------------------booking*/		
.booking{
	margin: 5em auto;
	background:url(../img/line.png)  no-repeat top center/95%;
}	
.booking dl{	width: 95%;}	




}