*{
	margin:0;
	padding:0;
	-webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
}

html,body{
	width:100%;
	background-color:#333;
}

#japan_ski{
	min-width:320px;
	max-width:1920px;
	margin:0 auto;
	overflow:hidden;
	background-color:#effbfe;
	position:relative;
}


/* ==================== 逐漸出現動畫效果 ==================== */

.fadein {
  opacity : 0;
  transform: translateY(20px);
  transition: all 1s;
}

.animated {
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}


/*==================================== 主視覺 ====================================*/ 

#japan_ski .main_top{
	width:100%;	
    height: 0;
    padding-bottom: 56.25%;
	background-color: #1e5d9c;
    position: relative;
	
}

#japan_ski .main_top h1{
	width: 37.5%;
	text-indent: -9999px;
	position:absolute;
	top: 45%;
	left: 50%;
	transform: translate(-50%, -50%); 
    margin: 0 auto;
	z-index: 40;
	
    animation:logoup 2s 1;
    -moz-animation:logoup 2s 1;
    -webkit-animation:logoup 2s 1;
}

@keyframes logoup{
	from{filter: opacity(0);}
	to{filter: opacity(1);}
}

#japan_ski .main_top h1 .main_logo{
	width: 60%;
	height: 0;
	padding-bottom: 35%;
	background: url("img_mainLogo.svg") no-repeat left top;
	background-size: 100%;
	margin: 0 auto;
}

#japan_ski .main_top h1 .main_title{
	width: 56%;
	height: 0;
	padding-bottom: 32%;
	background: url("img_mainTitle.png") no-repeat left top;
	background-size: 100%;
	margin: 0 auto;
}

#japan_ski .pull-tour{
	width: 4.167%;
	height:auto;
	position: fixed;
	top: 20%;
	right: 20px;
	z-index: 100;
	display: none;
	
    animation:gototours 2s 1;
    -moz-animation:gototours 2s 1;
    -webkit-animation:gototours 2s 1;
}

@keyframes gototours{
	from{filter: opacity(0);}
	to{filter: opacity(1);}
}

#japan_ski .pull-tour a.btn-pulltour{
	display: block;
	width: 100%;
	height: 0;
	padding-bottom: 300%;
	text-indent: -9999px;
	background: url("img_btn_pulltour.png") no-repeat left top;
	background-size: 100%;
	border-radius: 10px;
	cursor: pointer;
}

#japan_ski .pull-tour a.btn-pulltour:hover{
	background: url("img_btn_pulltour02.png") no-repeat left top;
	background-size: 100%;
}

#japan_ski .dec_top_l{
	width: 18%;
	height: 0;
	padding-bottom: 38%;
	background: url("img_topdec_l.png") no-repeat left top;
	background-size: 100%;
	pointer-events: none;
	position: absolute;
	left: -1%;
	bottom: 0;
	z-index: 29;
}

#japan_ski .dec_top_r{
	width: 15.625%;
	height: 0;
	padding-bottom: 21.875%;
	background: url("img_topdec_r.png") no-repeat left top;
	background-size: 100%;
	position: absolute;
	top: 0;
	right: 0;
	z-index: 29;
}

#japan_ski .scroll_down{
	width: 3.125%;
	height: 0;
	padding-bottom: 10.43333%;
	background: url("img_scroll.gif") no-repeat left top;
	background-size: 100%;
	pointer-events: none;
	position: absolute;
	left: 20px;
	bottom: -20px;
	z-index: 32;

}

#japan_ski .screen_cover{
	width: 100%;
	height: 0;
	padding-bottom: 56.25%;
	background: url("img_header_bk.png");
	/*pointer-events: none;*/
	position: absolute;
	top:0;
	left:0;
	z-index: 30;
	
}

#japan_ski .mobile-header{
	display: none;	
}

/* ==================== 影片 ==================== */

#japan_ski .filmin-in{
	width: 100%;
	height:auto;
	background-color: #d8e9ef;
	margin: 0 auto;
	position: relative;
	
}

#japan_ski .filmin{/* 讓影片能跟著RWD一同縮放-單一影片 */
	width:100%;
	margin:0px auto;
	position: relative;
	height: 0;
    padding-bottom: 56.25%;/* 16:9  56.25%x 1*/
   
}

#japan_ski .filmin iframe{
	position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

/* ==================== 選單 ==================== */

