/* CSS Document */
/************************************************************************************
RESET
*************************************************************************************/
html, body, div, span, applet, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre,a, abbr, acronym, address, big, cite, code,del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,b, u, i, center,dl, dt, dd, ol, ul, li,fieldset, form, label, legend,table, caption, tbody, tfoot, thead, tr, th, td, figure, mark{
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-size: 100%;
    vertical-align: baseline;
    background: transparent;
}
body {line-height: 1; -webkit-text-size-adjust: none;}
ol, ul { list-style: none;}
blockquote, q {quotes: none;}
blockquote:before, blockquote:after,q:before, q:after {content: ''; content: none;}
/* remember to define focus styles! */
:focus {outline: 0;}
/* remember to highlight inserts somehow! */
ins {text-decoration: none;}
del {text-decoration: line-through;}
/* tables still need 'cellspacing="0"' in the markup */
table {
   /* border-collapse: collapse;*/
    border-spacing: 0;
}
img {
  max-width: 100%;
  image-rendering: -webkit-optimize-contrast;
}
a img {border: none;}
.clean { clear:both;}
a {color: #292929; text-decoration: none; blr:expression(this.onFocus=this.blur()); outline: none; /* for Firefox */hlbr:expression(this.onFocus=this.blur()); /* for IE */}
a:hover {text-decoration:none;}
a:focus{ -moz-outline-style: none;}

.adbox{position: relative; padding: 4px;}
.adbox a{display:block;}
.adbox a:hover{opacity: 0.8;}
.b-box{
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
body {
	margin: 0;
	padding: 0;
	font-size:13px;	
	color:#000;		
}
.left{ float:left;display:inline-block;width: 100%;}
.right{ float:right;}
.wow:first-child {visibility: hidden;}

/*------------------------------- pc ----------------------------------*/
.container {
    width: 100%;
    height: 100%;
	font-family:Arial,微軟正黑體;
	overflow: hidden;
}

header {
  width: 100%;  	
}
header h1 {
  width: 100%;	
  text-indent: 101%;
  overflow: hidden;
  white-space: nowrap;
  position: absolute;  
}
main {
	font-size: 1.2em;
	width: 100%; 
	margin: 0 auto;	
	padding-top: 90px;
}
main h2{
	display:block;
	max-width:1000px;
	height:110px;
	margin:0 auto;
	margin-top: 85px;
	margin-bottom: 40px;
}
#hokkaido h2,#kanto h2,#kansai h2,#hokuriku h2,#tohoku h2,#kyushu h2,#shikoku h2,#okinawa h2,#japan-qa h2{ background: url(../images/tit-bg.webp) center 0  no-repeat;}
#seoul h2,#busan h2,#jeju h2,#korea-qa h2{ background: url(../images/tit-bg.webp) center 0 no-repeat;}
#england h2,#france h2,#netherlands h2,#german h2,#denmark h2,#turkey h2,#bulgaria h2,#europe-qa h2{ background: url(../images/tit-bg.webp) center -110px  no-repeat;}
#usa h2,#canada h2,#northamerica-qa h2{ background: url(../images/tit-bg.webp) center -220px  no-repeat;}

.t-title{	
	line-height: 100px;
	font-family: "LXGW WenKai TC", cursive;
	font-size: 32px;
	font-weight: 400;
	letter-spacing: 2px;
	color: #000;
	text-align: center;
}
.page-jp .bg{
	background-image: url(../images/jp-bg-f.webp),url(../images/jp-bg-1.webp);background-position: center top,top;background-repeat: no-repeat,repeat;background-color: #fef0f5;padding-bottom: 40px;
}
.page-jp .bg:nth-child(even){
	background:url(../images/jp-bg-2.webp)center top repeat;
	background-color: #ffe3ee;
	border-top: 4px solid #fbbed8;
	border-bottom: 4px solid #fbbed8;
	padding-bottom: 40px;
}
.page-kr .bg{
	background-image: url(../images/jp-bg-f.webp),url(../images/jp-bg-1.webp);background-position: center top,top;background-repeat: no-repeat,repeat;background-color: #f8effc;padding-bottom: 40px;
}
.page-kr .bg:nth-child(even){
	background:url(../images/jp-bg-2.webp)center top repeat;
	background-color: #f6e3ff;
	border-top: 4px solid #debefb;
	border-bottom: 4px solid #debefb;
	padding-bottom: 40px;
}
.page-eu .bg{
	background-image: url(../images/eu-bg-f.webp),url(../images/jp-bg-1.webp);background-position: center top,top;background-repeat: no-repeat,repeat;background-color: #e4f4ff;padding-bottom: 40px;
}
.page-eu .bg:nth-child(even){
	background:url(../images/jp-bg-2.webp)center top repeat;
	background-color: #cde7fc;
	border-top: 4px solid #add9fa;
	border-bottom: 4px solid #add9fa;
	padding-bottom: 40px;
}
.page-us .bg{
	background-image: url(../images/us-bg-f.webp),url(../images/jp-bg-1.webp);background-position: center top,top;background-repeat: no-repeat,repeat;background-color: #fef1e4;padding-bottom: 40px;
}
.page-us .bg:nth-child(even){
	background:url(../images/jp-bg-2.webp)center top repeat;
	background-color: #fee2c7;
	border-top: 4px solid #fbc49f;
	border-bottom: 4px solid #fbc49f;
	padding-bottom: 40px;
}
.page-jp .QA-bg{
	background-image: url(../images/qa-bg-1.webp),url(../images/qa-bg-2.webp),url(../images/qa-bg.webp);background-position: right top,left bottom,top;background-repeat: no-repeat, no-repeat,repeat;background-color: #feb3d1;padding-bottom: 80px;}
.page-kr .QA-bg{
	background-image: url(../images/qa-bg-3.webp),url(../images/qa-bg-4.webp),url(../images/qa-bg.webp);background-position: right top,left bottom,top;background-repeat: no-repeat, no-repeat,repeat;background-color: #dbb3fc;padding-bottom: 80px;}
.page-eu .QA-bg{
	background-image: url(../images/qa-bg-5.webp),url(../images/qa-bg-6.webp),url(../images/qa-bg.webp);background-position: right top,left bottom,top;background-repeat: no-repeat, no-repeat,repeat;background-color: #9bd2fb;padding-bottom: 80px;}
.page-us .QA-bg{
	background-image: url(../images/qa-bg-7.webp),url(../images/qa-bg-8.webp),url(../images/qa-bg.webp);background-position: right top,left bottom,top;background-repeat: no-repeat, no-repeat,repeat;background-color: #fda960;padding-bottom: 80px;}

.top_content {width: 100%;margin:0 auto;position:relative;height: 680px;}

.banner-slider {width: 100%;}
.banner-item {position: relative;outline: none;}
.banner {position: absolute;}
.banner-bg {width: 100%;height: 680px;object-fit: cover;display: block;}
.banner-title {position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);max-width: 50%;height: auto;pointer-events: none; /* 避免干擾點擊 */}

/*滑動menu*/
.sticky {
	top:40px !important;
	position: fixed !important;	
	/*height: 62px !important;*/	
}
.block-menu {
	position: absolute;	
	top: auto;
	width: 100%;	
	z-index: 10;
	background-color: #fff;
	box-shadow: 0 5px 6px -2px rgba(0, 0, 0, 0.1);
}
.block-menu ul {
	font-size: 0;
    position: relative;	   
    margin: auto;
	text-align: center;	
}
.block-menu li{	
	font-family: "LXGW WenKai TC", cursive;
	font-size: 18px;
	letter-spacing: 0.5px;	
	display: inline-block;  
	font-weight: 400;
    text-align: center;
    position: relative;
	margin-left: 2px;
	margin-right: 2px;
}
.block-menu li a {
	display: inline-block;      
    text-align: center;
    z-index: 11;
	color: #434343;
    position: relative;	
	padding: 7px 2px 5px;
	margin: 5px 6px 5px;
	border-bottom: solid 5px #fff;
}
.page-jp .block-menu li a:hover{color: #f83a8a;border-bottom: solid 2px #f83a8a;}
.page-jp .block-menu li a.active{color: #f83a8a;border-bottom: solid 2px #f83a8a;}
.page-kr .block-menu li a:hover{color: #7d2bf6;border-bottom: solid 2px #7d2bf6;}
.page-kr .block-menu li a.active{color: #7d2bf6;border-bottom: solid 2px #7d2bf6;}
.page-eu .block-menu li a:hover{color: #3a77f3;border-bottom: solid 2px #3a77f3;}
.page-eu .block-menu li a.active{color: #3a77f3;border-bottom: solid 2px #3a77f3;}
.page-us .block-menu li a:hover{color: #f47d42;border-bottom: solid 2px #f47d42;}
.page-us .block-menu li a.active{color: #f47d42;border-bottom: solid 2px #f47d42;}
.menu-list {width: 100%;height: 50px;margin: 0 auto;display: flex;justify-content: center;}
.page-jp .menu-list{background-color: #fc4e97;}
.page-kr .menu-list{background-color: #bb51da;}
.page-eu .menu-list{background-color: #4879d5;}
.page-us .menu-list{background-color: #fb6820;}

.menu-list li {text-align: center;}
.menu-list li a.nav-01 {padding: 0 15px;letter-spacing: 1.5px; color: #fff;line-height: 45px;font-size:24px;border-bottom: solid 0px;font-weight: 400;border-top-left-radius: 10px;border-top-right-radius: 10px;}
.page-jp .menu-list li a:hover.nav-01,.page-jp .menu-list li.on a.nav-01{padding: 0 15px;color: #c52468;background-color: #fff;border-bottom: solid 0px;}
.page-kr .menu-list li a:hover.nav-01,.page-kr .menu-list li.on a.nav-01{padding: 0 15px;color: #450a9d;background-color: #fff;border-bottom: solid 0px;}
.page-eu .menu-list li a:hover.nav-01,.page-eu .menu-list li.on a.nav-01{padding: 0 15px;color: #1259a8;background-color: #fff;border-bottom: solid 0px;}
.page-us .menu-list li a:hover.nav-01,.page-us .menu-list li.on a.nav-01{padding: 0 15px;color: #ca2b2b;background-color: #fff;border-bottom: solid 0px;}

#nav{z-index: 100 !important;}
#togglenav {
    display: none;
    z-index: 9999;
    position: fixed;
    right: 0;
    overflow: hidden;
    line-height: 35px;
    width: 100%;
    cursor: pointer;
}
.MainHeight{
		position:fixed !important;
		top:40px !important;
		z-index: 10 !important;
	}

/***行程***/
.box-01 {
    padding: 40px 0 0px 0; 
}
.box-02:first-of-type {
    margin-top: -40px;
}
.product-container {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 50px;
	max-width: 1100px;
	margin: 0 auto;
	padding: 0 15px;
}
.product-container > a {
	display: flex;	 
    width: 100%; 	
    max-width: calc(50% - 25px);
	will-change: transform; 
    backface-visibility: hidden; 
    -webkit-font-smoothing: antialiased;
}
a:hover .product-card {    
    transform: translateY(-4px);
}
a:hover .image-wrapper img {
    transform: scale(1.08); 
}
.product-card {
	position: relative; 
    width: 100%;    
    overflow: hidden;
    display: flex;
    flex-direction: column;
    transition: transform 0.3s ease;
}
.image-wrapper {
	position: relative;
    overflow: hidden; 
    width: 100%;	
    border-radius: 80px 0 0 0; 
    transform: translateZ(0);
}
.image-wrapper img {
	display: block;
    width: 100%;
    height: auto;
    transition: transform 0.4s ease;
}
.tag {
	position: absolute;
    top: 3%; 
    left: 0;
    color: #fff;
    padding: 8px 12px;
    font-family: "LXGW WenKai TC", cursive;
    font-weight: 400;
    font-size: 22px;
    border-radius: 15px 0 15px 0;
    z-index: 2;
}
.page-jp .tag{background-color: #c04ec3;}
.page-kr .tag{background-color: #984ec3;}
.page-eu .tag{background-color: #2e7bd3;}
.page-us .tag{background-color: #e26122;}
 
.card-content {
	padding: 15px 20px;
	display: flex;
	flex-direction: column;
	flex-grow: 1;
	background: #fff;
	border-radius: 0 0 80px 0;
	border: 1px solid #b5b5b5;
	margin-top: 10px;
}
.card-title {
	font-size: 24px;
	font-family: "LXGW WenKai TC", cursive;	
	font-weight: 500;
	color: #000;
	margin: 0 0 15px 0;
	padding-bottom: 5px;
	line-height: 1.4;
}
.page-jp .card-title{border-bottom: 2px solid #f8b1cf;}
.page-kr .card-title{border-bottom: 2px solid #bdb1f8;}
.page-eu .card-title{border-bottom: 2px solid #b1c7f8;}
.page-us .card-title{border-bottom: 2px solid #f5be96;}

.card-details {
	list-style: none;
	padding: 0;
	margin: 0 0 10px 0;
	flex-grow: 1;
}
.card-details li {
	font-size: 14px;
	font-family: "微軟正黑體";
	font-weight: 600;
	color: #707070;
	margin-bottom: 6px;
	line-height: 1.5;
}
.card-price {
	margin-top: auto; 
	text-align: center;	
	font-weight: 600;
	font-size: 14px;
	color: #000;
}
.card-price strong{	
	font-size: 28px;
	color: red;
	padding: 0 2px;
}

/*頁籤*/
.tabs-container { 
  margin: 0 auto; 
  max-width: 1150px; 
  margin-top: 80px; 
  margin-bottom: 60px; 
}
.tab-content-outer { 
  border-radius: 20px; 
  background: #ffffff; 
  padding: 15px 15px 0; 
  margin: 0 15px;
  border: 1px solid #b5b5b5;
}
.tabs-box { 
  margin: 50px auto 30px auto;
  padding: 0;
  list-style: none; 
  display: flex;          
  justify-content: center; 
  align-items: center;    
  flex-wrap: wrap;    
}
.tabs-box li { 
  margin: 5px 6px;  
}
.tabs-box li.tab01 a {
  display: inline-block; 
  min-width: 70px;
  background: rgba(255,255,255,0.7);
  border-radius: 10px; 
  padding: 8px 15px;
  font-family: "LXGW WenKai TC", cursive;
  font-size: 24px;
  font-weight: 400;
  border: 1px solid #b5b5b5;
  text-decoration: none;  
  text-align: center; 
}
.page-jp .tabs-box li.tab01 a {color: #a76aab;}
.page-jp .tabs-box li.tab01 a:hover,.page-jp  .tabs-box li.tab01 a.active {border: 1px solid #bd4cc5;background: #bd4cc5;color: #fff;}
.page-kr .tabs-box li.tab01 a {color: #926aab;}
.page-kr .tabs-box li.tab01 a:hover,.page-kr  .tabs-box li.tab01 a.active {border: 1px solid #984ec3;background: #984ec3;color: #fff;}
.page-eu .tabs-box li.tab01 a {color: #54769d;}
.page-eu .tabs-box li.tab01 a:hover,.page-eu .tabs-box li.tab01 a.active {border: 1px solid #4089db;background: #4089db;color: #fff;}
.page-us .tabs-box li.tab01 a {color: #a96746;}
.page-us .tabs-box li.tab01 a:hover,.page-us .tabs-box li.tab01 a.active {border: 1px solid #f35a0f;background: #f35a0f;color: #fff;}

/*---直式行程---*/
.product {margin: 0 auto;margin-bottom: 10px;display:block;overflow:hidden;padding-top: 20px;}
.product a {display: block;padding: 6px 10px;overflow: hidden;border-bottom: solid 1px #c9c9c9;margin-bottom: 5px;font-weight: bold;transition: transform 0.3s ease-out;
	will-change: transform; 
    backface-visibility: hidden; 
    -webkit-font-smoothing: antialiased;
}
.product a:hover {transform: translateX(6px);}
.product em{display: inline-block;font: 14px "微軟正黑體";padding: 1px 4px 2px;font-weight: bold;}
.page-jp .product em{color: #bd4cc5;}
.page-kr .product em{color: #904cc5;}
.page-eu .product em{color: #3b76e2;}
.page-us .product em{color: #d25a20;}
.txt_l{width: auto;font-family: "LXGW WenKai TC", cursive;font-size: 18px;font-weight: 500;color: #000;line-height: 2;}
.txt_l strong{color: #a3020f;}
.txt_r{width: auto;text-align:right;font-family:"微軟正黑體";font-size:14px;line-height: 1.5;}
.txt_r strong{ color: #F50909;font-size:22px;padding-left: 2px;}
.page-jp .txt_l::before {content: url(../images/flower-jp.webp);display: inline-block;width: 21px;height: 21px;margin-right: 5px;padding-top: 4px;vertical-align: top;}
.page-kr .txt_l::before {content: url(../images/flower-kr.webp);display: inline-block;width: 21px;height: 21px;margin-right: 5px;padding-top: 4px;vertical-align: top;}
.page-eu .txt_l::before {content: url(../images/flower-eu.webp);display: inline-block;width: 21px;height: 21px;margin-right: 5px;padding-top: 4px;vertical-align: top;}
.page-us .txt_l::before {content: url(../images/flower-us.webp);display: inline-block;width: 21px;height: 21px;margin-right: 5px;padding-top: 4px;vertical-align: top;}

.travel-group .departure-tag {
  display: none;}
.travel-group:has(a) .departure-tag {
  display: flex;
}
.travel-group {
  display: none;
  padding-bottom: 30px;
}
.travel-group:has(a) {
  display: block; 
}


.departure-tag {
	display: inline-flex;
	flex-direction: column;
	align-items: center;
	width: 100%;
} 
.departure-text {	
	font-family: "LXGW WenKai TC", cursive;
	font-size: 21px;
	font-weight: 400;
	letter-spacing: 1px;
	margin-bottom: 20px;
	padding-bottom: 5px;	
	position: relative;
}        
.departure-text::after {
	content: "";
	position: absolute;
	top: 27px;
	left: 50%;
	transform: translateX(-50%);
	border-left: 6px solid transparent;
	border-right: 6px solid transparent;	
}
.page-jp .departure-text { color: #bd4cc5;border-bottom: 2px solid #bd4cc5; }
.page-jp .departure-text::after { border-top: 9px solid #bd4cc5; }
.page-kr .departure-text { color: #8b4cc5;border-bottom: 2px solid #8b4cc5; }
.page-kr .departure-text::after { border-top: 9px solid #8b4cc5; }
.page-eu .departure-text { color: #4089db;border-bottom: 2px solid #4089db; }
.page-eu .departure-text::after { border-top: 9px solid #4089db; }
.page-us .departure-text { color: #e26122;border-bottom: 2px solid #e26122; }
.page-us .departure-text::after { border-top: 9px solid #e26122; }

/*QA*/
.qa-container {
	max-width: 850px;
	min-height: 400px;
	margin: 0 auto;	
	line-height: 1.4;
	padding: 0 4%;
	letter-spacing: 1px;
	font-family: sans-serif;
}
.qa-item {	
	border-radius: 10px;
	margin-bottom: 30px;
	transition: background-color 0.3s ease, border-color 0.3s ease;		
	display: block;
	overflow: hidden;	
}
.page-jp .qa-item {background-color: #fdeaf1;}
.page-kr .qa-item {background-color: #f6e9fd;}
.page-eu .qa-item {background-color: #e0f2fc;}
.page-us .qa-item {background-color: #fcefdf;}
.qa-toggle {
	display: none;
}
.qa-label {
	font-size: 22px;
	font-weight: bold;
	cursor: pointer;
	padding: 15px 20px;
	color: #000;
	position: relative;
	padding-left: 45px;
	text-align: justify;
	display: block;
}
.qa-label::before {
	content: "▶";
	position: absolute;
	left: 20px;
	top: 18px;
	font-size: 0.8em;
	color: #ff0000;
	transition: transform 0.2s ease;
}
.qa-content {	
	margin: 0 20px;
	font-size: 18px;
	color: #000;	
	border-top: 1px dashed #aaaaaa;
	padding: 15px 0;
	display: none; 
}
.qa-content p {	
	text-align: justify;
	margin: 0;
	display: block;
}
.qa-list {
	display: flex;
	flex-direction: column;
	gap: 10px; 
}
.qa-content ul {
  margin: 0;
  padding-left: 20px;    
  display: flex;
  flex-direction: column;
  gap: 10px;                  
}
.qa-content li {
  text-align: justify;
  line-height: 1.6;  
	list-style-type: disc; 
}
.qa-toggle:checked + .qa-item {
	background-color: #fff;	
	border-color: #b5b5b5;
}
.qa-toggle:checked + .qa-item .qa-label::before {
	transform: rotate(90deg);
}
.qa-toggle:checked + .qa-item .qa-content {
	display: block;
}

/*QA表格*/
table {width: 100%;border-collapse: collapse;font-family:Arial,微軟正黑體;}
th, td {padding: 12px 15px;text-align: center;font-size: 18px;vertical-align: middle;}
th span{font-size: 14px;letter-spacing: 1px;padding-left: 3px;}
th:first-child, td:first-child {border-right: 2px solid white;width: 40%;}
th:last-child, td:last-child {width: 60%;}
tr:nth-child(even) {background-color: #fff;}
tr:nth-child(odd) {background-color: #ffecf4;} 
tr:hover {background-color: #fedaea !important;cursor: pointer;}
th {
  background-color: #fc7ca0;
  color: white;
  font-size: 24px;
  font-weight: bold;
  letter-spacing: 2px;
  text-align: center;
  display: table-cell;      
  vertical-align: middle;  
}

/*影片*/
.video-container {
	margin: 0 auto; 
	display: flex;
	align-items: center;
	flex-wrap: wrap; 
	justify-content: center; 
	gap: 20px; 
	width: 96%; 
	padding: 20px 2% 0;
}
.video-box {
	flex: 1 1 500px;
	max-width: 850px; 
	position: relative;
	height: 500px;	
	background-color: #000;
	border-radius: 20px;
	overflow: hidden;
}
.video-box:only-child {
	max-width: 850px;
	height: 500px;
}



:first-child.wow{ *visibility:visible ! important; visibility:visible\9 ! important;}

@media only screen and (min-width: 769px) and (max-width:960px){	
    html,body { width: 100%; min-height: 100%; }
	main h2{max-width:100%;} 	
	.title_mobile{display: none;}	
}

/*------------------------------- 平板 ----------------------------------*/

@media screen and (max-width: 768px) {
    * { box-sizing: border-box; }
    html,body { width: 100%; min-height: 100%; }  
    /***按鈕列***/
    #nav {display: none;}
	main{padding-top: 0px;}
	main h2{margin-top: 20px;} 
    #togglenav {display: block;z-index: 9999;position: fixed;right: 0;overflow: hidden;line-height: 35px;width: 100%;cursor: pointer;}	
	.top_content {height: auto;margin-top: 40px;}
	.box-01{padding: 30px 0 0px 0;}
	.box-02 {margin-top: 0px;}
	.slick-dotted.slick-slider{margin-bottom: 0px!important;}
	.banner-bg {height: 520px;}
	.banner-title {max-width: 55%;}
	.product-container {gap: 20px;padding: 0 0px;}	
	.txt_l{line-height: 1.5;width: 80%;}	
	.video-box {height: 400px;}
	.video-box:only-child {height: 400px;}
	.box-02:first-of-type {margin-top: 0px;}

	
}


/*------------------------------- 手機 ----------------------------------*/

@media (max-width: 680px) {
    * { box-sizing: border-box; }
    html, body {width: 100%; min-height: 100%; }
	.left,.right{ float:none;}	
	.banner-bg {height: 480px;}
	.banner-title {max-width: 60%;}
	.product-container {gap: 40px;}
	.product-container > a {max-width: calc(95% - 10px);}
	.tabs-container {margin-top: 50px;}
	.tabs-box{margin: 50px auto 15px auto;}	
	.txt_l{width: 100%;}
	.txt_r {width: 100%;display: block; text-align: center;margin-top: 10px;margin-bottom: 5px;}
	.product em{font: 16px "微軟正黑體";}
	.video-box {height: 360px;}
	.video-box:only-child {height: 360px;}

	
}
@media (max-width: 480px) {
    * { box-sizing: border-box; }
    html, body {width: 100%; min-height: 100%; }
	.left,.right{ float:none;}	
	.banner-bg {height: 450px;}
	.banner-title {max-width: 70%;}
	.video-box {height: 300px;}
	.video-box:only-child {height: 300px;}
	
}