@charset "EUC-JP";

/* -----------------------------------------------------------
CSS Information

File name:      top.css
Created:        2010-11-24
Style Info:     総合トップ配下
----------------------------------------------------------- */

/*
# u_header
*/

.u_header{
	border-bottom: 1px solid #f3f3f3;
}
.u_header_inner{
	border-bottom: 1px solid #ddd;
}
.u_header_low{
	width: 970px;
	padding: 10px;
	margin: 0 auto;
	font-size: 12px;
}
.u_header .logo{
	float: left;
	margin: 6px 15px 0 0;
}
.u_header .logo img{
	width: 140px;
	height: auto;
}
.u_header .tagline{
	position: relative;
	float: left;
	height: 40px;
	width: 260px;
	margin-top: 6px;
}
.u_header .tagline span{
	font-size: 14px;
	font-weight: bold;
}
.u_header .tagline .copy{
	position: absolute;
	bottom: 0;
	left: 0;
}
.u_header .tagline .badge{
	margin-bottom: 2px;
}

.u_header .l_navActionsWrap {
	max-width: 440px;
	padding-left: 5px;
}
.u_header .l_navActionsWrap .u_cellItem.is_greetingText .travelerName {
	width: 140px;
}
.u_header .search_navi{
	float: right;
	box-sizing: border-box;
	width: 45px;
	height: 45px;
	margin-top: 5px;
	border-right: 1px solid #e4e4e4;
	text-align: center;
}
.u_header .search_navi a,.u_header .search_navi a:link,.u_header .search_navi a:visited {
	display: block;
	color: #333;
}
.u_header .search_navi a:hover,.u_header .search_navi a:active {
	opacity: 0.8;
}
.u_header .search_navi a span{
	display: block;
  font-size: 9px;
	padding-top: 3px;
  text-align: center;
  white-space: nowrap;
}
.u_header .search_navi i{
	font-size: 22px;
	color: #aaa;
	padding-top: 3px;
}


/* サイドパネル広告のための設定（これがないとレイアウト崩れる） */
.u_sidePanel_layoutBox {
	display: flex;
	justify-content: center;
}

/* 
広告　トラマガ枠（module.cssから複製・移植）
*/
.u_tieupPickBox {
	display: flex;
	flex-flow: row wrap;
	justify-content: space-between;
}
.u_tieupPickBox li {
	float: left; /* 念のため */
	margin: 0 0 0 15px;
}
.u_tieupPickBox li:first-child {
	margin-left: 0;
}
.u_tieupPickBox li a {
	display: block;
}
/*広告枠のPRテキスト*/
.u_tieupPickBox li .prFortravel {
	margin-top: 5px;
	font-size: 11px;
	color: #999;
}
.u_tieupPickBox li .prFortravel span {
	display: inline-block;
	padding: 0 3px;
	border: solid 1px #ccc;
	border-radius: 2px;
	line-height: 1;
}
.u_tieupPickBox li .photo:hover {
	opacity: 0.8;
}
.u_tieupPickBox li .name {
	margin-top: 5px;
	font-weight: bold;
	font-size: 14px;
}
/* スライド下のマガジン枠 */
.u_tieupPickBox.is_colTwo li {
	/*MAC Safariではみ出るバグがあるため1％小さめにする*/
	width: 48%;
	margin-bottom: 20px;
}
.u_tieupPickBox.is_colTwo li:nth-child(3) {
	margin-left: 0;
}
.u_tieupPickBox.is_colTwo li .photo img {
	width: 215px;
	height: 160px;
}
/* 全体の幅が4カラムの時 */
.u_tieupPickBox.is_colFour {
	width: 950px;
	margin-bottom: 20px;
}
.u_tieupPickBox.is_colFour li {
	margin: 0 0 20px 20px;
}
.u_tieupPickBox.is_colFour li:first-child {
	margin-left: 20px;
}
.u_tieupPickBox.is_colFour li .photo img {
	width: 215px;
	height: 160px;
}
.u_tieupPickBox.is_colFour li .name {
	font-size: 1.1em;
}

/*
# u_pageContainer
*/

.u_pageContainer #top div.trouble_info{
	padding: 0 0 10px;
}

/*
# u_topContainer
*/

.u_topContainer{
	font-size: 12px;
	padding-bottom: 10px;
}


/*
# u_topTitle
*/

.u_topContainer .u_topTitle{
	background: #fff;
	border-bottom: 1px solid #ddd;
}
.u_topContainer .u_topTitle a{
	display: block;
	position: relative;
	padding: 15px 0;
	color: #333;
	font-size: 10px;
}
.u_topContainer .u_topTitle a .fa,
.u_topContainer .u_topTitle a .iconJapan {
	position: absolute;
	top: 13px;
	margin-right: 6px;
	color: #0098de;
	font-size: 20px;
	font-weight: normal;
}
.u_topContainer .u_topTitle a em {
	margin-left: 24px;
	font-size: 13px;
}
.u_topContainer .u_topTitle.is_point {
	padding: 0 0 5px;
	background: none;
	border-bottom: none;
}
.u_topContainer .u_topTitle.is_point a {
	display: flex;
	align-items: center;
	padding: 0;
	font-size: 14px;
}