#japan_ski nav{
	width: 80%;
	margin: 50px auto;
	text-align: center;
}

#japan_ski nav.nav_inner{
	margin: 50px auto 0;
}


#japan_ski nav a{
	display: inline-block;
	vertical-align: top;
	width: 13.6%;
	height: 0;
	padding-bottom: 6.32%;
	text-indent: -9999px;
	border-left: 1px #999 dotted;
}

#japan_ski nav a:last-child{
	border-right: 1px #999 dotted;
	
}

#japan_ski nav a.btn001{
	background: url("img_btn_hori0101.png") no-repeat left top;
	background-size: 100%;
}

#japan_ski nav a.btn001:hover{
	background: url("img_btn_hori0102.png") no-repeat left top;
	background-size: 100%;
}

#japan_ski nav a.btn002{
	background: url("img_btn_hori0201.png") no-repeat left top;
	background-size: 100%;
}

#japan_ski nav a.btn002:hover{
	background: url("img_btn_hori0202.png") no-repeat left top;
	background-size: 100%;
}

#japan_ski nav a.btn003{
	background: url("img_btn_hori0301.png") no-repeat left top;
	background-size: 100%;
}

#japan_ski nav a.btn003:hover{
	background: url("img_btn_hori0302.png") no-repeat left top;
	background-size: 100%;
}

#japan_ski nav a.btn004{
	background: url("img_btn_hori0401.png") no-repeat left top;
	background-size: 100%;
}

#japan_ski nav a.btn004:hover{
	background: url("img_btn_hori0402.png") no-repeat left top;
	background-size: 100%;
}

#japan_ski nav a.btn005{
	background: url("img_btn_hori0501.png") no-repeat left top;
	background-size: 100%;
}

#japan_ski nav a.btn005:hover{
	background: url("img_btn_hori0502.png") no-repeat left top;
	background-size: 100%;
}


#nav_fixed{
	width: 100%;
	background-color: rgba(255,255,255,0.8);
 	position: fixed;
	top: -200px; 
	transition: .5s;
	z-index: 80;
}


#nav_fixed.is-show{
  top: 5px;
	
  animation:backopen 2s 1;
  -moz-animation:backopen 2s 1;
  -webkit-animation:backopen 2s 1;
}

@keyframes backopen{
	from{filter: opacity(0);}
	to{filter: opacity(1);}
}

#nav_fixed02{
	display: none;
}

/* ==================== 下方區塊設定 ==================== */

#japan_ski article{
	padding:50px 0;
}

#japan_ski article>h2{
	width: 21.875%;
	height: 0;
	padding-bottom: 10.42%;
	margin: 0 auto 100px;
	text-indent:-9999px;
	background-color: coral;
}

#japan_ski h2.title01{
	background: url("img_title01.png") no-repeat left top;
	background-size: 100%;
}

#japan_ski h2.title02{
	background: url("img_title02.png") no-repeat left top;
	background-size: 100%;
}

#japan_ski h2.title03{
	background: url("img_title03.png") no-repeat left top;
	background-size: 100%;
}

#japan_ski h2.title04{
	background: url("img_title04.png") no-repeat left top;
	background-size: 100%;
}

#japan_ski h2.title05{
	background: url("img_title05.png") no-repeat left top;
	background-size: 100%;
}

#japan_ski h2:after{
	content: ""; /*產生一個空的元素*/
	width: 39.58%;
	height: 0;
	padding-bottom: 10.43%;
	background:url(img_areaLine.png) repeat-x top center;
	background-size:100%;
	position:absolute;
	right:0%;
}

#japan_ski h2:before{
	content: ""; /*產生一個空的元素*/
	width: 39.58%;
	height: 0;
	padding-bottom: 10.43%;
	background:url(img_areaLine.png) repeat-x top center;
	background-size:100%;
	position:absolute;
	left:0%;
}


/* ==================== 滑雪場介紹 ==================== */

#japan_ski .ski_resort{
	width: 100%;
	margin: 0 auto;
	position: relative;
}

/* -- 圖片輪播 -- */

#japan_ski .slider-content{
	width:100%;
	
}
#japan_ski .slider-content-m{
	display:none;
}

#japan_ski .pic-frame{
	padding:15px;
	margin:0 25px;

}

#japan_ski .pic-frame img{
	width:100%;
	height:auto;
	display: block;
}



