﻿@charset "utf-8";

/*基本*/
body {margin: 0; padding:0;}
@media screen and (max-width:767px){
	body {background:#f6f6f6;}
}

/*隱鑶*/
.for_pc {}
.for_phone, .for_m { display:none !important;}
@media screen and (max-width:767px){
	.for_pc { display:none !important;}
	.for_phone, .for_m { display: block!important;}
}

/*PC背景
.Area_bgtop { z-index:-40; position:absolute; top:170px; left:50%; width:2000px; -webkit-transform:translateX(-50%); transform:translateX(-50%); pointer-events: none; }
.Area_bgtop .bgtop_  { position:absolute; top:0; left:0; width:100%; height:2000px;}
.Area_bgtop .bgtop_  span { position:absolute; display: block; width:100%; height:100%; background-position:center top; background-repeat: no-repeat;}*/

/*PC背景*/
@media screen and (min-width:767px){
  .bgtop01 { z-index:-7; position:absolute; top: 880px;left:0;width:100%; min-width:1220px; height:1500px; background-repeat:no-repeat; background-position:center top; }
  .bgtop02 { z-index:-8; position:absolute; top: 1560px;left:0;width:100%;min-width:1220px;height: 2000px;background-repeat:no-repeat;background-position:center top;}
  .bgtop03 { z-index:-7; position:absolute; top: 3005px;left:0;width:100%;min-width:1220px;height: 2000px;background-repeat:no-repeat;background-position:center top;}
  .bgtop04 { z-index:-7; position:absolute; top: 4640px;left:0;width:100%;min-width:1220px;height: 2000px;background-repeat:no-repeat;background-position:center top;}
  .bgtop05 { z-index:-7; position:absolute; top: 6192px;left:0;width:100%;min-width:1220px;height: 2500px;background-repeat:no-repeat;background-position:center top;}
  .bgtop06 { z-index:-7; position:absolute; top: 8395px;left:0;width:100%; min-width:1220px; height: 2500px; background-repeat: no-repeat; background-position:center top; }
  .bgtop07 { z-index:-8; position:absolute; top: 10102px;left:0;width:100%;min-width:1220px;height: 3620px;background-repeat:no-repeat;background-position:center top;}
  .bgtop08 { z-index:-7; position:absolute; top: 13690px;left:0;width:100%;min-width:1220px;height: 2000px;background-repeat:no-repeat;background-position:center top;}
  .bgtop09 { z-index:-7; position:absolute; top: 14570px;left:0;width:100%;min-width:1220px;height: 2000px;background-repeat:no-repeat;background-position:center top;}
}
	

/*回版頭*/
#gotopBtn { display:none !important;} /*把系統手機版原本的Gotop關掉*/
#gotop { display: none; position:fixed; z-index:201; right:0; padding:14px 6px 3px 10px; font:12px/30px Verdana; text-align:center; color:#fff; cursor:pointer; transition: 0.2s; transform: translateX(200%);
        bottom:90px;
        bottom: calc(90px + constant(safe-area-inset-bottom)*0.6 );
        bottom: calc(90px + env(safe-area-inset-bottom)*0.6 );}
#gotop::before { content: ""; position:absolute; top:9px; left:19px; width: 0; height: 0; border: 4px solid #fff; border-color: transparent transparent #fff; }
#gotop::after  { content: ""; z-index:-1; position:absolute; top:50%; left:50%; border-radius:50px 0 0 50px; transform:translate(-50%,-50%); width:44px; height:44px; background-color:rgba(0,0,0,0.8);}
#gotop.cate-open { transform: translateX(0%);}
  /*白色*/
  #gotop { color:#000; }
  #gotop::before { border-color: transparent transparent #000;}
  #gotop::after  { background-color: rgba(255,255,255,0.95);  box-shadow:0 1px 0 rgba(242,242,242,1), 0 0 10px rgba(0,0,0,0.2);}