/*
# u_navi
*/

.u_topContainer .u_navi .u_naviBox{
	margin-bottom: 15px;
	padding: 2px 5px;
	border: solid 5px #eee;
	border-radius: 4px;
}
.u_topContainer .u_navi .u_naviBox a{
	color: #333;
	font-weight: bold;
}
.u_topContainer .u_navi .u_naviBox a:hover{
	background: #f3f3f3;
	text-decoration: none;
}
.u_topContainer .u_navi .u_naviBox a:visited {
	color: #333;
}
.u_topContainer .u_navi .u_topNaviIcon{
	display: flex;
	border-bottom: 1px solid #ddd;
}
.u_topContainer .u_navi .u_topNaviIcon li{
	width: 33%;
	margin: 3px 0;
	text-align: center;
	display: inline;
	border-right: 1px solid #ddd;
}
.u_topContainer .u_navi .u_topNaviIcon li:last-child {
	border-right: none;
}
.u_topContainer .u_navi .u_topNaviIcon li a{
	display: block;
	margin: -3px 0;
	padding: 5px 0;
	font-size: 10px;
	line-height: 1.0;
}
.u_topContainer .u_navi .u_topNaviIcon li a .fa {
	display: block;
	margin-bottom: 3px;
	color: #0098de;
	font-size: 22px;
	font-weight: normal;
}
.u_topContainer .u_navi .u_topMenu li{
	border-bottom: 1px solid #ddd;
}
.u_topContainer .u_navi .u_topMenu li:last-child {
	border: none;
}
.u_topContainer .u_navi .u_topMenu li a{
	display: flex;
	align-items: center;
	position: relative;
	padding: 7px 4px;
	font-size: 13px;
}
.u_topContainer .u_topTitle a:after,
.u_topContainer .u_navi .u_topMenu li a:after {
	position: absolute;
	top: calc(50% - 6px);
	right: 0;
	font-family: 'Fontawesome';
	content: "\f054";
	color: #ccc;
	font-size: 12px;
	font-weight: normal;
	line-height: 1;
}
.u_topContainer .u_navi .u_topMenu li a .pointIcon,
.u_topContainer .u_topTitle.is_point .pointIcon {
	margin-left: 7px;
}
.u_topContainer .u_navi .u_pointBox {
	margin-bottom: 20px;
	padding: 8px 10px;
	background: #fff8da;
	border-radius: 4px;
	font-size: 12px;
}
.u_topContainer .u_navi .u_pointBox .pointLogo {
	margin-top: 3px;
	background: #fff;
	text-align: center;
}

/* SNS */
#top .u_officialSns .u_officialSnsButton {
	display: flex;
	align-items: center;
}
#top .u_officialSns .snsTitle {
  padding: 0 0 10px;
	font-size: 14px;
}
#top .u_officialSns .u_officialSnsButton .snsItem {
	width: 32px;
	margin-right: 16px;
	list-style: none;
}
#top .u_officialSns .u_officialSnsButton .snsItem .snsButton {
	display: block;
}


/*
# u_topSlide
*/

.u_topSlide .pic_recommend {
	background: #f6f6f6;
	width: 450px;
	height: 250px;
	position: relative;
	margin-bottom: 20px;
}
.u_topSlide .pic_recommend a {
	display: block;
}

/* The Nivo Slider styles */
.u_topSlide .pic_recommend .nivoSlider {
  position:relative;
  width:100%;
  height:auto;
  overflow: hidden;
  text-decoration:none;
}
.u_topSlide .pic_recommend .nivoSlider img {
  position:absolute;
  top:0px;
  left:0px !important;
  max-width: none;
}
.u_topSlide .pic_recommend .nivo-main-image {
  display: block !important;
  position: relative !important;
  width: 100% !important;
}
/* If an image is wrapped in a link */
.u_topSlide .pic_recommend .nivoSlider a.nivo-imageLink {
  position:absolute;
  top:0px;
  left:0px;
  width:100%;
  height:100%;
  border:0;
  padding:0;
  margin:0;
  z-index:6;
  display:none;
  background:white;
  opacity:0;
}
/* The slices and boxes in the Slider */
  .u_topSlide .pic_recommend .nivo-slice {
  display:block;
  position:absolute;
  z-index:5;
  height:100%;
  top:0;
}
.u_topSlide .pic_recommend .nivo-box {
  display:block;
  position:absolute;
  z-index:5;
}
.u_topSlide .pic_recommend .nivo-box img { display:block; }
/* Caption styles */
.u_topSlide .pic_recommend .nivo-caption {
  position:absolute;
  left:0px;
  bottom:0px;
  color:#fff;
  width:100%;
  z-index:8;
  padding: 5px 10px;
  opacity: 0.8;
  overflow: hidden;
  display: none;
  -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
  -moz-box-sizing: border-box;    /* Firefox, other Gecko */
  box-sizing: border-box;         /* Opera/IE 8+ */
}
.u_topSlide .pic_recommend .nivo-caption p {
  padding:5px;
  margin:0;
}
.u_topSlide .pic_recommend .nivo-caption a:hover {
  display:inline !important;
  text-decoration:none;
}
.u_topSlide .pic_recommend .nivo-html-caption {
  display:none;
}
/* Direction nav styles (e.g. Next & Prev) */
.u_topSlide .pic_recommend .nivo-directionNav a {
  position:absolute;
  top:50%;
  z-index:9;
  cursor:pointer;
	margin-top: -12px;
}
.u_topSlide .pic_recommend .nivo-prevNav {
  left:0px;
}
.u_topSlide .pic_recommend .nivo-nextNav {
  right:0px;
}
/* Control nav styles (e.g. 1,2,3...) */
.u_topSlide .pic_recommend .nivo-controlNav {
  position: absolute;
  top: 0;
  right:6px;
  z-index: 9;
  cursor: pointer;
}