/* ==================== 行程推薦 ==================== */


#japan_ski .tours_area{
	background-color: #dae5e8;
	position: relative;
}

#japan_ski .tour_type{
	width: 62.5%;
	margin: 0 auto 6.25vw;
	
}

#japan_ski h3{
	display: block;
	width: 25%;
	height: 0;
	padding-bottom: 5%;
	margin: 20px auto;
	text-indent: -9999px;
}

#japan_ski h3.type01{
	background: url("img_stt01.png") no-repeat left top;
	background-size: 100%;
}

#japan_ski h3.type02{
	background: url("img_stt02.png") no-repeat left top;
	background-size: 100%;
}

#japan_ski .tour_list{
	width: 100%;
}

#japan_ski .rowField{
	width: 100%;
	font-size: 1.4rem;
	min-height: 50px;
	line-height: 50px;
	margin-bottom: 2px;
	display: table;
}

#japan_ski .title_field{
	background-color: #8d9a9e;
	font-weight: 600;
	color: #fff;
}

#japan_ski .title_field div,
#japan_ski .tour_field div{
	vertical-align: middle;
}

#japan_ski .tour_field{
	background-color: #FFF;
	min-height: 50px;
	line-height: 50px;
	color: #444;
}

#japan_ski .tour_field div{
	vertical-align: middle;
}

#japan_ski .airplane,#japan_ski .departure,#japan_ski .tour_name{
	display: table-cell;
	vertical-align: top;
}

#japan_ski .airplane{
	width: 15%;
	margin-right: 3px;
	text-align: center;
	border-right: #dae5e8 2px solid;
}

#japan_ski .departure{
	width: 15%;
	margin-right: 3px;
	text-align: center;
	border-right: #dae5e8 2px solid;
}

#japan_ski .tour_name{
	width: 67%;
	text-align: left;
	padding-left: 1%;
}

#japan_ski .title_field .tour_name{
	text-align: center;
}

#japan_ski .tour_name p,
#japan_ski .tour_name a{
	display: inline-block;
	vertical-align: middle;
}

#japan_ski .tour_name p{
	width: 76.8%;
	margin-right: 5px;
	padding: 5px 0;
}


#japan_ski .tour_name a{
	width: 20%;
	height: 40px;
	text-align: center;
	text-decoration: none;
	padding: 1px 0;
	margin: 5px 1% 5px 5px;
	line-height: 38px;
	font-size: 1.3rem;
	font-weight: 600;
	border-radius: 20px;
}

#japan_ski .tour_name a.tour_order{
	color: #444;
	background-color: #ffd800;
	transition: all .4s ease;	
}


#japan_ski .tour_name a.tour_order:hover{
	background-color: #1e5d9c;
	color: #fff;
}


#japan_ski .tour_name a.tour_soldout{
	color: #FFF;
	background-color: #cd0024;
}


/* ==================== 渡假村資訊 ==================== */

#japan_ski .resorts_area{
	background-color: #FFF;
	clear: both;
	position: relative;
}

#japan_ski .resort_content{
	width: 1200px;
	margin: 0 auto 6.25vw;
	overflow: auto;
	clear: both;
	padding-bottom: 50px;
	border-bottom: #999 2px dotted;
}

#japan_ski .resort_content:last-child{
	border: none;
}

#japan_ski .resortIn_pic{
	width: 63.33%;
}

#japan_ski .resortIn_txt{
	width: 35%;
	height: 680px; /* resort_content寬度有變化時要調整為vw */
	position: relative;
	display: flex;
	align-items: center;
}

#japan_ski .L_part{
	float: left;
}

#japan_ski .R_part{
	float: right;
}

#japan_ski .resortIn_pic img{
	display: block;
	width: 100%;
	height: auto;
}

#japan_ski .txt_box{
	width: 100%;
	padding: 0 3.5%;
}


#japan_ski .txt_box h3{
	width: 100%;
	height: 0;
	padding-bottom: 42.11%;
	text-indent: -9999px;
}

#japan_ski .txt_box p{
	color: #444;
	font-size: 1.4rem;
	line-height: 2.6rem; 
}

#japan_ski .txt_box h3.resort_tt01{
	background: url("img_resortin_tt01.png") no-repeat left top;
	background-size: 100%;
}

