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

.re-top_bg-area_gradation {
    background-image: linear-gradient(#69b7e5, #eaf7ff);/*背景の色*/
}
.re-top_slider-area {
	padding-top: 50px;
}
.re-top_slider-box {
	width: 800px;
	height: 450px;
	margin-right: auto;
	margin-left: auto;
}
.re-top_search-area {
	padding-top: 50px;
}
.re-top_cg-box {
	margin-top: 20px;
	padding-bottom: 20px;
}
.re-top_cg-area {
	display: flex; /* 横並び */
	flex-wrap: wrap;
	/*　折り返しあり */
	justify-content: start;
	padding-top: 30px;
}
.re-top_cg-area::after {
	content: "";
	display: block;
}
.re-top_cg-area figure {
	margin-right: 15px;
}
.re-top_cg-area figure:last-child  {
	margin-right: -15px;
}

.re-top_cg-box:hover figure {
  opacity: 0.8; filter: brightness(110%);/*バナーにマウスが乗った時透明になる*/
}
.re-top_bg-area-color_eaf7ff {
	background-color: #eaf7ff;
}
.re-top_bg-area-color_fff {
	background-color: #fff;
}
.re-top_bg-area-color_69b7e5 {
	background-color: #69b7e5;
}
/*色（color）ここから*/
.re-top_color-blue {
	color: #0052ae;
}
.re-top_color-blue02 {
	color: #00a7ed;
}
.re-top_color-orange {
	color: #ff6f4d;
}
.re-top_color-cobalt-blue {
	color: #0051b4;
}
.re-top_color-green {
	color: #66bb6a;
}
.re-top_color-pink {
	color: #e50150;
}
/*色ここまで*/

.re-top_h2-text {
	font-size: 12px;
}
.re-top_h2 {
	font-size: 25px;
}
.re-top_bg-area-white {
	background-color: #fff;
}
.new_re-h2-area {
	padding-top: 50px;
	padding-bottom: 30px;
	text-align: center;
}
.new_re-h2-area-info {
	padding-bottom: 30px;
	text-align: center;
}
/*TOP文字やボタンをのせるcss (左上に配置)　01アウトバウンド　青色*/
.re-top-area_example_event-blue {
	position: relative;
}
.re-top-area_example_event-blue p {
	position: absolute;
	top: 0;
	/*画像の左上に配置*/
	left: 0;
	margin-top: 10px;
	margin-right: 10px;
	margin-left: 10px;
	margin-bottom: 10px;
	/*余計な隙間を除く*/
	color: white;
	/*文字を白に*/
	background: #00a7ed;
	/*背景色*/
	font-size: 12px;
	line-height: 1;
	border-radius: 8px;
	padding-top: 5px;
	padding-right: 20px;
	padding-left: 20px;
	padding-bottom: 5px;    /*文字周りの余白*/
}
.re-top-area_example_event-blue img {
    width: 100%;
}
/*TOP文字やボタンをのせるcss (左上に配置)　01アウトバウンド　青色ここまで*/
.re-top_tour-area {
  display: flex;
  /* 横並び */
  flex-wrap: wrap;
  /*　折り返しあり */
  justify-content: flex-start;
}
.re-top_tour-area::after {
  content: "";
  display: block;
}
/*ツアーBOXここから*/
.re-top_thumbnail {
  background-size: cover;
  background-position: center;
  padding-top: 72.2%;
  width: 100%;
  border-top-left-radius: 20px;
  border-top-right-radius: 20px;
}
.re-top_tour-area_box {
	width: 250px;
	border-radius: 20px;
	border: 1px solid #333;
	margin-right: 30px;
	margin-bottom: 20px;
	background-color: #fff;
}
.re-top_tour-area_box:hover {
	border: 1px solid #00a7ed;
}
.re-top_tour_box-obi {
	padding-top: 5px;
	padding-right: 15px;
	padding-left: 15px;
	padding-bottom: 5px;
	background-color: #5c5c5c;
	font-size: 14px;
	color: #fff;
}
.re-top_tour_box-text {
	padding: 15px;
}
.re-top_tour_h3 {
	line-height: 1.2em;
	width: 230px;          /* 横幅 */
	overflow: hidden;          /* 溢れた部分を隠す */
	text-overflow: ellipsis;   /* 溢れた部分を「...」にする */
	/*white-space: nowrap;*/     /* 1行で表示 */
    display: -webkit-box;
    -webkit-line-clamp: 2;      /* 2行まで表示 */
    -webkit-box-orient: vertical;
}
.re-top_tour_h3 a {
	font-size: 18px;
}
.re-top_tour_h3 a:hover  {
	color: #00a7ed;
}
.re-top_tour_h3-text {
	font-size: 14px;
}
.re-top_tour_price {
	color: #e50150;
	font-size: 18px;
	font-weight: bold;
	background: linear-gradient(transparent 70%, #fedf75 30%);
	margin-top: 15px;
}
/*ボタンここから*/
.re-top_button a {
	position: relative;
	overflow: hidden;
	border-radius: 20px;
	text-decoration: none;
	display: block;
	max-width: 160px;
	/*border: 1px solid #555;*/
	background: #fff;
	margin: auto;
	padding: 10px 30px;
	font-family: "Noto Sans Japanese";
	font-weight: 500;
	text-align: center;
	line-height: 1.8;
	text-decoration: none;
	outline: none;
	transition: ease .2s;
	border: 1px solid #024fb9;
}
.re-top_button a span {
    position: relative;
    z-index: 3;
    color:#024fb9;
	font-size: 13px;
}
.re-top_button a:hover span{
    color:#fff;
}
.re-top_bgskew::before {
  content: '';
  position: absolute;
  top: 0;
  left: -130%;
  background:#024fb9;
  width:120%;
  height: 100%;
  transform: skewX(-25deg);
}
.re-top_bgskew:hover::before {
  animation: skewanime .5s forwards;
}
@keyframes skewanime {
  100% {
    left:-10%;
  }
}
/*ボタンここまで*/

.re-top_button-area {
	margin-top: 50px;
	padding-bottom: 50px;
}
.re-top_slider02_area {
	padding-top: 40px;
	padding-bottom: 40px;
}
/*TOP文字やボタンをのせるcss (左上に配置)　02インバウンド　オレンジ色*/
.re-in-top-area_example_event-orange {
	position: relative;	
}
/*催行決定　top-area_h5_text2*/
.re-in-top-area_example_event-orange .top-area_h5_text1 {
	position: absolute;
	top: 0;
	/*画像の左上に配置*/
	left: 0;
	margin-top: 10px;
	margin-right: 10px;
	margin-left: 10px;
	margin-bottom: 10px;
	/*余計な隙間を除く*/
	color: white;
	/*文字を白に*/
	background: #ff6f4d;
	/*背景色*/
	font-size: 12px;
	line-height: 1;
	border-radius: 10px;
	padding-top: 9px;
	padding-right: 20px;
	padding-left: 20px;
	padding-bottom: 9px;    /*文字周りの余白*/
	z-index: 100;
}
/*キャンペーン　top-area_h5_text2*/
.re-in-top-area_example_event-orange .top-area_h5_text2 {
	position: absolute;
	top: 0;
	/*画像の左上に配置*/
	left: 0;
	margin-top: 10px;
	margin-right: 10px;
	margin-left: 10px;
	margin-bottom: 10px;
	/*余計な隙間を除く*/
	color: #e50150;
	/*文字を白に*/
	background: #ffffff;
	/*背景色*/
	font-size: 12px;
	line-height: 1;
	border-radius: 10px;
	padding-top: 8px;
	padding-right: 20px;
	padding-left: 20px;
	padding-bottom: 8px;    /*文字周りの余白*/
	border: 2px solid #e50150;
	font-weight: 800;
}
/*催行決定＆キャンペーン　top-area_h5_text3*/
.re-in-top-area_example_event-orange .top-area_h5_text3 {
	position: absolute;
	top: 0;
	/*画像の左上に配置*/
	left: auto;
	margin-top: 10px;
	margin-right: 10px;
	margin-left: 10px;
	margin-bottom: 10px;
	/*余計な隙間を除く*/
	color: #e50150;
	/*文字を白に*/
	background: #ffffff;
	/*背景色*/
	font-size: 12px;
	line-height: 1;
	border-radius: 10px;
	padding-top: 8px;
	padding-right: 20px;
	padding-left: 20px;
	padding-bottom: 8px;    /*文字周りの余白*/
	border: 2px solid #e50150;
	z-index: 200;
	right: 0px;
	width: 150px;
	font-weight: 800;
}

.re-in-top-area_example_event-blue img {
    width: 100%;
}
/*TOP文字やボタンをのせるcss (左上に配置)　01アウトバウンド　オレンジ色ここまで*/

/*TOPバスツアー項目ここから*/
.re-in-top_tour-area {
  display: flex;
  /* 横並び */
  flex-wrap: wrap;
  /*　折り返しあり */
  justify-content: flex-start;
}
.re-in-top_tour-area::after {
  content: "";
  display: block;
  width: 250px;
}
/*ツアーBOXここから*/
.re-in-top_thumbnail {
  background-size: cover;
  background-position: center;
  padding-top: 72.2%;
  width: 100%;
  border-top-left-radius: 8px;
  border-top-right-radius: 8px;
}
.re-in-top_tour-area_box {
	width: 250px;
	border-radius: 20px;
	border: 1px solid #333;
	margin-right: 30px;
	margin-bottom: 20px;
	background-color: #fff;
}
.re-in-top_tour-area_box:hover {
	border: 1px solid #ff8c00;
}
.re-in-top_tour_box-obi {
	padding-top: 5px;
	padding-right: 15px;
	padding-left: 15px;
	padding-bottom: 5px;
	background-color: #69b7e5;
	font-size: 14px;
	color: #fff;
	text-align: center;
}
.re-in-top_tour_box-text {
	padding: 15px;
}
.re-in-top_tour_h3 {
	line-height: 1.2em;
	padding-right: 0px;
	width: 230px;          /* 横幅 */
	overflow: hidden;          /* 溢れた部分を隠す */
	text-overflow: ellipsis;   /* 溢れた部分を「...」にする */
	/*white-space: nowrap;*/     /* 1行で表示 */
    display: -webkit-box;
    -webkit-line-clamp: 3;      /* 3行まで表示 */
    -webkit-box-orient: vertical;
}
.re-in-top_tour_h3 a {
	font-size: 18px;
}
.re-in-top_tour_h3 a:hover  {
	color: #ff8c00;
}
.re-in-top_tour_h3-text {
	font-size: 14px;
}
.re-in-top_tour_price {
	color: #e50150;
	font-size: 20px;
	font-weight: bold;
	background: linear-gradient(transparent 70%, #fedf75 30%);/*黄色後ろ帯*/
	margin-top: 10px;
	text-align: center;
}
.re-in-top_tour_price-day {
	color: #00a7ed;
	font-size: 18px;
	margin-top: 5px;
	text-align: center;
}
.re-in-top_tour_day-area {
	background-color: #00a7ed;
	padding: 5px;
	border-radius: 15px;
	margin-top: 10px;
}
.re-in-top_tour_day-area p {
	color: #fff;
	font-size: 15px;
	font-weight: 500;
	text-align: center;
}
/*TOPバスツアー項目ここまで*/

/* 諸島ここから */
.re-island-area {
  display: flex;
  /* 横並び */
  flex-wrap: wrap;
  /*　折り返しあり */
  justify-content: flex-start;
}
.re-island-area::after {
  content: "";
  display: block;
  width: 280px;
}
.re-island-box {
	width: 280px;
	margin-right: 10px;
	padding-top: 0px;
	margin-top: 20px;
}
.re-island-box:hover figure {
  opacity: 0.8; filter: brightness(110%);/*バナーにマウスが乗った時透明になる*/
}
/* 諸島ここまで */
.re-top_h2-bn_text {
	font-size: 16px;
	line-height: 1.5em;
	text-align: left;
	margin-top: 15px;
}
.re-bn-box {
	padding: 20px;
	width: 500px;
	border-radius: 20px;
	box-shadow: 0 0 8px gray;/*ドロップシャドー*/
	margin-bottom: 40px;
	background-color: #fff;
}
.re-bn-box figure {
	padding-top: 20px;
	text-align: center;
}
.re-bn-box:hover figure {
  opacity: 0.8; filter: brightness(110%);/*バナーにマウスが乗った時透明になる*/
}
.new_re-h2-area-bn {
	text-align: center;
}
.re-bn-area {
	display: flex;
	/* 横並び */
	flex-wrap: wrap;
	/*　折り返しあり */
	justify-content: space-between;
	padding-top: 50px;
	padding-bottom: 50px;
}
.re-bn-area::after {
  content: "";
  display: block;
  width: 500px;
}
.re-loop_area {
	padding-top: 40px;
	margin-bottom: 0px;
	padding-bottom: 20px;
}
.re-loop_box {
	width: 335px;
	margin-bottom: 20px;
	margin-right: 40px;
}
.re-loop_area {
	display: flex;
	/* 横並び */
	flex-wrap: wrap;
	/*　折り返しあり */
	justify-content: flex-start;
}
.re-loop_area::after {
  content: "";
  display: block;
  width: 335px;
}

/*ご案内ここから */
.re-news-karenda {
  display: block;
}
.re-top_info dd {
	padding-top: 20px;
	padding-bottom: 20px;
	padding-left: 8.5em;
	border-bottom: 1px solid #69b7e5;
}
.re-top_info {
  border-top: 1px solid #69b7e5;
}
.re-top_info dt {
	padding-left: 0.5em;
	width: 18em;/*日程間隔*/
	float: left;
	font-weight: normal;
	font-size: 14px;
	margin-top: 0px;
	padding-top: 25px;
}
.re-top_info a {
  color: #333;
}
.re-news02 a:hover {
  color: #00a7ed;
}
.re-news {
  font-weight: bold;
  color: #333;
}
/*海外旅行 */
.re-news-color-ob {
	font-size: 12px;
	background-color: #00a7ed;
	border-radius: 16px;
	padding-top: 5px;
	padding-bottom: 5px;
	padding-left: 20px;
	padding-right: 20px;
	font-weight: bold;
	color: #fff;
}
/*バスツアー */
.re-news-color-in {
	font-size: 12px;
	background-color: #ff704f;
	border-radius: 16px;
	padding-top: 5px;
	padding-bottom: 5px;
	padding-left: 20px;
	padding-right: 20px;
	font-weight: bold;
	color: #fff;
}
/*お知らせ */
.re-news-color-info {
	font-size: 12px;
	background-color: #3147ab;
	border-radius: 16px;
	padding-top: 5px;
	padding-bottom: 5px;
	padding-left: 20px;
	padding-right: 20px;
	font-weight: bold;
	color: #fff;
}
/*THE WORLD */
.re-news-color-world {
	font-size: 12px;
	background-color: #66bb6a;
	border-radius: 16px;
	padding-top: 5px;
	padding-bottom: 5px;
	padding-left: 20px;
	padding-right: 20px;
	font-weight: bold;
	color: #fff;
}
/*ガチ旅 */
.re-news-color-ch {
	font-size: 12px;
	background-color: #e50150;
	border-radius: 16px;
	padding-top: 5px;
	padding-bottom: 5px;
	padding-left: 20px;
	padding-right: 20px;
	font-weight: bold;
	color: #fff;
}
/*ご案内ここまで */

.re-top_info-box {
	padding-top: 40px;
	padding-right: 40px;
	padding-left: 40px;
	border-radius: 20px;
	box-shadow: 0 0 8px gray;/*ドロップシャドー*/
	margin-bottom: 40px;
	background-color: #fff;
}
.re-top_info-area {
	padding-top: 50px;
	padding-bottom: 50px;
}.re-top_news-btn {
	text-align: center;
	padding-top: 40px;
	padding-bottom: 20px;
}
.re-top_news-btn a {
	color: #024fb9;
	font-size: 15px;
	font-weight: 300;
}
.re-top_news-btn a:hover {
	color: #00a7ed;
}
.re-top-bn02_area-box {
	text-align: center;
	margin-bottom: 0px;
	padding-bottom: 40px;
}
.re-top-bn02_area-box:hover figure {
  opacity: 0.8; filter: brightness(110%);/*バナーにマウスが乗った時透明になる*/
}

/* 無限ループここから*/
.re-top_loop-area {
  padding-top: 50px;
  padding-bottom: 50px;
}

/*
右から左へ
----------------------------*/
@keyframes infinity-scroll-left {
  from {
    transform: translateX(0);
  }

  to {
    transform: translateX(-100%);
  }
}

/*
IE11対策
----------------------------*/
/*_:-ms-lang(x)::-ms-backdrop,*/
.re-d-demo {
  /*display: -ms-grid;*/
  overflow: hidden;
}

/*----------------------------*/

.re-d-demo__wrap {
  display: flex;
  overflow: hidden;
}

.re-d-demo__list {
  display: flex;
  list-style: none;
}

.re-d-demo__list--left {
  animation: infinity-scroll-left 95s infinite linear 0.5s both;
}

.re-d-demo__item {
  width: calc(100vw / 6);
}

.re-d-demo__item>img {
  width: 100%;
}
/* 無限ループここまで*/

.re-top_tamesi {
  text-align: left;
  height: 50px;
  overflow: hidden;          /* 溢れた部分を隠す */
  text-overflow: ellipsis;   /* 溢れた部分を「...」にする */
  white-space: nowrap;       /* 1行で表示 */
}





@media screen and (max-width:767px){
/*ここから　767px*/

.re-top_sec1,
.re-top_sec2,
.re-top_sec3,
.re-top_sec4,
.re-top_sec5,
.re-top_sec6,
.re-top_sec7,
.re-top_sec8,
.re-top_sec9,
.re-top_sec10 {
    width: 100%;
}
.re-top_slider-area {
	padding-top: 20px;
}
.re-top_slider-box {
	height: auto;
	width: 100%;
}
	
.re-top_search-area {
	padding-top: 10px;
}
.re-top_cg-area {
	margin-bottom: 0;
	padding-top: 5px;
	margin-top: 30px;
}	
.re-top_cg-box {
	margin-top: 5px;
	padding-bottom: 0px;
}	

.re-top_tour-area_box {
    width: 100%;
	margin-right: 0px;
}
/*ボタン767ここから*/
.re-top_button-area {
	margin-top: 20px;
	padding-bottom: 20px;
}	
/*ボタン767ここまで*/
	
/* 無限ループ767ここから */
.re-top_loop-area {
	padding-top: 0px;
}
/* 無限ループ767ここまで */
.re-in-top_tour-area_box {
    width: 100%;
	margin-right: 0px;
}
.re-island-box {
    width: 100%;
	margin-right: 0px;
}
.re-bn-area {
	display: block; /* 横並びトル */
	padding-top: 20px;
	padding-bottom: 20px;
}
.re-bn-box {
	padding: 15px;
    width: 100%;
	margin-bottom: 40px;
}	
.re-top_h2 {
	font-size: 20px;
	line-height: 1.2;
}	
.re-top_h2-bn_text {
	font-size: 14px;
	line-height: 1.6em;
}	
.re-loop_area {
	display: block;	/* 横並びトル */
}
/*ご案内ここから */
.re-top_info dt {
    float: none;
}
.re-top_info dd {
    padding-left: 0em;
}
/*ご案内ここまで */
.re-top_bg-area-color_eaf7ff {
	margin: 0 auto;
}
.re-top_bg-area-color_fff {
	margin: 0 auto;
}
.re-top_bg-area-color_69b7e5 {
	margin: 0 auto;
}
.re-top_cg-area figure {
	max-width: 45%; /*スマホのみ画像小さく表示 */
	margin-bottom: 20px;
	margin-top: 20px;
	margin-right: 15px;
}
.re-top_tour_h3 {
	width: 100%; /* 横幅 */
}
.re-in-top_tour_h3 {
	width: 100%; /* 横幅 */
}
.re-top_tour_price {
	font-size: 13px;
}
.re-in-top_tour_price {
	font-size: 13px;
}
.re-top_tour_h3-text {
	font-size: 12px;
}
.re-in-top_tour_h3-text {
	font-size: 12px;
}
.re-in-top_tour_price-day {
	font-size: 12px;
}
.re-top_cg-area figure:nth-child(even) {
        margin-right: 0
}
.re-in-top_tour_h3 a {
	font-size: 15px;
}
.re-top_tour_h3 a {
	font-size: 15px;
}
	
	
	
	
}