.u_topSlide .pic_recommend .nivo-controlNav a {
  cursor:pointer;
}
.u_topSlide .pic_recommend .nivo-controlNav a.active {
  font-weight:bold;
}
.u_topSlide .pic_recommend .nivo-caption {
  width: 450px;
  padding: 15px 0 7px;
background: -moz-linear-gradient(top,  rgba(0,0,0,0) 0%, rgba(0,0,0,0.4) 67%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(0,0,0,0)), color-stop(67%,rgba(0,0,0,0.4))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  rgba(0,0,0,0) 0%,rgba(0,0,0,0.4) 67%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  rgba(0,0,0,0) 0%,rgba(0,0,0,0.4) 67%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  rgba(0,0,0,0) 0%,rgba(0,0,0,0.4) 67%); /* IE10+ */
background: linear-gradient(to bottom,  rgba(0,0,0,0) 0%,rgba(0,0,0,0.4) 67%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#4d000000',GradientType=0 ); /* IE6-9 */
  opacity: 100;
  overflow: visible;
}
.u_topSlide .pic_recommend a:hover .nivo-caption {
  text-decoration: none;
}
.u_topSlide .pic_recommend dl {
	text-decoration: none;
  text-shadow: 1px 1px 0 #000;
	-moz-text-shadow: 1px 0 0 #000;
	-webkit-text-shadow: 1px 0 0 #000;
  padding: 0 5px 0 10px;
}
.u_topSlide .pic_recommend .nivo-caption .circle p, x:-moz-any-link {
  top:-22px;*top:-13px;
}
.u_topSlide .pic_recommend .nivo-caption dt,
.u_topSlide .pic_recommend .nivo-caption dd {
 color: #fff;
}
.u_topSlide .pic_recommend .nivo-caption dt {
  margin-bottom: 5px;
  font-size: 15px;
  font-weight: bold;
  line-height: 1.2;
}
.u_topSlide .pic_recommend .nivo-caption dd {
  display: flex;
  width:435px;
  height: 18px;
  overflow: hidden;
}
.u_topSlide .pic_recommend .nivo-caption dd .name_trg_traveler {
  max-width: 120px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.u_topSlide .pic_recommend .icon{
	background: #f38d33;
	color: #fff;
	font-size: 12px;
	padding: 1px 10px 2px;
	position: absolute;
	top: -177px;
	left: 10px;
	z-index: 8;
}
.u_topSlide .pic_recommend .nivo-prevNav,
.u_topSlide .pic_recommend .nivo-nextNav{
  position: absolute;
  width:30px;
  height:25px;
  display:block;
  opacity:0.5;
}
.u_topSlide .pic_recommend a.nivo-prevNav:hover,
.u_topSlide .pic_recommend a.nivo-nextNav:hover{
  opacity:0.9;
}
.u_topSlide .pic_recommend .nivo-prevNav{
  left: 0px;
  background:url(https://cdn.4travel.jp/img/webapp/top/icon_topslide_prev.png) no-repeat center center;
}
.u_topSlide .pic_recommend .nivo-nextNav{
  right: 0px;
  background:url(https://cdn.4travel.jp/img/webapp/top/icon_topslide_next.png) no-repeat center center;
}
.u_topSlide .pic_recommend .nivo-controlNav {
  text-align: center;
  padding: 6px 0 0 0;
}
.u_topSlide .pic_recommend .nivo-controlNav a {
  margin: 3px 3px 0  3px;
  width: 10px;
  height: 10px;
  font-size: 0;
  overflow: hidden;
  text-decoration: none;
  background:url(https://cdn.4travel.jp/img/general/4travel/top/ver1/ico/ico_scroll_bullets.png) no-repeat;
  display: -moz-inline-box;
  display: inline-block;
  line-height: 25px;
}
.u_topSlide .pic_recommend .nivo-controlNav a.active {
  background-position:0 -18px;
}
.u_topSlide .pic_recommend .nivo-controlNav.nivo-thumbs-enabled {
  width: 100%;
}
.u_topSlide .pic_recommend .nivo-controlNav.nivo-thumbs-enabled a {
  width: auto;
  height: auto;
  background: none;
  margin-bottom: 5px;
}
.u_topSlide .pic_recommend .nivo-controlNav.nivo-thumbs-enabled img {
  display: block;
  width: 120px;
  height: auto;
}
.u_topSlide .pic_recommend .nivoSlider img,
.u_topSlide .pic_recommend .nivoSlider .nivo-slice img,
.u_topSlide .pic_recommend .nivoSlider a.nivo-imageLink img{
  width:auto !important;
  height:250px !important;
  position:absolute;
  top:0;
  left:0;
}


/*
## u_sidebar
*/

.u_topContainer .u_sidebar{
	margin-bottom: 0;
}
.u_topContainer .ad_area{
	width: 300px;
	margin-bottom: 20px;
}


/*
# u_listNews
*/

.u_topContainer .u_borderTopBlue{
	margin-bottom: 0;
}
.u_topContainer .u_newsBox{
	padding: 0;
	margin-bottom: 20px;
}
.u_topContainer .u_newsBox .title{
	font-size: 16px;
	padding: 7px 10px;
	background: #e8e8e8;
	border-top: 1px solid #ddd;
}
.u_topContainer .u_newsBox .u_listNews ul > li{
	font-size: 12px;
	border-bottom: 1px solid #ddd;
	padding: 6px 5px 4px 10px;
}
.u_topContainer .u_newsBox .u_listNews ul > li .u_categoryLabel {
	display: inline-block;
	margin-bottom: 2px;
	padding: 1px 4px 0;
	border: 1px solid #999;
	color: #999;
	font-size: 11px;
	line-height: 1.3;
}
.u_topContainer .u_newsBox .u_listNews ul > li .u_categoryLabel:empty {
	display: none;
}
.u_topContainer .u_newsBox .u_listNews ul > li .u_newIconLabel {
	display: inline-block;
	margin-bottom: 2px;
	padding: 1px 4px 0;
	background: #f36d33;
	color: #fff;
	font-size: 11px;
}
.u_topContainer .u_newsBox .u_listNews ul > li a {
	display: block;
}
.u_topContainer .u_newsBox .u_listNews ul > li a:hover {
	text-decoration: none;
}
.u_topContainer .u_newsBox .u_listNews ul > li a .newsTitle:hover {
	text-decoration: underline;
}

/* メインコンテンツ共通 */
#top .trimming p img,
#top .trimming02 p img,
#top .trimming03 .thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
#top .link_normal {
	cursor: pointer;
	text-decoration: none;
}
#top .contents_box span.number {
	margin-left: 15px;
	font-size: 12px;
	vertical-align: middle;
	font-weight: bold;
}
#top .ttl_sub {
	margin-left: 15px;
	font-size: 12px;
}
#top .contents_box h3 {
	margin: 15px 0 10px;
	font-size: 16px;
}
#top .contents_box .btn_more {
	margin-top: 15px;
	padding: 15px 45px;
	background: #f3f3f3;
	text-align: center;
	zoom: 1;
}
#top .contents_box .btn_more a {
	display: block;
	max-width: 500px;
	margin: 0 auto;
	padding: 13px;
	background: #fff;
	border: solid 1px #ccc;
	border-radius: 4px;
	box-shadow: 0px 1px 0px #ccc;
	color: #333;
	font-size: 14px;
	font-weight: bold;
}
#top .contents_box .btn_more a .u_moreIcon:after {
	display: inline-block;
	margin-left: 10px;
	content: "\f054";
	font-family: "fontAwesome";
	speak: none;
	text-decoration: none;
	font-weight: normal;
	font-style: normal;
	font-variant: normal;
	text-transform: none;
	line-height: 1.0;
}
#contents_inner  a img:hover,
#contents_inner .link_normal img:hover {
	opacity: 0.8;
}
#contents_inner h2 {
	font-size: 20px;
}
#contents_inner h2 .fa {
	padding-right: 7px;
	color: #0098de;
	font-size: 20px;
	font-weight: normal;
}
#contents_inner .u_moreLink {
	font-size: 12px;
}
#contents_inner .u_moreLink:after {
	padding-left: 5px;
	font-family: 'Fontawesome';
	content: "\f054";
	color: #0098de;
	font-size: 13px;
	font-weight: normal;
	line-height: 1;
}