#japan_ski .txt_box h3.resort_tt02{
	background: url("img_resortin_tt02.png") no-repeat left top;
	background-size: 100%;
}

#japan_ski .txt_box h3.resort_tt03{
	background: url("img_resortin_tt03.png") no-repeat left top;
	background-size: 100%;
}


/* ==================== 必備裝備 ==================== */

#japan_ski .equip_area{
	clear: both;
	background-color: #dae5e8;
	text-align: center;
	position: relative;
}

#japan_ski .equip_content{
	width: 100%;
	margin-bottom: 6.25vw;
}

#japan_ski .equip_box{
	display: inline-block;
	vertical-align: top;
	width: 29%;
	margin: 0 2%;
	background-color: #FFF;
	border-radius: 1rem;
	padding: 50px 1%;
	-webkit-box-shadow: 0 0 5rem 0.4rem rgba(0, 0, 0, 0.1);
    box-shadow: 0 0 5rem 0.4rem rgba(0, 0, 0, 0.1);
}

#japan_ski .equip_box h3{
	width: 52.64%;
	height: 0;
	padding-bottom: 10.528%;
	text-indent: -9999px;
	margin: 0 auto 50px;
	
}

#japan_ski .equip_box h3.equip_tt01{
	background: url("img_stt03.png") no-repeat left top;
	background-size: 100%;
}

#japan_ski .equip_box h3.equip_tt02{
	background: url("img_stt04.png") no-repeat left top;
	background-size: 100%;
}



#japan_ski .equip_box img{
	width: 100%;
	height: auto;
	display: block;
}

/* ==================== 常見問題 ==================== */

#japan_ski .qa_area{
	background-color: #FFF;
}

#japan_ski .fqa_content{
	width: 1200px;
	margin: 0 auto;
	padding: 0 3.5%;
}

#japan_ski ul.fqa_lsit{
	list-style: none;
	display: block;
	width: 100%;
	padding-left: 3.5%;
}

#japan_ski ul.fqa_lsit li{
	margin-bottom: 30px;
	padding-bottom: 30px;
	border-bottom: #999 2px dotted;
}

#japan_ski ul.fqa_lsit li:last-child{
	border:none;
}

#japan_ski h4.fqa_list_q{
	font-size: 1.625rem;
	line-height: 2.6rem;
	font-weight: 600;
	color: #64b6d1;
	padding: 5px 0 5px 7%;
	margin-bottom: 20px;
	position: relative;
}

#japan_ski h4.fqa_list_q:before{
	content: ""; /*產生一個空的元素*/
	width: 4.6%;
	height: 0;
	padding-bottom: 4.6%;
	background:url(img_fqa_q.png) repeat-x top center;
	background-size:100%;
	position:absolute;
	left:0%;
}

#japan_ski .fqa_list_a{
	font-size: 1.4rem;
	line-height: 2.4rem;
	word-break: break-all;
	color: #444;
	padding: 5px 0 5px 7%;
	position: relative;
}

#japan_ski .fqa_list_a:before{
	content: ""; /*產生一個空的元素*/
	width: 4.6%;
	height: 0;
	padding-bottom: 4.6%;
	background:url(img_fqa_a.png) repeat-x top center;
	background-size:100%;
	position:absolute;
	left:0%;
}




/* ==================== 底 ==================== */

#japan_ski .page_footer{
	width: 100%;
	height: 0;
	padding-bottom: 38%;
	background: url("img_footer_bk.jpg") no-repeat right bottom;
	background-size: 100%;
	background-position: right bottom;
	background-color: #FFF;
	position: relative;
}

/* ==================== 下面會跑出來的LOGO ==================== */

#japan_ski .logo_goggles{
	display: block;
	width: 12.5%;
	height: 0;
	padding-bottom: 8.333333%;
	background: url("img_mainLogo_c.svg") no-repeat left top;
	background-size: 100%;
}

#japan_ski .logo_m{
	display: none;
	
}

#japan_ski .logo03{
	position: absolute;
	left: 20%;
	bottom: -5%;
	z-index: 10;
	opacity:0;
	
	animation-name:logo_swing03;
	animation-fill-mode:forwards;/* 動畫播放前後模式:動畫結束後，保持在最後一個影格狀態。 */
	animation-duration:2s;
}