/*全BOX版面*/
.WRAPPER { position: relative;	display: inline-block;	margin: 0;	padding: 0;	width:100%; min-width:1220px; overflow: hidden;font-family:"微軟正黑體","Microsoft JhengHei",Helvetica; /*background: url() repeat-y center top;*/}
.WRAPPER img { border:0; vertical-align:top;}
.WRAPPER a { text-decoration:none;}
.WRAPPER ul {list-style: none outside none;}
.WRAPPER .Area_top{position: relative; }
.WRAPPER .mainArea { position:relative; display:block; margin:0 auto; padding: 0; width:1220px;}
	@media screen and (max-width:767px){
		.WRAPPER { padding-bottom:0px; min-width:inherit; background: #f6f6f6; background-size:100%;}
		.WRAPPER .mainArea { position:relative; display:block; margin:0 auto; padding: 0; width:100%;}
		.WRAPPER.mmainAre { width: 100%;}
	}
@media screen and ( max-width:736px) {
	.WRAPPER {min-width: inherit;  background-size:100%;  background-repeat: repeat-y}
	.WRAPPER img {width:100%; height:auto;}
}

.WRAPPER .go_bt {
  -webkit-transition: all 0.4s ease;
     -moz-transition: all 0.4s ease;
      -ms-transition: all 0.4s ease;
       -o-transition: all 0.4s ease;
          transition: all 0.4s ease;}
.WRAPPER .go_bt:hover { 
   filter:brightness(105%);
  -webkit-transform:translateY(-10px);
     -moz-transform:translateY(-10px);
      -ms-transform:translateY(-10px);
       -o-transform:translateY(-10px);
          transform:translateY(-10px);}
		  
.WRAPPER .go_bt2 {
  -webkit-transition: all 0.4s ease;
     -moz-transition: all 0.4s ease;
      -ms-transition: all 0.4s ease;
       -o-transition: all 0.4s ease;
          transition: all 0.4s ease;}
.WRAPPER .go_bt2:hover { 
   filter:brightness(108%);
  -webkit-transform:scale(0.9);
     -moz-transform:scale(0.9);
      -ms-transform:scale(0.9);
       -o-transform:scale(0.9);
          transform:scale(0.9);}

	
/*按鈕基本*/
.fill:hover,
.fill:focus { box-shadow: inset 0 0 0 1.5em var(--hover);}
/*.button{ position: absolute; top: 200px; left: 178px; font-size:20px; letter-spacing:3px;}*/
.fill { --color: #353535; --hover: #000;}
button {  color: var(--color);  transition: 0.25s; cursor:pointer;}
button:hover, button:focus {  border-color: var(--hover);  color: #fff;}
button { background: none; border: 2px solid; font: inherit; line-height: 1; margin: 0.5em; padding: .9em 1.5em;}

/*區塊_all*/
.Area { position: relative; margin:0 auto; padding:0; text-align:center;  }
.Area .box_bg{position:absolute;top:0;left: 0;z-index: 0;} 
.Area1220 { margin:0 auto; width:1220px;}
.Area_1bn_nopadding { margin: 0 auto; padding:0; overflow:hidden;}
.Area_1bn_nopadding a  { float:left; margin:0; padding:0; width:100%; list-style: none;}
.Area_1bn_nopadding img  { float:left; margin:0; padding:0; width:100%; list-style: none;}
.Area_2bn_nopadding { margin: 0 auto; padding:0; overflow:hidden;}
.Area_2bn_nopadding a { float:left; margin:0; padding:0; width:50%; list-style: none;}
.Area_3bn_nopadding { margin: 0 auto; padding:0; overflow:hidden;width:98%;}
.Area_3bn_nopadding p { float:left; margin:0; padding:0; width:33.3%; list-style: none; text-align:center;}
.Area_4bn_nopadding { margin: 0 auto; padding:0;width:1220px; overflow:hidden;}
.Area_4bn_nopadding a { float:left; margin:0; padding:0; width:25%; list-style: none;}		/*區塊_兩邊間距*/
	@media screen and (max-width:767px){
		.Area .go_bt:hover { 
			-webkit-transform:none;
			 -moz-transform:none;
				-ms-transform:none;
				 -o-transform:none;
					transform:none;}
		.Area1220 { width:100%;}
		.Area img{ width:100%;}
		.Area { position: relative;}

		/*區塊_切割*/
		.Area_1bn { margin: 0 auto; padding:0; overflow:hidden;}
		.Area_1bn a { float:left; margin:0 0 2% 0; padding:0; width:100%;}
		.Area_2bn { width:96%; margin: 0 2%; padding:0; overflow:hidden;}
		.Area_2bn a { float:left; margin:0 1% 2%; padding:0; width:48%; }
		.Area_3bn { margin: 0 auto; padding:0; overflow:hidden;}
		.Area_3bn a { float:left; margin:0 1% 2% ; padding:0; width:31.3%; }
		.Area_1bn_nopadding { margin: 0 auto; padding:0; overflow:hidden;}
		.Area_1bn_nopadding a { position:relative; float:left; margin:0; padding:0; width:100%; }
		.Area_2bn_nopadding { margin: 0 auto; padding:0; overflow:hidden;}
		.Area_2bn_nopadding a { float:left; margin:0; padding:0; width:50%;}
		.Area_3bn_nopadding { margin: 0 auto; padding:0; overflow:hidden;}
		.Area_3bn_nopadding a { float:left; margin:0; padding:0; width:33.3%;}
		.Area_4bn_nopadding { margin: 0 auto; padding:0; overflow:hidden;}
		.Area_4bn_nopadding a { float:left; margin:0; padding:0; width:25%; }		
	}



/*logo*/
.Area_logo { position: relative; margin:0; padding:0; overflow:hidden; height:100px;width:100%;z-index:2;text-align: center; vertical-align: top; background-color:#fff; }
@media screen and (max-width:767px){
	.Area_logo {overflow:hidden; float:left; margin:0; padding:0; width:76%;left: 10vw; height: auto; list-style: none; position: relative;height: auto;}
	.Area_logo img {width:100%;}
}


/*header-選單切換區*/
@media screen and (min-width:768px){
.cantantBase { z-index:5; background:#f3f3f3; /*border-top:solid 10px #000;*/  position: relative; top:0; left:50%; transform:translateX(-50%); width:100%; height:auto; z-index:9; border-bottom:1px solid #c5c5c5;}
.cantantBase .box { position:relative; margin:0 auto; width:1220px; height:69px;}
/*.cantantBase .momologo { position:absolute; top:29px; left:26px; -webkit-transform:scale(0.9); transform:scale(0.9);}
.cantantBase .momologo a { display:block; width:191px; height:21px; background:url(momo_logo.png?t=1749801042764);}
.cantantBase .momologo a:hover { background:url(momo_logo_on.png?t=1749801042764);}*/
.cantantBase ul {display:inline-block; margin:0; padding:0 10px; list-style:none; text-align:center; width:100%; box-sizing:border-box;}
.cantantBase ul li { float:left; display:inline-block; position:relative; margin:0 15px; padding:0; font-size:16px; line-height:69px; width:102px; letter-spacing:0.15em;}
.cantantBase ul li a { color:#000; display:block;}
.cantantBase .btn_on::after { content:""; z-index:-1; position: absolute; bottom:0%; left:50%; width:70%; height:8%; -webkit-transform:translate(-50%,0%); transform:translate(-50%,0%); background-color: #000; }
.cantantBase ul.tabs li:hover::after { content:""; z-index:-1; position: absolute; bottom:0%; left:50%; width:70%; height:8%; -webkit-transform:translate(-50%,0%); transform:translate(-50%,0%); background-color: #000; }
.cantantBase ul.tabs li.active::after { content:""; z-index:-1; position: absolute; bottom:0%; left:50%; width:70%; height:8%; -webkit-transform:translate(-50%,0%); transform:translate(-50%,0%); background-color: #000; }
/*選單內容物*/
.tab_content{ z-index:9; position: absolute; top:69px; left:0; margin:0; padding:15px 0 30px; overflow:hidden; width:100%; height:auto; background-color:#fff; border-bottom:1px solid #c5c5c5; box-sizing:border-box; display:none;
			  -webkit-transition: all 0.2s ease;
				 -moz-transition: all 0.2s ease;
				  -ms-transition: all 0.2s ease;
				   -o-transition: all 0.2s ease;
					  transition: all 0.5s ease;} 
.tab_content::after { content:""; display:inline-block; clear:both;} 
.tab_content .box { position:relative; margin:0 auto; width:1220px; height:auto; overflow:hidden;}
.tab_content .Nav_block { float:left; display:inline-block;}
.tab_content .Nav_block_04 { width:300px;}
.tab_content .Nav_block_06 { width:200px;}
.tab_content .Nav_block ul { text-align:left; padding:0 10px;}
.tab_content .Nav_block ul li { width:100%; line-height:2em; letter-spacing:0.01em; padding-left:20px; font-size:15px;}
.tab_content .Nav_block ul li:hover { background-color:#000;}
.tab_content .Nav_block ul li:hover a { color:#fff;}
.tab_content .Nav_block ul li.Navtitle { font: bold 19px/30px "Century Gothic","Microsoft JhengHei","微軟正黑體", Arial, sans-serif,Helvetica; line-height:2em; pointer-events:none;}
.tab_content .Nav_block ul li.Navtitle a { color:#0032a1;}
.tab_content .colse_button {z-index:100; display:inline-block; position:absolute;top:0px;right:0px; padding:2px; cursor:pointer;}
.tab_content .Nav_block ul li .new{display: inline-block; width: 40px;line-height: 40px;  font: 14px/14px 微軟正黑體,"Microsoft JhengHei",Helvetica;  color: #FFF;background-color:#ff0000;   border: 1px solid #ff0000; border-radius:3px; margin:0 2%;text-align: center;}


/*被選到的類別*/
.tab_content.active { display:block !important;}
}

@media screen and (max-width:767px){
	.cantantBase .box { position:relative; margin:0; width:30%;}
	.cantantBase ul { margin:0; padding:0; list-style:none; text-align:center; width:100%; box-sizing:border-box;}
	.cantantBase ul li { border-bottom:1px solid #f3f3f3; padding:2.5vw 1vw; background-color:#fff; }
	/*.cantantBase ul li:last-child { border-bottom: none;}*/
	.cantantBase ul li a { color:#000; display:block;}
	.cantantBase ul li.open { background-color:#0032a1;}
	.cantantBase ul li.open a { color:#fff; font-weight:800;}
	
	.tab_content { display:none; position:absolute; top:12.15vw; left:30.5%; width:69.5%; height:166vw; overflow-y:scroll; background-color:#fff; }
	.tab_content .box { position:relative; margin:0 auto; width:100%; height:auto; overflow:hidden;}
	.tab_content .Nav_block ul { text-align:left; padding:0 3vw;}
	.tab_content .Nav_block ul li { border-bottom:none; padding:1.5vw 1vw 1.5vw 3vw; font-size:4vw;}
	.tab_content .Nav_block ul li:last-child { border-bottom:1px solid #f3f3f3; padding-bottom:5vw;}
	
	.tab_content .Nav_block ul li.Navtitle { padding:4vw 1vw 1vw; font: bold 4.8vw/4.8vw "Century Gothic","Microsoft JhengHei","微軟正黑體", Arial, sans-serif,Helvetica; /*line-height:2em;*/ pointer-events:none;}
	.tab_content .Nav_block ul li.Navtitle a { color:#0032a1;}
	
	/*被選到的類別*/
	.tab_content.open { display:block !important;}	
}
@media screen and (max-width:767px) and (min-height:800px){
	.tab_content { height:215.3vw; }
}	



/*版頭區*/
.Area_top { position:relative; width:1220px;height:600px;}
.Area_top .PD{position: absolute;top:88px;left:610px; z-index:3;}


/*主標題文字1*/
.Area_txt {font-family:"華康儷粗黑","Microsoft JhengHei",Helvetica;}
.Area_txt h2 { position: relative ;top: 0;left: 0;margin: 0;text-align: center;padding: 0px; font-weight: 400;font-size: 55px;line-height: 60px;letter-spacing:5px;overflow: hidden;/*text-shadow: 2px 2px 0px rgb(35 0 74);*/color: #454545; z-index: 2; /*background: url("title_h2_BG.png?t=1749801042764") center top no-repeat scroll;*/}
.Area_txt h2 a { display: block; text-decoration:none;}
.Area_txt h2 img { width:714px; height:357px; }
@media screen and (max-width:767px){
	.Area_txt { width:100%; height:13vw; margin:0 auto; padding:0;  }
	.Area_txt h2 { top:0; width:100%; height: 3vw;left: 0; padding: 7% 0 0 0; font-size:7vw; line-height:0vw; font-weight:500;  /*text-shadow: 2px 2px 0px rgb(35 0 74);*/ letter-spacing:0.2rem; /*background:url(mb_txt_bg.jpg?t=1749801042764) center top no-repeat;*/ background-size:100%; }
	.Area_txt h2 img { width:100%; height:auto;}
}

/*主標題文字2*/
.Area_txt2 {font-family:"華康儷粗黑","Microsoft JhengHei",Helvetica;}
.Area_txt2 h2 { position: relative ;top: 0;left: 0;margin: 0;text-align: center;padding: 0px; font-weight:lighter;font-size: 55px;line-height: 60px;letter-spacing:5px;overflow: hidden;/*text-shadow: 2px 2px 0px rgb(35 0 74);*/color: #3ddc84; z-index: 2; /*background: url("title_h2_BG.png?t=1749801042764") center top no-repeat scroll;*/}
.Area_txt2 h2 a { display: block; text-decoration:none;}
.Area_txt2 h2 img { width:714px; height:357px; }
@media screen and (max-width:767px){
	.Area_txt2 { width:100%; height:13vw; margin:4vw 0 0; padding:0;  }
	.Area_txt2 h2 { top:0; width:100%; height:19vw;left: 0; padding: 7% 0 0 0;font-size:7vw; line-height:0vw; font-weight:100;  /*text-shadow: 2px 2px 0px rgb(35 0 74);*/ letter-spacing:0.2rem; /*background:url(mb_txt_bg.jpg?t=1749801042764) center top no-repeat;*/ background-size:100%; }
	.Area_txt2 h2 img { width:100%; height:auto;}
}

/*主標題文字3*/
.Area_txt3 {font-family:"華康儷粗黑","Microsoft JhengHei",Helvetica;}
.Area_txt3 h2 { position: relative ;top: 0;left: 0;margin: 0;text-align: center;padding: 0px; font-weight:lighter;font-size: 55px;line-height: 60px;letter-spacing:5px;overflow: hidden;/*text-shadow: 2px 2px 0px rgb(35 0 74);*/color: eff7cf; z-index: 2; /*background: url("title_h2_BG.png?t=1749801042764") center top no-repeat scroll;*/}
.Area_txt3 h2 a { display: block; text-decoration:none;}
.Area_txt3 h2 img { width:714px; height:357px; }
@media screen and (max-width:767px){
	.Area_txt3 { width:100%; height:13vw; margin:4vw 0 0; padding:0;  }
	.Area_txt3 h2 { top:0; width:100%; height:19vw;left: 0; padding: 7% 0 0 0;font-size:7vw; line-height:0vw; font-weight:100; /*text-shadow: 2px 2px 0px rgb(35 0 74);*/ letter-spacing:0.2rem; /*background:url(mb_txt_bg.jpg?t=1749801042764) center top no-repeat;*/ background-size:100%; }
	.Area_txt3 h2 img { width:100%; height:auto;}
}

/*主標題文字4*/
.Area_txt4 {font-family:"Google Sans Medium","Noto Sans CJK TC Medium",Helvetica;}
.Area_txt4 h2 { position: relative ;top: 3px;left: 0;margin: 0;text-align: center;padding: 0px; font-weight:lighter;font-size: 46px;line-height: 60px;letter-spacing:5px;overflow: hidden;/*text-shadow: 2px 2px 0px rgb(35 0 74);*/color: #fff; z-index: 2; /*background: url("title_h2_BG.png?t=1749801042764") center top no-repeat scroll;*/}
.Area_txt4 h2 a { display: block; text-decoration:none;}
.Area_txt4 h2 img { width:714px; height:357px; }
@media screen and (max-width:767px){
	.Area_txt4 { width:100%; height:13vw; margin:4vw 0 0; padding:0;  }
	.Area_txt4 h2 { top:0; width:100%; height:7vw;left: 0; padding: 7% 0 0 0;font-size:7vw; line-height:0vw; font-weight: 500; /*text-shadow: 2px 2px 0px rgb(35 0 74);*/ letter-spacing:0.2rem; /*background:url(mb_txt_bg.jpg?t=1749801042764) center top no-repeat;*/ background-size:100%; /*background: #073042;*/ }
	.Area_txt4 h2 img { width:100%; height:auto;}
}

/*主標題文字5*/
.Area_txt5 {font-family:"Google Sans Medium","Microsoft JhengHei",Helvetica;}
.Area_txt5 h2 { position: relative; top: 0px; left: 0px; margin: 0px; text-align: center; padding: 0px; font-weight: 600; font-size: 55px; line-height: 67px; letter-spacing: 3px; overflow: hidden; color: rgb(69, 69, 69); z-index: 2;  /*background: url("title_h2_BG.png?t=1749801042764") center top no-repeat scroll;*/}
.Area_txt5 h2 a { display: block; text-decoration:none;}
.Area_txt5 h2 img { width:714px; height:357px; }
@media screen and (max-width:767px){
	.Area_txt5 { width:100%; height:13vw; margin:4vw 0 0; padding:0;  }
	.Area_txt5 h2 { top:0; width:100%; height: 4vw;left: 0; padding: 7% 0 0 0;font-size:7vw; line-height:0vw; font-weight: 500; /*text-shadow: 2px 2px 0px rgb(35 0 74);*/ letter-spacing: 0.1rem; /*background:url(mb_txt_bg.jpg?t=1749801042764) center top no-repeat;*/ background-size:100%; }
	.Area_txt5 h2 img { width:100%; height:auto;}
}




	 
/*1_版頭輪播*/
.Area01 {width:1220px; height: 830px;  position:relative; margin:0 auto;box-sizing:border-box;    padding:0;}
.Area01 .topbn {width:2000px; height: 720px; overflow:hidden; position:absolute;  top:0px; left:-390px; overflow:hidden; text-align:left; z-index:1;}
.movie{ width:1440px; margin: 0 0 0 280px;}
@media screen and (max-width:767px){
	.Area01 { width:100%;height:auto;}
	.Area01 .topbn {width:100%; height:auto; overflow:hidden; position:relative;margin:0 0 5vw;  top:0px; left:0; overflow:hidden; text-align:left; z-index:1;}
}



/*第2區*/
.Area02 {width:1220px;height: auto;position:relative; margin:0 auto; box-sizing:border-box; padding:0; margin-bottom: 100px;}
.Area02 ul{ width: 1220px; position:relative;top:0; padding: 0;text-decoration: none; overflow: hidden;}
@media screen and (max-width:767px){
	.Area02 { width:100%;height: auto;padding:0 ; background-repeat: no-repeat; background-size:100%; background-color:#f6f6f6;margin-bottom: 4vw;}
	.Area02 ul {width:93%; position:relative; top: 1vw; left: 0;}
	.Area02 ul li{margin: 0!important;}
}



/*活動預告*/
.Area_live { height: 1230px;}
/*
.Area_live .video_01 { z-index:10; position:absolute; left:10px;  top: 570px; width: 590px; height: 320px; margin-bottom: 20px}
.Area_live .video_02 { z-index:10; position:absolute; left:620px; top: 570px; width: 590px; height: 320px; margin-bottom: 20px}
*/
.Area_live .video_bn {position:relative;top: 0px; left: 0 ;z-index:1; padding-top: 98px;}
.Area_live  ul.event { display: flex;  width: 1220px; position:relative;margin: 5px 0 30px;top: 330px;  padding: 0;text-decoration: none; overflow: hidden;   list-style: none; flex-wrap: wrap; }
.Area_live  ul.event li {position: relative;  margin: 0 auto;  padding:20px 0;   text-align: center;  display:inline-block;cursor: pointer; }
@media screen and (max-width:767px){
	.Area_live { height: 173vw; /*background: #4285f4; background:url(mb_09.jpg?t=1749801042764) top center no-repeat ; background-size:100%;*/}
/*
	.Area_live .video_01 {top: 48vw;left: 3%;width: 93.8%;height: auto;}
	.Area_live .video_02 {top: 102.5vw;left: 3%;width: 93.8%;height: auto;}
*/
	.Area_live .video_bn{position:absolute;left: 3vw;top: 5vw;width: 94%;z-index:10; padding-top: 14vw; }
	.Area_live ul.event {display:flex; width:100%; position:relative;top: -8.8vw;left: 0;margin:0 auto;padding:0;text-decoration:none;overflow:hidden;list-style:none;z-index:2;text-align:center;justify-content:center;}
	.Area_live ul.event li {display:inline-block; width:31%; padding:0 0.5% 2.5% 0.5%; margin:0 0; text-decoration:none;  text-align:center;}
	.Area_live ul.event li:nth-child(4) {width: 95%;}
}


.buy {z-index: -3; height:570px;position:relative; margin:0 auto; box-sizing:border-box;padding:0;background: url(bg_10.jpg?t=1749801042764)top center no-repeat;}




/*RWDiframe設定*/
 .box_youtube { margin: 0; padding: 0; }
 .box_youtube .youtubeArea { width:100%; height:0px; padding-bottom:56.25%;}
 .box_youtube .youtubeArea * { margin:0; padding:0;}
 .box_youtube .youtubeArea iframe { position:absolute; top:0px; left:0px; width:100%; height:100%;}
 .ban01 { width:100%; height:auto; position:relative; margin: 0 auto;}


/*影片區*/
.Area_video {margin: 0px auto;height: 0px;}
.Area_video .video1{position:absolute; left:10px;  top: 570px; width: 590px; height: 320px; margin-bottom: 20px; /*background:rgba(0,0,0,1);*/ z-index:10;} /*2顆影片左右*/
.Area_video .video2{position:absolute; left:620px; top: 570px; width: 590px; height: 320px; margin-bottom: 20px; /*background:rgba(0,0,0,1);*/ z-index:10;}
.Area_video .video-high {top:49px;}
@media screen and (max-width:767px){
	.Area_video {height: 142vw;/* top: -27vw; */margin: 7vw auto;}
	.Area_video .video1{position:absolute;top: 48vw;left: 3%;width: 94vw;height: 54vw;  /*background:rgba(0,0,0,1);*/ z-index:10;}
	.Area_video .video2{position:absolute;top: 104vw;left: 3%;width: 94vw;height: 54vw; /*background:rgba(0,0,0,1);*/ z-index:10;}			
	.Area_video .video-high {top:8.2%;}
}

.Area_video1 { margin: 0px auto; height:440px;}
.Area_video1 .video1{position:absolute;top: 70px;left: 98px;width: 1024px;height: 577px;background:rgba(0,0,0,1);z-index:10;} /*單顆影片置中*/
.Area_video1 .video2{position:absolute; top:0px;left:521px;width:570px;height:340px; background:rgba(0,0,0,1); z-index:10;}
.Area_video1 .video-high {top:49px;}
.Area_video2 { margin: 0px auto; height:440px;}
.Area_video2 .video2{position:absolute; top:0px;left:521px;width:570px;height:340px; background:rgba(0,0,0,1); z-index:10;}
.Area_video2 .video-high {top:49px;}
@media screen and (max-width:767px){
	.Area_video1 { height:100%;}
	.Area_video1 .video2{position:absolute;top: 14vw;left:8%;width:84vw;height:50vw;background:rgba(0,0,0,1);z-index:10;}
	.Area_video1 .video-high {top:8.2%;}
	.Area_video2 { height:100%;}
	.Area_video2 .video2{position:absolute;top: 14vw;left:8%;width:84vw;height:50vw;background:rgba(0,0,0,1);z-index:10;}
	.Area_video2 .video-high {top:8.2%;}			
}




/*按鈕*/
.Area05 {width:1220px;height:auto;position:relative; margin:0 auto; box-sizing:border-box; padding:30px 0 30px 0; margin-bottom: 130px;}
.Area05 .banner li{margin-bottom: 20px; list-style:none;}
.Area05 .banner img{width: 1220px;}
.Area05 ul.btnall {  display: block;  width: 1220px; position:relative;margin:0px 0 0px 0;  padding: 0 0 0 0;text-decoration: none;  list-style: none;    text-align: center;}
.Area05 ul.btnall li { position: relative; margin: 0px 5px; padding: 5px ; display: inline-block; border: 2px solid #d0d0d0; border-radius: 55px;}
.Area05 ul.btnall li img{ width: 370px;}
.Area05 ul.btnall li a .gobtn{  position: absolute; top: 298px; left: 90px; width: 190px; height: 46px; border: 1px solid rgb(0, 124, 243); color: rgb(255, 255, 255); background-color: rgb(0, 124, 243); font: 20px / 45px 微軟正黑體, "Microsoft JhengHei", Helvetica; text-align: center; border-radius: 3em;}

		  
.WRAPPER .go_gobtn {
  -webkit-transition: all 0.4s ease;
     -moz-transition: all 0.4s ease;
      -ms-transition: all 0.4s ease;
       -o-transition: all 0.4s ease;
          transition: all 0.4s ease;
}
 
.WRAPPER .go_gobtn:hover .gobtn{ 
    color: #007cf3;
    background-color: #d7effe;
 }


@media screen and (max-width:767px){
	.Area05 {width: 100%; height: 125vw; /*background: #4285f4;*/ background-size:100%; margin-bottom:0 ;padding: 86.5% 0 0% 0%;}
	.Area05 .banner {position:absolute;left: 3vw;top: 5vw;width: 94%;z-index:10;}
	.Area05 .banner li {margin-bottom: 2vw; list-style:none;}
	.Area05 .banner img{width: 100%;}
	.Area05 ul.btnall { display: flex;  width: 96%; position:relative; margin:0 auto; }
	.Area05 ul.btnall li { position: relative;  margin:0 auto;  padding: 0; border: 0; }
	.Area05 ul.btnall li img{ width:95%;}
	.Area05 ul.btnall li a .gobtn{ position: absolute; top: 24.5vw; left: 6.5vw; width: 6em; height: 1.5em; border: 1px solid #007cf3; color: #fff; background-color: #007cf3; font: 13px/20px "微軟正黑體","Microsoft JhengHei",Helvetica; text-align: center; border-radius: 3em;}
}	



/*2_1帶4公版*/
.Area06 {}
.Area06 .tag { overflow: hidden; position: relative; padding: 30px 0 20px; margin: 0 auto;}
.Area06 .tag ul { padding: 0; margin: 0; list-style: none; box-sizing: border-box;}
.Area06 .tag ul img { width: 100%;}
.Area06 .box { padding: 0; position: relative; height: 780px !important; }

.Area06 .BN { padding: 0 35px; box-sizing: border-box; height: 315px; }
.Area06 .BN  ul li a{ height: 300px;}
.Area06 .BN .PD_img { display: block;}
.Area06 .BN .PD_into { display: none;}


.Area06 .box_4pd { padding: 243px 0 70px;}
.Area06 .box_4pd .PD_layout { padding: 0 0 20px;}
.Area06 .box_4pd .PD_layout ul.swiper-wrapper { flex-wrap: nowrap;}
.Area06 .box_4pd .PD_layout ul { padding: 20px 0 0; box-sizing: border-box;}
.Area06 .box_4pd .PD_layout ul li { margin: 0;}
.Area06 .box_box { position: relative; overflow: hidden; padding: 0 30px; width: 1220px; box-sizing: border-box;}

.Area06 .swiper-container-horizontal>.swiper-pagination-bullets, .swiper-pagination-custom, .swiper-pagination-fraction { bottom: 0!important;}
@media screen and (max-width:767px){
  .Area06 { padding-top: 11vw !important;}
  .Area06 .tag { padding: 2% 0 3%;}
  .Area06 .box { padding: 0; height: 100% !important; padding-bottom: 8vw;}
  .Area06 .box_4pd { padding: 0; margin-bottom: 10vw;}

  .Area06 .box_4pd .PD_layout ul { padding: 0;}
  .Area06 .box_4pd .PD_layout { padding: 0 2% 5%;}
  .Area06 .box_box { padding-bottom: 0; padding: 0; width: 100%;}
	
  .Area06 .BN { padding: 0; margin-top:0; height: 100%;}
  .Area06 .BN  ul li a{ height:100%; padding: 0 ;}
  .Area06 .BN ul li { margin-bottom: 0;}
  .Area06 .BN .PD_img { display: none;}
  .Area06 .BN .PD_into { display: block;}
  

}



	
/*黏人快速鍵(白色款)*/
.fixed_Area {z-index:999; position:fixed; top:20px; right:0px; width:100px; font-weight:800; font-size:16px; line-height:48px; font-family:Century Gothic, "微軟正黑體",Helvetica; text-align:center;
			-webkit-transform: rotate3d(0,0,0,0deg) translate3d(0,0,0); transform: rotate3d(0,0,0,0deg) translate3d(0,0,0); -webkit-transform-origin:top right; transform-origin:top right;
			  -webkit-transition: all 0.2s ease;
				 -moz-transition: all 0.2s ease;
				  -ms-transition: all 0.2s ease;
				   -o-transition: all 0.2s ease;
					  transition: all 0.2s ease;}
.fixed_Area a { display:block; text-decoration: none; color: #000;}
.fixed_Area img {-webkit-transition: all 0.4s ease;-moz-transition: all 0.4s ease;-ms-transition: all 0.4s ease; -o-transition: all 0.4s ease; transition: all 0.4s ease;}
.fixed_Area .box ul { margin:0; padding:0; list-style:none;}
.fixed_Area .box li { margin:0 0 1px 0; padding:0; height:48px; background-color:rgba(255,255,255,0.6);}
.fixed_Area .box li a { letter-spacing:-1px;height:48px; overflow:hidden;}
.fixed_Area .box li a:hover { background-color:rgba(255,255,255,1);}
.fixed_Area .box li.cate-hover { background-color:rgba(255,255,255,1);}
.fixed_Area .box h2 { margin:0; padding:0;}
	/*快速導覽*/
	.fixed_Area h3 { position: absolute; top:100px; right:-50px; margin:0; padding:35px 0 0 0; border-radius:10px; width:48px; height:82px; font-size: 16px; line-height:30px; writing-mode: tb-lr; writing-mode: vertical-lr; -webkit-writing-mode: vertical-lr; background-color:rgba(255,255,255,0.6); text-align:left; cursor:pointer;
			-webkit-transform-origin:top left; transform-origin:top left;
			  -webkit-transition: all 0.2s ease;
				 -moz-transition: all 0.2s ease;
				  -ms-transition: all 0.2s ease;
				   -o-transition: all 0.2s ease;
					  transition: all 0.2s ease;}
	.fixed_Area h3 i { position: absolute; top:0; right:0; display:block; width:50px; height:50px; cursor:pointer;}
	.fixed_Area h3 i:before { content: ""; position:absolute; top:41%; left:37%; display:block; border:1px solid #000; border-width:0 1px 1px 0; width:15%; height:15%; -webkit-transform:translate(-50%,-50%) rotate(135deg); transform:translate(-50%,-50%) rotate(135deg); -webkit-transition: all 0.3s ease; transition: all 0.3s ease;}
			/*黑色款*/
			.fixed_Area.fixed_Area-dark a { color: #fff;}
			.fixed_Area.fixed_Area-dark .box li { background-color:rgba(0,0,0,0.5);}
			.fixed_Area.fixed_Area-dark .box li a:hover { background-color:rgba(0,0,0,1);}
			.fixed_Area.fixed_Area-dark .box li.cate-hover { background-color:rgba(0,0,0,1);}
            .fixed_Area.fixed_Area-dark h3 {background-color:rgba(0,0,0,0.5);color: #fff; }
            .fixed_Area.fixed_Area-dark h3  i:before { border-color:#fff;}



			/*收合黏人精*/
			.fixed_Area.fixed_Area_hide { -webkit-transform: rotate3d(0,0,0,0deg) translate3d(150px,0,0); transform: rotate3d(0,0,0,0deg) translate3d(150px,0,0); }
			.fixed_Area.fixed_Area_hide h3 { -webkit-transform: rotate3d(0,0,0,0deg) translate3d(-185px,0,0); transform: rotate3d(0,0,0,0deg) translate3d(-185px,0,0); 
											 -webkit-transition-delay:0.2s; transition-delay:0.2s;}




/*bn輪播(線上入稿)*/
.Area_banner {width:1220px; height: 850px; margin:0 auto;box-sizing:border-box;padding:0;position: relative;}
.Area_banner .layout_banner {position: relative; width:2000px;height:750px; left: 50%; overflow:hidden; z-index:1; transform: translateX(-19.5%);}
.Area_banner .swiper-pagination {width: 2000px;}
.Area_banner .swiper-pagination {margin-bottom:37px;}
@media screen and (max-width:767px){
  .Area_banner {width: 100%; height:53vw;}
  .Area_banner .layout_banner {width:100%;height:60vw;margin: 0; transform: translateX(0%);}
  .Area_banner .lbtclass ul {}
  .Area_banner .swiper-pagination {margin-bottom:46px;}
}	



/**延遲載圖用**/
.mainArea .articleList * img.lazy {display:none;} 


		