/* __os_map , __dm_map
----------------------------------------------------------- */
#top .u_dmClickableMap {
  position: relative;
  zoom: 1;
  text-align:center;
}
#top .u_dmClickableMap ul {
  display:block;
}
#top .u_dmClickableMap li {
  margin-bottom: 3px;
  width:45px;
}
#top .u_dmClickableMap .u_commonButton a,
#top .u_osClickableMap .u_commonButton a {
  padding: 2px 0 1px;
  color: #fff;
  font-weight: normal;
  font-size: 11px;
  border:none;
}
#top .u_dmClickableMap .hokkaidou {
  position: absolute;
  left: 382px;
  top: 10px;
}
#top .u_dmClickableMap .tohoku_right {
  position: absolute;
  left: 400px;
  top: 75px;
}
#top .u_dmClickableMap .tohoku_left {
  position: absolute;
  left: 350px;
  top: 75px;
}
#top .u_dmClickableMap .kanto_right {
  position: absolute;
  left: 370px;
  top: 152px;
}
#top .u_dmClickableMap .kanto_left {
  position: absolute;
  left: 320px;
  top: 152px;
}
#top .u_dmClickableMap .hokurikukousinetsu {
  position: absolute;
  right: 211px;
  top: 13px;
}
#top .u_dmClickableMap .kinki {
  position: absolute;
  right: 274px;
  top: 48px;
}
#top .u_dmClickableMap .chugoku {
  position: absolute;
  right: 336px;
  top: 91px;
}
#top .u_dmClickableMap .toukai_right {
  position: absolute;
  left: 289px;
  top: 227px;
}
#top .u_dmClickableMap .toukai_left {
  position: absolute;
  left: 240px;
  top: 227px;
}
#top .u_dmClickableMap .shikoku_right {
  position: absolute;
  left: 175px;
  top: 250px;
}
#top .u_dmClickableMap .shikoku_left {
  position: absolute;
  left: 127px;
  top: 250px;
}
#top .u_dmClickableMap .kyushu {
  position: absolute;
  top: 130px;
  left: 20px;
}
#top .u_dmClickableMap .okinawa {
  position: absolute;
  top: 52px;
  right: 400px;
}