@keyframes logo_swing03{
		
    from{
		bottom:-5%;
		opacity:0;
    }
	
	10%{
		transform:rotate(5deg);
	}
	
	20%{
		transform:rotate(-5deg);
	}
	
	30%{
		transform:rotate(10deg);
	}
	
	40%{
		transform:rotate(-10deg);
	}
	
	50%{
		transform:rotate(5deg);
	}
	
	60%{
		transform:rotate(-5deg);
	}
	
	70%{
		transform:rotate(10deg);
	}
	
	80%{
		transform:rotate(-10deg);
	}
	
	100%{
		transform:rotate(0deg);
	}
	
    to{
		bottom: 20%;
		opacity:1;
    }
	
}

#japan_ski .logo02{
	position: absolute;
	right: 0;
	top: 10%;
	z-index: 10;
	opacity:0;
	
	animation-name:logo_swing02;
	animation-fill-mode:forwards;/* 動畫播放前後模式:動畫結束後，保持在最後一個影格狀態。 */
	animation-duration:2s;
}


@keyframes logo_swing02{
		
    from{
		right:0;
		opacity:0;
    }
	
	10%{
		transform:rotate(5deg);
	}
	
	20%{
		transform:rotate(-5deg);
	}
	
	30%{
		transform:rotate(10deg);
	}
	
	40%{
		transform:rotate(-10deg);
	}
	
	50%{
		transform:rotate(5deg);
	}
	
	60%{
		transform:rotate(-5deg);
	}
	
	70%{
		transform:rotate(10deg);
	}
	
	80%{
		transform:rotate(-10deg);
	}
	
	100%{
		transform:rotate(0deg);
	}
	
    to{
		right: 10%;
		opacity:1;
    }
	
}


#japan_ski .logo01{
	position: absolute;
	left: 0;
	top: 20%;
	z-index: 10;
	opacity:0;
	
	animation-name:logo_swing01;
	animation-fill-mode:forwards;/* 動畫播放前後模式:動畫結束後，保持在最後一個影格狀態。 */
	animation-duration:2s;
}

@keyframes logo_swing01{
		
    from{
		left:0;
		opacity:0;
    }
	
	10%{
		transform:rotate(5deg);
	}
	
	20%{
		transform:rotate(-5deg);
	}
	
	30%{
		transform:rotate(10deg);
	}
	
	40%{
		transform:rotate(-10deg);
	}
	
	50%{
		transform:rotate(5deg);
	}
	
	60%{
		transform:rotate(-5deg);
	}
	
	70%{
		transform:rotate(10deg);
	}
	
	80%{
		transform:rotate(-10deg);
	}
	
	100%{
		transform:rotate(0deg);
	}
	
	
    to{
		left:6%;
		opacity:1;
    }
	
	
}

	
#japan_ski .logo04{
	position: absolute;
	left: 0;
	top: 10%;
	z-index: 10;
	opacity:0;
	
	animation-name:logo_swing04;
	animation-fill-mode:forwards;
	animation-duration:2s;

}


@keyframes logo_swing04{
		
    from{
		left:0;
		opacity:0;
    }
	
	10%{
		transform:rotate(5deg);
	}
	
	20%{
		transform:rotate(-5deg);
	}
	
	30%{
		transform:rotate(10deg);
	}
	
	40%{
		transform:rotate(-10deg);
	}
	
	50%{
		transform:rotate(5deg);
	}
	
	60%{
		transform:rotate(-5deg);
	}
	
	70%{
		transform:rotate(10deg);
	}
	
	80%{
		transform:rotate(-10deg);
	}
	
	90%{
		transform:rotate(10deg);
	}
	
	100%{
		transform:rotate(0deg);
	}
	
	
    to{
		left:10%;
		opacity:1;
    }
	
	
}




/*==================================== 【RWD尺寸開始】 ====================================*/


@media screen and (max-width: 1366px){ 
	
	
	#japan_ski .resort_content,
	#japan_ski .fqa_content{
		width: 80%;
    }

	#japan_ski .rowField{
		font-size: 1rem;
	}
	
	#japan_ski .tour_field{
		line-height: 2rem;
	}
	
	#japan_ski .tour_name a{
		font-size: 1rem;
	}

}

