@charset "utf-8";

@font-face {
	font-family: 'Noto Sans Japanese';
	font-style: normal;
	font-weight: 200;
	src: url(//fonts.gstatic.com/ea/notosansjapanese/v6/NotoSansJP-Light.woff2) format('woff2'),
		url(//fonts.gstatic.com/ea/notosansjapanese/v6/NotoSansJP-Light.woff) format('woff'),
		url(//fonts.gstatic.com/ea/notosansjapanese/v6/NotoSansJP-Light.otf) format('opentype');
}
@font-face {
	font-family: 'Noto Sans Japanese';
	font-style: normal;
	font-weight: 400;
	src: local('NotoSansJP-Regular.otf'),
		url(//fonts.gstatic.com/ea/notosansjapanese/v6/NotoSansJP-Regular.woff2) format('woff2'),
		url(//fonts.gstatic.com/ea/notosansjapanese/v6/NotoSansJP-Regular.woff) format('woff'),
		url(//fonts.gstatic.com/ea/notosansjapanese/v6/NotoSansJP-Regular.otf) format('opentype');
}
@font-face {
	font-family: 'Noto Sans Japanese';
	font-style: normal;
	font-weight: 700;
	src: url(//fonts.gstatic.com/ea/notosansjapanese/v6/NotoSansJP-Bold.woff2) format('woff2'),
		url(//fonts.gstatic.com/ea/notosansjapanese/v6/NotoSansJP-Bold.woff) format('woff'),
		url(//fonts.gstatic.com/ea/notosansjapanese/v6/NotoSansJP-Bold.otf) format('opentype');
}

h2.origin { font-size:60px; color:#00A7EA; text-align:center; padding:40px 0 25px; letter-spacing:-2px; }
h2.origin span { font-size:80%; font-weight:200; }
@media (min-width: 0px) and (max-width: 570px) {
	h2.origin { font-size:27px; font-weight:400; }
	h2.origin span { font-weight:400; }
}

.noto { font-family:"Noto Sans Japanese","メイリオ",Meiryo,Droid Sans,HiraKakuProN-W3,HiraKakuPro-W3,"ヒラギノ角ゴ ProN W3","ヒラギノ角ゴ Pro W3","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic ProN","Lucida Grande","Lucida Sans","Lucida Sans Unicode","Trebuchet MS","Droid Sans","ＭＳ Ｐゴシック","MS PGothic",sans-serif; font-weight:200; }
.noto em { font-weight:400; font-style:normal; }
.noto strong { font-weight:700; }

#areanavi { width:100%; overflow:hidden; position:relative; background-color:#333; }
#areanavi,
#areanavi #dom-areanavi,
#areanavi #int-areanavi { min-height:400px; }
#areanavi #dom-areanavi,
#areanavi #int-areanavi { width:80%; transform:skewX(-20deg); overflow:hidden; }
#areanavi #dom-areanavi dl,
#areanavi #int-areanavi dl,
#areanavi .maplayer { transform:skewX(20deg); }
#areanavi div,
#areanavi div dl,
#areanavi div dt,
#areanavi div dd { transition:0.6s; }
#areanavi #dom-areanavi,
#areanavi #int-areanavi { position:absolute; top:0; width:60%; }
#areanavi #dom-areanavi { background:url("/travel/image/areanavi_bg_domtour.jpg") no-repeat top left; left:-10%; }
#areanavi #int-areanavi { background:url("/travel/image/areanavi_bg_inttour.jpg") no-repeat top right; right:-10%; }

#areanavi .maplayer { position:absolute; }
#areanavi #dom-areanavi .maplayer { top:0; left:50px; }
#areanavi #int-areanavi .maplayer { top:0; right:80px; }
#areanavi #dom-areanavi .maplayer img { min-width:520px; }
#areanavi #int-areanavi .maplayer img { min-width:746px; }

#areanavi #dom-areanavi dl,
#areanavi #int-areanavi dl { position:absolute; top:50px; }
#areanavi #dom-areanavi dl { width:590px; left:-500px; }
#areanavi #int-areanavi dl { width:590px; right:-500px; }
#areanavi #dom-areanavi dt,
#areanavi #int-areanavi dt { position:absolute; top:106px; font-size:60px; letter-spacing:-2px; color:#fff;  }
#areanavi #dom-areanavi dt { left:665px; width:6em; }
#areanavi #int-areanavi dt { right:590px; width:6em; }
#areanavi #dom-areanavi dd,
#areanavi #int-areanavi dd,
#areanavi #dom-areanavi dd a,
#areanavi #int-areanavi dd a { width:120px; height:120px; }
#areanavi #dom-areanavi dd,
#areanavi #int-areanavi dd { opacity:0; display:inline-block;*display:inline;*zoom:1; margin:20px 10px; vertical-align:middle; transform:scale(0.4,0.4); }
#areanavi #dom-areanavi dd a,
#areanavi #int-areanavi dd a { display:block; border-radius:60px; border:2px solid #fff; overflow:hidden; background-color:#f0f0f0; text-align:center; font-size:14px; font-weight:400; box-shadow:0 4px 4px rgba(0,0,0,.3); transition:.15s; transform-origin:center middle; }
#areanavi #dom-areanavi dd a:hover,
#areanavi #int-areanavi dd a:hover { transform:scale(1.3,1.3); box-shadow:0 12px 16px rgba(0,0,0,.2); }

#areanavi #dom-areanavi.hover { width:100%; left:-10%; }
#areanavi #int-areanavi.hover { width:100%; right:-10%; }
#areanavi #dom-areanavi.hover .maplayer { left:100px; }
#areanavi #int-areanavi.hover .maplayer { right:120px; }
#areanavi #dom-areanavi.hover dl { left:325px; }
#areanavi #int-areanavi.hover dl { right:300px; }
#areanavi #dom-areanavi.hover dt,
#areanavi #int-areanavi.hover dt { top:130px; font-size:35px; }
#areanavi #dom-areanavi.hover dt { left:-200px; }
#areanavi #int-areanavi.hover dt { right:-200px; }
#areanavi #dom-areanavi.hover dd,
#areanavi #int-areanavi.hover dd { opacity:1; transform:scale(1,1); }

#areanavi #dom-areanavi.thin,
#areanavi #int-areanavi.thin { width:20%; opacity:.7; box-shadow:0 0 15px rgba(0,0,0,.6) inset; }
#areanavi #dom-areanavi.thin dt,
#areanavi #int-areanavi.thin dt { top:130px; font-size:35px; opacity:.2; }
#areanavi #dom-areanavi.thin dd,
#areanavi #int-areanavi.thin dd { opacity:0; }

@media (min-width: 0px) and (max-width: 900px) {
	#areanavi { background-color:#fff; width:auto; }
	#areanavi #dom-areanavi,
	#areanavi #int-areanavi { transform:skewX(0deg); background-image:none; background-color:#fff; position:static; width:auto; min-height:0; }
	#areanavi .maplayer { display:none; }
	#areanavi #dom-areanavi dl,
	#areanavi #int-areanavi dl { transform:skewX(0deg); position:static; width:auto; left:0; top:0; letter-spacing:-.4em; }
	#areanavi #dom-areanavi dl dt,
	#areanavi #int-areanavi dl dt,
	#areanavi #dom-areanavi dl dd,
	#areanavi #int-areanavi dl dd { letter-spacing:0; }
	#areanavi #dom-areanavi dt,
	#areanavi #int-areanavi dt { position:static; font-size:20px; width:auto; padding:5px; }
	#areanavi #dom-areanavi dt { background-color:#5785E3; }
	#areanavi #int-areanavi dt { background-color:#FFA147; }
	#areanavi #dom-areanavi dd,
	#areanavi #int-areanavi dd { opacity:1; display:inline-block;*display:inline;*zoom:1; margin:20px 10px; vertical-align:middle; transform:scale(1,1); margin:4px 0; width:25%; height:auto; }
	#areanavi #dom-areanavi dd a,
	#areanavi #int-areanavi dd a { border-radius:4px; width:100%; height:auto; box-shadow:none; }
	#areanavi #dom-areanavi dd a:hover,
	#areanavi #int-areanavi dd a:hover { transform:scale(1,1); box-shadow:none; }

	#areanavi #dom-areanavi.hover,
	#areanavi #int-areanavi.hover { width:auto; left:0; }
	#areanavi #dom-areanavi.hover dl { left:0; }
	#areanavi #int-areanavi.hover dl { right:0; }
	#areanavi #dom-areanavi.hover dt,
	#areanavi #int-areanavi.hover dt { top:0; font-size:20px; }
	#areanavi #dom-areanavi.hover dt { left:0; }
	#areanavi #int-areanavi.hover dt { right:0; }
	#areanavi #dom-areanavi.hover dd,
	#areanavi #int-areanavi.hover dd {  }

	#areanavi #dom-areanavi.thin,
	#areanavi #int-areanavi.thin { width:auto; opacity:1; box-shadow:none; }
	#areanavi #dom-areanavi.thin dt,
	#areanavi #int-areanavi.thin dt { top:0; font-size:20px; opacity:1; }
	#areanavi #dom-areanavi.thin dd,
	#areanavi #int-areanavi.thin dd { opacity:1; }

}
@media (min-width: 0px) and (max-width: 570px) {
	#areanavi #dom-areanavi dd,
	#areanavi #int-areanavi dd { width:33.33333333%; }
	
}


#stylenavi {}
#stylenavi .category-box .thumb { float:left; width:30%; padding:20px; }
#stylenavi .category-box .thumb img { border-radius:50% 50% 50% 50%; }
#stylenavi .category-box .detail { float:right; width:69%; color:#383838; padding-top:40px;  }
#stylenavi .category-box .detail dt { font-size:37px; }
#stylenavi .category-box .detail .text { margin-bottom:20px; }
#stylenavi .category-box .detail .text p { font-size:20px; line-height:1.6; }
#stylenavi .category-box .detail .btn {  }
#stylenavi .category-box .detail .btn ul {}
#stylenavi .category-box .detail .btn ul li { display:inline-block; *display:inline; *zoom:1;min-width:47%; vertical-align:top; }
#stylenavi .category-box .detail .btn ul li a { display:block; padding:8px 0; margin:5px;  border:2px solid #ccc; font-size:15px; font-weight:bold; text-decoration:none; text-align:center; transition:.2s; }
#stylenavi .category-box .detail .btn ul li a:hover {  }
#stylenavi .category-box .detail .btn ul li.domtour {  }
#stylenavi .category-box .detail .btn ul li.inttour {  }
#stylenavi .category-box .detail .btn ul li.domtour a { border-color:#5583E1; background-color:#eff8ff; color:#5583E1; }
#stylenavi .category-box .detail .btn ul li.inttour a { border-color:#F0892D; background-color:#fff7f5; color:#F0892D; }
#stylenavi .category-box .detail .btn ul li.domtour a:hover { background-color:#5583E1; color:#fff; }
#stylenavi .category-box .detail .btn ul li.inttour a:hover { background-color:#F0892D; color:#fff; }

@media (min-width: 0px) and (max-width: 570px) {
	#stylenavi-ttl { border-top:2px solid #dadada; margin-top:30px;}
	#stylenavi {  }
	#stylenavi .category-box {
		border:1px solid #bcd; border-radius:4px;
		padding-bottom:16px;
		background: #ffffff;
		background: -webkit-linear-gradient(top, #ffffff 0%,#f4fbfc 71%);
		background: linear-gradient(to bottom, #ffffff 0%,#f4fbfc 71%);
		box-shadow:2px 2px 0 rgba(255,255,255,1) inset, -1px -1px 1px rgba(0,0,0,.05) inset;
	}
	#stylenavi .category-box .thumb { float:none; width:60%; padding:0; margin:5% 20%; }
	#stylenavi .category-box .thumb img { border-radius:50% 50% 50% 50%; }
	#stylenavi .category-box .detail { float:none; width:auto; color:#383838; padding-top:10px;  }
	#stylenavi .category-box .detail dt { font-size:22px; text-align:center; font-weight:bold; margin-bottom:12px; }
	#stylenavi .category-box .detail .text { }
	#stylenavi .category-box .detail .text p { font-size:14px; line-height:1.5; }
	#stylenavi .category-box .detail .btn ul {}
	#stylenavi .category-box .detail .btn ul li { display:block; margin:5px 10px; }
	#stylenavi .category-box .detail .btn ul li a { border:1px solid #ccc; border-radius:2px; font-size:16px; font-weight:normal; }
	
	#pickup-wrap ul li a dl dd.image-box { max-height: 220px!important;}
}

	

#pickup-wrap {}
#pickup-wrap div {}
#pickup-wrap div ul { font-size:0; }
#pickup-wrap div ul li { display:inline-block; zoom:1; vertical-align:top; width:25%; text-align:left; margin-bottom:15px; }
#pickup-wrap div ul li a { display:block; margin:0 10px; text-decoration:none; }
#pickup-wrap div ul li a:hover { text-decoration:underline; }
#pickup-wrap div ul li a img { width:100%; box-shadow:0 2px 2px rgba(0,0,0,.2); }
#pickup-wrap div ul li a:hover img { opacity:.8; }
#pickup-wrap div ul li a span { display:block; font-size:14px; padding:5px 0; }
@media (min-width: 0px) and (max-width: 570px) {
	#pickup-wrap div ul li { display:block; width:100%!important; }
	.res-coolumn-box res-coolumn-4-box { display: block; width: 100%;}
	#pickup-wrap .title-box.h2 .ttl-text { font-size: 22px!important;}
}


/* 200330 追加 */
#pickup-wrap .title-box .h2 {
	margin-top: 60px;
	word-wrap: break-word;
	overflow-wrap: break-word;
}

#pickup-wrap .title-box.h2 .ttl-text {
	font-size: 30px;
	line-height: 1.3;
	position: relative;
	padding-bottom: 10px;
	font-weight: 400;
}

#pickup-wrap .ttl-type-02-01 {
	border: none;
}

#pickup-wrap h2 {
	border: none;
}


#pickup-wrap ul li a dl dt:before {
	content: "";
	display: inline-block;
	vertical-align: top;
	margin-top: 3px;
	width: 12px;
	height: 12px;
	border-top: 2px solid #00146e;
	border-right: 2px solid #00146e;
	transform-origin: center;
	transform: rotateZ(45deg);
}

#pickup-wrap ul li a {
	margin:0;
}

#pickup-wrap ul li a dl {
	display: flex;
	flex-direction: column;
}

#pickup-wrap ul li a dl dd.image-box {
	order: 1;
	position: relative;
	max-height: 125px;
}

#pickup-wrap ul li a dl dt {
	order: 2;
	padding-top: 20px;
}

#pickup-wrap ul li a dl dd.text {
	order: 3;
	padding-left: 20px;
}

#pickup-wrap ul li a dl dt span {
	display: inline-block;
	font-size: 1.7rem;
	vertical-align: top;
	width: calc(100% - 25px);
	margin-left: 9px;
	line-height: 1.2;
}

#pickup-wrap .banner {
	width: 100%;
}

#pickup-wrap .category {
    position: absolute;
    bottom: 0;
    left: 0;
    padding: 5px 10px;
    background-color: rgba(255,255,255,.8);
    color: #333;
    font-size: 14px;
    line-height: 1;
}

#pickup-wrap ul li a dl dd.text p {
	display: block;
	font-size: 14px!important;
	line-height: 1.2;
	color: #333;
}

#pickup-inttour ul {
	margin-bottom: 35px;
}
/* /END 200330 */

/* ★PC4カラムSP2カラムの場合200331 */
/* @media (max-width: 570px) and (min-width: 0){
#pickup-wrap .res-contents {
 padding-left: 10px;
 padding-right: 10px;
 margin-left: 10px;
 margin-right: 10px;
 }

#pickup-wrap ul li {
 width: 47.2043%;
 margin-left: 2.7957%;
 }
}

#pickup-wrap ul li {
 float: left;
 width: 25%;
 margin-bottom: 20px;
} */

/* /END ★PC4カラムSP2カラムの場合200331 /*