/* u_osClickableMap */
#top .u_osClickableMap li {
  display:inline-block;
}
#top .u_osClickableMap .u_commonButton a {
  padding: 2px 10px;
}
#top .u_osClickableMap .js_mapBox {
  display: none;
  position:relative;
}
#top .u_osClickableMap .button_back_map {
  position:absolute;
  top: 8px;
  right: 9px;
}
#top .u_osClickableMap .map_eu {
  position:absolute;
  top: 90px;
  left: 43px;
}
#top .u_osClickableMap .map_af {
  position:absolute;
  top: 177px;
  left: 31px;
}
#top .u_osClickableMap .map_me {
  position:absolute;
  top: 136px;
  left: 77px;
}
#top .u_osClickableMap .map_as {
  position:absolute;
  top: 106px;
  left: 151px;
}
#top .u_osClickableMap .map_om {
  position:absolute;
  top: 215px;
  left: 141px;
}
#top .u_osClickableMap .map_la {
  position:absolute;
  top: 196px;
  left: 394px;
}
#top .u_osClickableMap .map_na {
  position:absolute;
  top: 108px;
  left: 341px;
}

/* エリアガイド地図 */
#top .map_box {
	margin-bottom: 30px;
	padding: 15px 0 15px 15px;
	border: solid 5px #eee;
	border-radius: 4px;
}
#top .map_box .u_moreLink {
	margin: 0 15px 10px 0;
	text-align: right;
}
#top .dm_guide,
#top .os_guide {
	width: 460px;
}
#top .os_guide {
	float: left;
	padding-right: 5px;
	border-right: 1px solid #ddd;
}
#top .dm_guide {
	float: right;
}
#top .os_guide .map_box_square {
  height: 378px; /* 読み込み時に高が潰れるため */
}
#top .map_box .u_popularAreaLink {
	width: 445px;
	padding-top: 10px;
	border-top: 1px solid #ddd;
	line-height: 1.8;
	text-align: left;
}
#top .map_box .u_popularAreaLink a {
  display: inline-block;
}
#top .map_box .u_popularAreaLink .divide {
  letter-spacing:-0.3em; /*隙間対策*/
}


/* 旅行記、クチコミ、Q＆A */
#top .travelogue_box,
#top .tips_box,
#top .qa_box,
#top .traveler_intro  {
	margin-bottom: 20px;
	padding: 15px 20px;
	border: solid 1px #ddd;
	border-radius: 5px;
}
#top .travelogue_box .dm_guide,
#top .travelogue_box .os_guide,
#top .tips_box .dm_guide,
#top .tips_box .os_guide,
#top .qa_box .dm_guide,
#top .qa_box .os_guide {
	width: 445px;
}
#top .travelogue_box .os_guide,
#top .tips_box .os_guide,
#top .qa_box .os_guide {
	padding-right: 18px;
}
#top .travelogue_box .travelogue_recommend ul {
	overflow: hidden;
	zoom:1;
	margin-left: -15px;
}
#top .travelogue_box .travelogue_recommend li {
	display: inline;
	position: relative;
	float: left;
	width: 214px;
	margin: 0 0 15px 15px;
}
#top .travelogue_box .travelogue_recommend .trimming p {
	width: 214px;
	height: 160px;
}
#top .travelogue_box .travelogue_recommend li .travelList_ribbon {
	display: flex;
	align-items: center;
	justify-content: center;
	position: absolute;
	top: 12px;
	left: -21px;
	height:17px;
	width: 85px;
	z-index: 1;
	transform: rotate(-45deg);
	text-transform: uppercase;
	background: rgb(255 255 255 / 0.9);
	text-align: center;
}
#top .travelogue_box .travelogue_recommend li .travelList_ribbon .label {
	color: #333;
	font-size: 10px;
	font-weight: normal;
	line-height: 1;
}
#top .travelogue_box .travelogue_recommend li dt {
	margin: 7px 0 0;
	font-size: 15px;
	font-weight: bold;
}
#top .travelogue_box .travelogue_new li dt {
	font-size: 14px;
	font-weight: bold;
}
#top .travelogue_box .travelogue_recommend li dd,
#top .travelogue_box .travelogue_new li dd {
	margin-top: 3px;
	color: #666;
	font-size: 12px;
}
#top .travelogue_box dd .fa,
#top .tips_box dd .fa,
#top .qa_box .area .fa {
	padding-right: 3px;
}
#top .travelogue_box .travelogue_new,
#top .tips_new,
#top .qa_new {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	margin: 0;
}
#top .travelogue_box .travelogue_new {
	margin-top: 15px;
}
#top .travelogue_box .travelogue_new h3 {
	margin: 0 0 10px;
	padding-bottom: 2px;
	border-bottom: solid 1px #0098de;
}
#top .travelogue_box .travelogue_new li,
#top .tips_new li {
	position: relative;
	padding-bottom: 10px;
	overflow: hidden;
	zoom:1;
}
#top .travelogue_box .travelogue_new .trimming02 p {
	width: 120px;
	height: 87px;
}
#top .travelogue_box .travelogue_new li:last-child,
#top .tips_new li:last-child {
	padding-bottom: 0;
}
#top .travelogue_box .travelogue_new li p {
	float: left;
	width: 120px;
	margin-right: 10px;
}
#top .travelogue_box .travelogue_new li dl {
  margin-left: 130px;
}
#top .travelogue_box .travelogue_new li .travelerName {
	text-align: right;
}
#top .travelogue_box .travelogue_new li .days {
	font-size: 11px;
	text-align: right;
}