@media screen and (max-width: 1280px){ 
	
	#japan_ski .main_top h1{
		width: 45%;
	}
	
	#japan_ski .resort_content,
	#japan_ski .fqa_content{
		width: 70%;
    }
	
	#japan_ski nav {
		width: 90%;
	}
	
	#japan_ski .resortIn_txt {
		height: 45.5vw;
	}
	
	#japan_ski .txt_box p {
		font-size: 1.2rem;
    	line-height: 2.2rem;
	}
	
	#japan_ski .equip_box {
		width: 32%;
	}
	
	#japan_ski .fqa_list_a {
    	font-size: 1.2rem;
		line-height: 2.2rem;
	}

}

@media screen and (max-width: 1024px){
	
	#japan_ski nav {
		width: 100%;
	}
	
	#japan_ski .tour_name p {
		width: 70%;
	}
	
	#japan_ski .tour_name a {
		font-size: 18px;
		width: 25%;
	}
	
	#japan_ski h4.fqa_list_q {
    	font-size: 1.4rem;
		line-height: 2.4rem;
		padding: 5px 0 5px 7%;
	}
	
	
	#japan_ski .fqa_list_a{
		padding: 5px 0 5px 7%;
	}
	
	#japan_ski h4.fqa_list_q:before,
	#japan_ski .fqa_list_a:before{
		width: 6%;
    	height: 0;
    	padding-bottom: 6%;
	}
	
	
	
}


@media screen and (max-width: 800px){ 
	
	#japan_ski .main_top{
		width:100%;	
		height: 0;
		padding-bottom: 100vh;
		
		position: relative;

	}
	
	#japan_ski .dec_top_r {
    	width: 25%;
    	height: 0;
		padding-bottom: 35%;
	}
	
	#japan_ski .dec_top_l {
    	width: 35%;
    	height: 0;
		padding-bottom: 75.25%;
	}

	#japan_ski .main_top h1{
		width: 80%;
		position:absolute;
		top: 8%;
		left: 0;
		right: 0;
		bottom: 0;
		transform: inherit;
		margin: 0 auto;
		z-index: 40;
	}
	
	#japan_ski .scroll_down {
		width:10%;
		height: 0;
		padding-bottom: 33.3333%;
		position: absolute;
		left: 10px;
		bottom: -20px;
		z-index: 32;
	}
	
	#japan_ski .pull-tour {
		width: 6%;
		right: 10px;
	}

	#japan_ski .screen_cover{
		width: 100%;
		height: 0;
		padding-bottom: 100vh;
		background: url("img_header_bk.png");
		pointer-events: none;
		position: absolute;
		top:0;
		left:0;
		z-index: 30;

	}

	#japan_ski .mobile-header{
		display: block;
		width: 100%;
		height: 0;
		padding-bottom: 100vh;
		background: url("img_mobileTop_bk.jpg") no-repeat right top;
		background-size: cover;
	}

	/* ==================== 影片 ==================== */
	
	
	#japan_ski .filmin-in{
		display: none;
	}

	#japan_ski .filmin{/* 讓影片能跟著RWD一同縮放-單一影片 */
		width:100%;
		margin:0px auto;
		position: relative;
	    height: 0;
		padding-bottom: 56.28%; /* 16:9  56.25%x 1*/

	}
	
	/* ==================== 下方內容 ==================== */
	
	
	#japan_ski nav a {
    	width: 18.5%;
    	height: 0;
		padding-bottom: 8.59%;
	}
	
	#japan_ski article>h2 {
		width: 40%;
		height: 0;
		padding-bottom: 19.048%;
		margin: 0 auto 6vw;
	}
	
	#japan_ski h2:before {
		left: -6%;
		margin-top: 5vw;
	}
	
	#japan_ski h2:after {
		right: -6%;
		margin-top: 5vw;
		
	}
	
	/* -- 圖片輪播 -- */

	#japan_ski .slider-content{
		display:none;
	}

	#japan_ski .slider-content-m{
		display:block;
		width: 100%;
	}
	
	#japan_ski h3 {
    	width: 35%;
    	height: 0;
		padding-bottom: 7%;
	}
	
	#japan_ski .tour_type, 
	#japan_ski .resort_content, 
	#japan_ski .fqa_content {
		width: 85%;
	}
	
	#japan_ski .rowField {
		font-size: 18px;
	}

	#japan_ski .tour_field div{
		line-height: 36px;
	}
	
	#japan_ski .equip_box {
		width: 40%;
	}
	
	#japan_ski .equip_box h3 {
		width: 65%;
		height: 0;
		padding-bottom: 15%;
		margin: 0 auto 4vw;
	}
	
	#japan_ski .page_footer {
		padding-bottom: 47%;
		background-size: 130%;
	}
	
	#japan_ski ul.fqa_lsit{
		width: 100%;
	}
	
	/* ==================== 下面會跑出來的LOGO ==================== */

	#japan_ski .logo_goggles{
		width: 25%;
        height: 0;
        padding-bottom: 16.6675%;
	}

	#japan_ski .logo03{
		position: absolute;
		left: 5%;
		bottom: 15%;
		z-index: 10;
	}

	#japan_ski .logo02{
		position: absolute;
		right: 0;
		top: auto;
    	bottom: 1%;
		z-index: 10;
		opacity:0;
	
		animation-name:logo_swing_m02;
		animation-fill-mode:forwards;/* 動畫播放前後模式:動畫結束後，保持在最後一個影格狀態。 */
		animation-duration:2s;
	}


	@keyframes logo_swing_m02{

		from{
			right:0;
			opacity:0;
		}

		10%{
			transform:rotate(5deg);
		}

		20%{
			transform:rotate(-5deg);
		}

		30%{
			transform:rotate(10deg);
		}

		40%{
			transform:rotate(-10deg);
		}

		50%{
			transform:rotate(5deg);
		}

		60%{
			transform:rotate(-5deg);
		}

		70%{
			transform:rotate(10deg);
		}

		80%{
			transform:rotate(-10deg);
		}

		100%{
			transform:rotate(0deg);
		}

		to{
			right: 25%;
			opacity:1;
		}

	}
	
	#japan_ski .logo_m{
		display: block;
		position: absolute;
		left: 0;
		bottom:-1%;
		z-index: 10;
		opacity:0;
		
		animation-name:logo_swing_m;
		animation-fill-mode:forwards;
		animation-duration:2s;
	}

	@keyframes logo_swing_m{

		from{
			left:0;
			opacity:0;
		}

		10%{
			transform:rotate(5deg);
		}

		20%{
			transform:rotate(-5deg);
		}

		30%{
			transform:rotate(10deg);
		}

		40%{
			transform:rotate(-10deg);
		}

		50%{
			transform:rotate(5deg);
		}

		60%{
			transform:rotate(-5deg);
		}

		70%{
			transform:rotate(10deg);
		}

		80%{
			transform:rotate(-10deg);
		}

		100%{
			transform:rotate(0deg);
		}


		to{
			left:15%;
			opacity:1;
		}


	}

	#japan_ski .logo01,
	#japan_ski .logo04{
		display: none;
	}

}