/* tips_new */

#top .tips_new .group dl {
	float: left;
	width: 320px;
}
#top .tips_new .group p {
	float: right;
	width: 90px;
	height: 90px;
}
#top .tips_new .ttl {
	padding-left: 26px;
	font-size: 14px;
	font-weight: bold;
}
/* 高評価アイコン */
#top .tips_new .ttl.tips_cs4_5_m { 
	background: no-repeat left top/18px url("https://cdn.4travel.jp/img/sp_assets/cmn/ico/u_face_smile.svg");
}
/* 普通〜評価なしアイコン */
#top .tips_new .ttl.tips_cs3_m,
#top .tips_new .ttl.tips_cs1_2_m,
#top .tips_new .ttl.tips_cs0_m {
	background: no-repeat left top/18px url("https://cdn.4travel.jp/img/sp_assets/cmn/ico/u_face_straight.svg");
}
/* 評価★アイコン */
.u_evaluateIcon {
	color: #f36d33;
	font-size: 11px;
	font-weight: bold;
}
.u_evaluateIcon [class^="star"] {
	display: inline-block;
	position: relative;
	padding-right: 4px;
	letter-spacing: 2px;
	/* module.cssスタイル上書き */
	padding-left: 0;
	background: none;
}
.u_evaluateIcon [class^="star"]::before,
.u_evaluateIcon [class^="star"]::after {
	color: #b0c4c3;
	font-family: 'FontAwesome';
	font-size: 13px;
	font-style: normal;
	-webkit-font-smoothing: antialiased;
	content: "";
}
.u_evaluateIcon [class^="star"]::before {
	z-index: 100;
	color: #b0c4c3;
	content: "\f005\f005\f005\f005\f005";
}
.u_evaluateIcon [class^="star"]::after {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 400;
	color: #ffa800;
}
.u_evaluateIcon .star00_s::after {
	content: ""
}

.u_evaluateIcon .star05_s::after {
	content: "\f089"
}

.u_evaluateIcon .star10_s::after {
	content: "\f005"
}

.u_evaluateIcon .star15_s::after {
	content: "\f005\f089"
}

.u_evaluateIcon .star20_s::after {
	content: "\f005\f005"
}

.u_evaluateIcon .star25_s::after {
	content: "\f005\f005\f089"
}

.u_evaluateIcon .star30_s::after {
	content: "\f005\f005\f005"
}

.u_evaluateIcon .star35_s::after {
	content: "\f005\f005\f005\f089"
}

.u_evaluateIcon .star40_s::after {
	content: "\f005\f005\f005\f005"
}

.u_evaluateIcon .star45_s::after {
	content: "\f005\f005\f005\f005\f089"
}

.u_evaluateIcon .star50_s::after {
	content: "\f005\f005\f005\f005\f005"
}

#top .tips_new .area,
#top .qa_new .area {
	margin-top: 3px;
	color: #666;
	font-size: 12px;
}
#top .tips_new .spot_name {
	margin-top: 3px;
	color: #333;
	font-weight: bold;
	font-size: 12px;
}
#top .tips_new .spot_name .u_categoryLabel {
	display: inline-block;
	margin-left: 5px;
	padding: 2px 3px 0;
	border: 1px solid #999;
	background-color: #fff;
	color: #999;
	font-size: 11px;
	font-weight: normal;
	line-height: 1.2;
}