@media screen and (max-width: 540px){ 
	
	#japan_ski .dec_top_l {
    	width: 40%;
    	height: 0;
		padding-bottom: 130%;
		background-size: 120%;
		background-position: right top;
	}
	
	#japan_ski .dec_top_r {
		width: 30%;
		height: 0;
		padding-bottom: 45%;
	}
	
	#japan_ski .pull-tour {
		width: 8.5%;
	}
	
	#japan_ski .pull-tour a.btn-pulltour{
		border-radius: 5px;
	}
	
	#japan_ski .main_top h1 {
    	width: 95%;
		top: 10%;
	}
	
	#japan_ski nav a{
		width: 18.5%;
		height: 0;
		padding-bottom: 20%;
	}

	#japan_ski nav a.btn001{
		background: url("img_btn_0101.png") no-repeat left top;
		background-size: 130%;
		background-position: center;
	}

	#japan_ski nav a.btn001:hover{
		background: url("img_btn_0102.png") no-repeat left top;
		background-size: 130%;
		background-position: center;
	}

	#japan_ski nav a.btn002{
		background: url("img_btn_0201.png") no-repeat left top;
		background-size: 130%;
		background-position: center;
	}

	#japan_ski nav a.btn002:hover{
		background: url("img_btn_0202.png") no-repeat left top;
		background-size: 130%;
		background-position: center;
	}

	#japan_ski nav a.btn003{
		background: url("img_btn_0301.png") no-repeat left top;
		background-size: 130%;
		background-position: center;
	}

	#japan_ski nav a.btn003:hover{
		background: url("img_btn_0302.png") no-repeat left top;
		background-size: 130%;
		background-position: center;
	}

	#japan_ski nav a.btn004{
		background: url("img_btn_0401.png") no-repeat left top;
		background-size: 130%;
		background-position: center;
	}

	#japan_ski nav a.btn004:hover{
		background: url("img_btn_0402.png") no-repeat left top;
		background-size: 130%;
		background-position: center;
	}

	#japan_ski nav a.btn005{
		background: url("img_btn_0501.png") no-repeat left top;
		background-size: 130%;
		background-position: center;
	}

	#japan_ski nav a.btn005:hover{
		background: url("img_btn_0502.png") no-repeat left top;
		background-size: 130%;
		background-position: center;
	}
	
	/*#japan_ski nav a {
		padding-bottom: 18.5%;
	}
	
	#japan_ski nav a.btn001,
	#japan_ski nav a.btn001:hover,
	#japan_ski nav a.btn002,
	#japan_ski nav a.btn002:hover,
	#japan_ski nav a.btn003,
	#japan_ski nav a.btn003:hover,
	#japan_ski nav a.btn004,
	#japan_ski nav a.btn004:hover,
	#japan_ski nav a.btn005,
	#japan_ski nav a.btn005:hover{
		background-size: 130%;
		background-position: center;
	}*/
	
	#japan_ski article>h2 {
    	width: 55%;
    	height: 0;
		padding-bottom: 21%;
	}
	
	#japan_ski h2:before {
		left: -15%;
		margin-top: 8vw;
	}
	
	#japan_ski h2:after {
		right: -15%;
		margin-top: 8vw;
	}
	
	
	
	#japan_ski .title_field{
		display: none;
	}
	
	#japan_ski .rowField {
		margin-bottom: 20px;
	}
	
	#japan_ski .airplane, 
	#japan_ski .departure, 
	#japan_ski .tour_name{
		display: block;
	}
	
	#japan_ski .airplane,#japan_ski .departure{
    	width: 100%;
    	margin-right: 0;
    	text-align: center;
   		border-right: none;
		border-bottom: #dae5e8 2px solid;
	}
	
	#japan_ski .tour_name {
		width: 100%;
		text-align: center;
		padding: 0 2%;
	}
	
	#japan_ski .tour_name p {
		width: 100%;
		margin-bottom: 15px;
	}
	
	
	#japan_ski .tour_name a{
		width: 40%;
		margin-bottom: 20px;
	}
	
	#japan_ski h3 {
		width: 40%;
		height: 0;
		padding-bottom: 8%;
	}
	
	#japan_ski .resort_content{
		margin-bottom: 50px;
		overflow: visible;
	}
	
	#japan_ski .R_part,#japan_ski .L_part{
		float: none;
	}
	
	#japan_ski .resortIn_pic,
	#japan_ski .resortIn_txt {
		width: 100%;
		height: auto;
	}
	
	#japan_ski .txt_box h3 {
    	width: 60%;
    	height: 0;
		padding-bottom: 26%;
	}
	
	
	#japan_ski .txt_box h3.resort_tt03{
		margin-right: 17%;
	}
	
	#japan_ski .txt_box p {
		font-size: 18px;
		line-height: 36px;
	}
	
	#japan_ski .equip_box {
		display: block;
		width: 75%;
		margin: 0 auto 50px;
		-webkit-box-shadow: 0 0 1rem 0.2rem rgba(0, 0, 0, 0.1);
		box-shadow: 0 0 1rem 0.2rem rgba(0, 0, 0, 0.1);
		
	}
	
	#japan_ski .equip_box h3 {
    	width: 50%;
    	height: 0;
		padding-bottom: 10.5%;
	}
	
	#japan_ski h4.fqa_list_q:before,
	#japan_ski .fqa_list_a:before{
    	width: 10%;
    	height: 0;
		padding-bottom: 10%;
		left: 2%;
	}
	
	#japan_ski h4.fqa_list_q {
		font-size: 22px;
		line-height: 36px;
		margin-bottom: 5px;
		padding: 5px 0 5px 15%;
	}
	
	#japan_ski .fqa_list_a {
		font-size: 18px;
		line-height: 36px;
		padding: 5px 0 5px 15%;
	}
	

}

@media screen and (max-width: 375px){ 
	#japan_ski .rowField {
		font-size: 16px;
	}

	#japan_ski .tour_field div {
		line-height: 28px;
	}
	
	#japan_ski .txt_box p {
		font-size: 16px;
		line-height: 28px;
	}



}