/* qa_new */
#top .qa_new ul {
	display: flex;
	flex-direction: column;
	height: 100%;
}
#top .qa_new li {
	position: relative;
	margin-bottom: 10px;
	padding-left: 35px;
}
#top .qa_new li:before {
	position: absolute;
	top: 8px;
	left: 0;
	font-family: 'Fontawesome';
	content: "\f2bd";
	color: #ddd;
	font-size: 24px;
	font-weight: normal;
	line-height: 1;
}
#top .qa_new li:last-child {
	margin-bottom: 0;
}
#top .qa_new li .textBox {
	position: relative;
	padding: 10px;
	border: 1px solid #ddd;
	border-radius: 4px;
}
#top .qa_new li .textBox:before,
#top .qa_new li .textBox:after {
	content: '';
	display: block;
	position: absolute;
	width: 0;
	height: 0;
	top: 15px;
	border-top: 7px solid transparent;
	border-bottom: 7px solid transparent;
}
#top .qa_new li .textBox:before {
	left: -7px;
	border-right: 7px solid #ddd;
}
#top .qa_new li .textBox:after {
	left: -6px;
	border-right: 7px solid #fff;
}
#top .qa_new li .ttl {
	position: relative;
	font-size: 14px;
	font-weight: bold;
}
#top .qa_new li .ttl:before {
	position: absolute;
	display: inline-block;
	width: 16px;
	height: 13px;
	top: 1px;
	left: 0;
	background: #999;
	color: #fff;
	content: "Q";
	padding-top: 3px;
	border-radius: 50%;
	font-size: 11px;
	font-weight: normal;
	line-height: 1.0;
	speak: none;
	text-align: center;
	text-decoration: none;
}
#top .qa_new li .ttl,
#top .qa_new li .area {
	padding-left: 20px;
}


/* search_form */
#top .search_form {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 15px;
	margin-bottom: 45px;
	background: #f8f8f8;
	border-radius: 5px;
}
#top .search_form form input{
	font-family:inherit;
}
#top .search_form h2 {
	display: inline-block;
	border-bottom: none;
}
#top .search_form h2 span.ttl_sub {
	margin-left: 10px;
	font-weight: normal;
	font-size: 12px;
}
#top a.anchorlink {
	position: relative;
	top: 0px;
	display: block;
}
#top .search_form .u_searchInner {
	margin-top: -5px;
}
#top .search_form .u_searchInner form {
	display: flex;
	align-items: flex-end;
}
#top .search_form .u_searchInner .u_inputBox {
	margin-right: 5px;
}
#top .search_form .u_searchInner .u_inputBox p{
	font-size: 10px;
}
#top .search_form .u_searchInner .u_inputBox input {
	font-size: 14px;
}
#top .search_form .searchKeyword {
	width: 180px;
	height: 34px;
	padding: 2px 5px;
	border: solid 1px #ddd;
	border-radius: 4px;
}
#top .search_form .u_searchInner .kakeru {
	margin-right: 5px;
	font-size: 26px;
}
#top .search_form .submitButton {
	margin-left: 5px;
	padding: 4px 13px;
	height: 38px;
	appearance: none;
	border-radius: 3px;
	border: none;
	background: #0098de;
	color: #fff;
	font-size: 14px;
	vertical-align: bottom;
	outline: none;
}
#top .search_form .submitButton:hover {
	opacty: 0.8;
	cursor: pointer;
}

/* トラベルマガジン */
#top .u_magazineBox .magazineTitle {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin: 0 20px 15px;
}
#top .u_magazineBox .magazineTitle h2 {
	font-size: 16px;
}

/* traveler_intro */
#top .traveler_intro .col_half {
	display: flex;
}
#top .traveler_intro .col_traveler {
	width: 445px;
}
#top .traveler_intro .col_traveler.is_left {
	margin-right: 18px;
	padding-right: 18px;
	border-right: solid 1px #ddd;
}
#top .traveler_intro .col_traveler ul {
	margin-bottom: 25px;
}
#top .traveler_intro .col_half.is_bottomBox .col_traveler ul:last-child {
	margin-bottom: 0px;
}
#top .traveler_intro .col_traveler li {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	float: left;
	width: 68px;
	margin-right: 25px;
}
#top .traveler_intro .col_traveler li:nth-child(5n) {
	margin-right: 0;
}
#top .traveler_intro .col_traveler li a {
	position: relative;
	display: block;
}
#top .traveler_intro .col_traveler .rank_normal {
	position: absolute;
	top: 0;
	left: 0;
	padding: 3px 4px;
	background: #0098de;
	color: #fff;
	font-size: 16px;
	line-height: 1;
}
#top .traveler_intro .col_traveler .rank01 {
	background: #a09060;
}
#top .traveler_intro .col_traveler .rank02 {
	background: #7a91a2;
}
#top .traveler_intro .col_traveler .rank03 {
	background: #ca9173;
}
#top .traveler_intro .col_traveler ul p {
	line-height: 1.2;
	font-size: 12px;
}
#top .traveler_intro .col_traveler p.highlight {
	width: 68px;
	margin: 15px 0 0;
	padding: 5px;
	color: #f38d33;
	background: #fff8dA;
	text-align: center;
	font-size: 10px;
}
#top .traveler_intro .col_traveler .highlight .count {
	display: block;
	font-weight: bold;
	font-size: 12px;
}
#top .traveler_intro .col_traveler a:hover .highlight {
	text-decoration: none;
}
.traveler_intro .trimming03 .rank_normal{
  z-index:2;
}
.traveler_intro .trimming03 p.thumb{
  width:50px;
  height:50px;
  margin: 0 auto 10px auto;
  border-radius: 50%;
  overflow:hidden;
  z-index:0;
}

/* other_service_area */
#top .other_service_area {
	display: flex;
	align-items: stretch;
	justify-content: space-between;
	padding: 15px;
	background: #f3f3f3;
}
#top .other_service_area .other_service_col {
	width: 445px;
}
#top .other_service_area .contents_box {
	padding: 15px;
	background: #fff;
	border-radius: 5px;
}
#top .other_service_area .other_service_col.is_right .contents_box {
	min-height: 238px;
}
#top .other_service_area .contents_box.is_topBox {
	margin-bottom: 20px;
}
#top .other_service_area .contents_box h2 {
	margin-bottom: 10px;
}
#top .other_service_area .contents_box h3 {
	margin-top: 0;
}
#top .other_service_area .contents_box .unit_img02 .img {
	float: right;
	margin-left: 8px;
}
#top .other_service_area .contents_box .u_moreLink {
	margin-top: 15px;
}

/* point_box */
#top .other_service_area .point_box dl {
	margin: 20px 0 0;
}
#top .other_service_area .point_box dt {
	margin-bottom: 10px;
	border-bottom: solid 1px #0098de;
	font-size: 13px;
	font-weight: bold;
}
#top .other_service_area .point_notice {
	margin-top: 20px;
	color: #666;
	line-height: 1.3;
}
#top .other_service_area .point_box .point_get_find .point_get_image {
	width: 380px;
	margin: 0 auto;
	padding: 10px 25px;
	border: solid 1px #ccc;
	box-shadow: 0px 1px 0px #ccc;
	border-radius: 5px;
}
#top .other_service_area .point_box .point_get_find .txt {
	display: flex;
	justify-content: center;
	width: 320px;
}
#top .other_service_area .point_box .point_get_find .txt .marker {
	background: linear-gradient(transparent 60%, #fff8da 60%);
}
#top .other_service_area .point_box .point_get_find .txt .pointIcon {
	margin-right: 3px;
}
#top .other_service_area .point_box .point_get_find .odai {
	text-align: center;
	margin-top: 10px;
}
#top .other_service_area .point_box .point_get_find .odai a {
	color: #333;
	font-weight: bold;
}
#top .other_service_area .point_box .point_get_find .ttl_odai {
	display: inline-block;
	width: 80px;
	padding-top: 1px;
	border-radius: 3px;
	background: #f38d33;
	color: #fff;
	text-align: center;
}
/*relation_service*/
#top .relation_service {
	margin: 30px 0 20px;
}
#top .relation_service h2 {
	clear: both;
	margin-bottom: 10px;
	padding-top: 10px;
	border-bottom: solid 2px #0098de;
}
#top .relation_service h3 {
	margin-bottom: 10px;
	padding: 5px 10px;
	background: #eee;
}
#top .relation_service .group {
	margin-left: -25px;
	margin-bottom: 30px;
}
#top .relation_service .col {
	display: inline;
	float: left;
	width: 470px;
	margin-left: 25px;
}
#top .relation_service .col img {
	float: left;
	margin-right: 10px;
}
#top .relation_service .linkList_box {
	display: flex;
	justify-content: space-between;
}
#top .relation_service .col3 { /* 3カラム */
	flex-basis: 315px;
}

/* リストのスタイル（親異存なし） */
ul.nomal_list { /* 三角アイコンありのリスト */
	margin: 10px;
	font-weight: bold;
}
ul.nomal_list li {
	margin-bottom: 5px;
}
ul.nomal_list > li:before {
	margin-right: 5px;
	color: #0098de;
	content: "\f0da";
	font-family: "FontAwesome";
}
ul.inline_list { /* 並列　区切りありのリスト */
	margin-bottom: 10px;
}
ul.inline_list li {
	display: inline-block;
	margin: 0 0 5px;
}
ul.nomal_list li > ul.inline_list {
	margin-top: 5px;
}
ul.inline_list li a {
	padding: 0 10px;
	border-right: solid 1px #ddd;
	font-size: 12px;
	font-weight: normal;
}
ul.inline_list li:last-child a {
	border: none;
}
ul.inline_list li a:before {
	content: none;
}


/* QAステータスアイコン（親依存なし） */
.qaStatusLabel {
  display: inline-block;
  margin: 0 0 0 5px;
  padding: 2px 3px 0;
  border: 1px solid #0098de;
  vertical-align: middle;
  white-space: nowrap;
  background: #fff;
  color: #0098de;
  line-height: 1.2;
  font-size: 11px;
  font-weight: normal;
}
.qaStatusLabel.is_always {
  border: 1px solid #0098de;
  background: #0098de;
  color: #fff;
}
.qaStatusLabel.is_emergency {
  border: 1px solid #f36d33;
  background: #f36d33;
  color: #fff;
}
.qaStatusLabel.is_now {
  border: 1px solid #cc3333;
  background: #cc3333;
  color: #fff;
}
.qaStatusLabel.is_closed {
	border-color: #999;
	color: #999;
}

/* __kakaku_link
----------------------------------------------------------- */

#kakaku_link {
	min-width: 990px;
	padding: 10px 0 20px;
	background: #ffffff;
	font-size: 1.3em;
	zoom: 1;
}
#kakaku_link_inner {
	width: 970px;
	margin: 0 auto;
	padding: 0 10px;
	color: #666666;
}
#kakaku_link_inner p {
	margin-bottom: 10px;
	font-weight: bold;
}
#kakaku_link_inner p img {
	vertical-align: baseline;
}