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

@import url("reset.css");
@import url("/css/font-awesome.css");
@import url("/css/animate.css");
@import url("/css/bootstrap.css");
@import url("/css/hover.css");
@import url("https://fonts.googleapis.com/earlyaccess/notosanstc.css");
@import url("https://fonts.googleapis.com/icon?family=Material+Icons");

html, body { width:100%; height: auto;overflow-X:hidden; }
body { font-size:100%;}
iframe { display: ;}
*{transition:all .3s; -webkit-transition:all .3s;}

/*:before{ content:"\f146";font-family: 'FontAwesome'; }*/

.btnTop{ background: #CCC \9;background:rgba(0,0,0,.2); border-radius:50%; width:50px; height:50px; position: fixed;right:15px; bottom:15px;cursor:pointer; z-index:99; color:#FFF; text-align:center; font-family:Arial, Helvetica, sans-serif;
	text-transform:uppercase; font-size:13px ; letter-spacing:1px; display: none  ; z-index:999;}
.btnTop:before{content:"\f106";font-family: 'FontAwesome'; font-size:20px; color: #FFF ; display:block; padding-top:6px;}
.btnTop:hover{background:rgba(0,0,0,.4);}

.img-response{ max-width:100%; height:auto;}

/*------------item-inline-block------------*/
.item-inline-block{ letter-spacing:-5px;}
.item-inline-block > *{display: inline-block !important; letter-spacing:1px;vertical-align: top;}

/*------------item-table-cell------------*/
.item-table-cell{ display:table;}
.item-table-cell > *{display: table-cell !important; vertical-align: top;}


/*------------item-flex------------*/
.item-flex{ display:flex !important;display:-webkit-flex !important;}
.item-flex > *{flex:1;-webkit-flex:1 }

@media screen and (max-width: 640px) {
	
.vertical-xs{ display:block !important;	}
.vertical-xs  > *{  display:block !important; width:100% !important ;float:none !important; }

}


.show{ display:block !important;}
.hide{ display:none !important;}

@media screen and (max-width: 640px) {	

	.hide-xs{ display:none !important; }
	.show-xs{ display:block !important;}

}





.wrap{width:100%;height:auto;position:relative; font-family:'Noto Sans TC',"微軟正黑體",Microsoft Yahei;line-height:1.6;  background:#fff;}
		



/*▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃ 版頭 ▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃*/

 .header {width:100%; position:relative; height: auto; overflow:hidden;}
 .header span img{ width:100%; height:auto;}

 .header .center{width:100%;max-width:1200px;position:relative; margin:0 auto; z-index:1;}
 .header .center img{ width:100%; height:auto;}

 .header .left, .header .right{ position:absolute; width:50%; top:0; height:1200px;z-index:0;}
 .header .left{ left:0; margin-left:-600px; background:url(../images/header-left.gif) no-repeat top  right; }
 .header .right{ right:0; margin-right:-600px; background:url(../images/header-right.gif) no-repeat top  left;}

 .header .logo{ position:absolute; right:3%; top:10px; z-index:6; width:18%; max-width: 200px}
 .header .logo img{width:100%; height:auto;min-width:100px;}

 .header .title{  position:absolute;left:0;top:0;right:0;bottom:0;margin:10% auto  auto 10%; z-index:6; width:58%; 
   animation:fadeIn 2s .5s both ,pulse 1.2s 3s infinite both ; transform-origin: top center;
   -webkit-animation:fadeIn 2s .5s both ,pulse 1.2s 3s infinite both ; -webkit-transform-origin: top center;

}
 .header .title img{}


@media screen and (max-width: 640px) {	
	
    .header .logo{width:30%;  right:12px;}	
    
    .header .title{width: 84%;margin:24% auto  auto ;}
	
}






/*▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃ 內容 ▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃*/



.container { max-width:1100px;width:100%; margin:0 auto;padding: 10px;}



.h2_title{
	font-size: 36px;
	font-weight: bold;
	line-height: 42px;
}
.wrap .container { }


.part2-dv {
    background-color: #fff;

    padding: 10vh 0;
}
.part2-dv .container {max-width:1200px;}

.part2-dv .text{padding: 0;font-size: 18px;margin-bottom: 20px;}
.part2-dv .text h3{font-size: 2em;font-weight: bold;margin-bottom: 0;    color: #ff4880;}
.part2-dv .text .tit {
    display: inline-block;
    text-align: center;
    letter-spacing: 2px;
    background:  #ff4880;
    font-size: 18px;
    color: #ffffff;
    padding: 5px 20px;
    margin-top: 12px;
    margin-bottom: 5px;
    transform: skewX(-10deg);
}
.part2-dv .text p{font-size: 16px;max-width: 420px;}

.part2-dv .mac{width: 551px;position: relative;margin-bottom: 20px;position: relative;top: 70px;}

.part2-dv .mac .pic{width: 80%;top: 6%;left: 12.5%;position: absolute;}
.part2-dv .mac .pic img{width: 93%;max-width:100%; height:auto;}

.part.part2-dv h2 {
    color: #def37d;    margin-bottom: 2%;font-weight: bold;
    font-size: 2.3em !important;
}





@media screen and (max-width: 640px) {	
    
   .part2-dv .text{font-size: 16px;}

}


.part-gift { padding-top: 0; }
.part-gift .container-wrap {
    max-width: 1000px;
    padding-left: 10px;
    padding-right: 10px;
    margin: 30px auto 80px;
}
.part-gift .text p { margin: 0; margin-bottom: 2px; }
.part-gift .text h3 { line-height: 1; font-weight: bold; font-size: 1.9em; }
@media screen and (max-width: 768px) { .part-gift .gift { margin-top: 6px; } }
.part-gift .gift img { position: relative; top: -14px; }
.part-gift .gift p { font-weight: bold; font-size: 1.8em; margin-left: 10px; }
.part-gift .title-line-gift { display: flex; white-space: nowrap; text-align: center; align-items: center; font-weight: 600; font-size: 1em; color: #363636; letter-spacing: 0px; width: 100%; overflow: hidden; }
.part-gift .title-line-gift:after, .part-gift .title-line-gift:before { border-top: 4px dotted #363636; content: ''; position: relative; width: 50%; }
.part-gift .title-line-gift:before { right: 1.5%; }
.part-gift .title-line-gift:after { left: 1.5%; }

@media screen and (max-width: 768px) {
	.part-gift { margin-top: 0; }
  .part-gift .text { margin-bottom: 20px; background: #e32962; border-radius: 0 100px 100px 0; color: #fff; padding: 10px 18px; }
  .part-gift .text p { font-size: 1.4em; line-height: 1.4; margin-bottom: 0; font-weight: 300;max-width: 170px; }
  .part-gift .text h3 { font-size: 1.6em; line-height: 1.2; color: #ffffff; margin-bottom: 0; }
  .part-gift .gift { border-bottom: 2px dotted #666666; padding-top: 12px; }
  .title-line-gift:after, .title-line-gift:before { display: none; } }
@media screen and (max-width: 640px) {	
    
   .part2 .text{font-size: 16px;}

}


@media screen and (max-width: 640px) {
	.h2_title{
	font-size: 30px;
	line-height: 38px;
}
	
}

.part.part2 h3 {
    font-size: 20px;text-align: center;
}

.carousel-pic{position: relative;}
 .carousel-pic img{ position: absolute;top: 0; left: 0; opacity: 0;-webkit-animation: round 9s linear infinite;animation: round 9s linear infinite;}
    
 .carousel-pic img:nth-child(1) { webkit-animation-delay: 0s; animation-delay: 0s;}
 .carousel-pic img:nth-child(2) { -webkit-animation-delay: 3s; animation-delay: 3s;}
 .carousel-pic img:nth-child(3) { -webkit-animation-delay: 6s; animation-delay: 6s;}
    

@keyframes round {
    12%,33% { opacity: 1;}
    46%{ opacity: 0;}
}

@-webkit-keyframes round  {
     12%,33% { opacity: 1;}
    46%{ opacity: 0;}
}





.part.part2 {
    background-color: #ffe8bf;
    padding: 10vh 0 2vh;
}
.part2 .containers {max-width:1200px;}



.part.part2 h2 {
    color: #000000;    margin-bottom: 6vh;font-weight: bold;text-align: center;
    font-size: 2.3em !important;
}
.part.part2 .icon{width: 140px;height: 140px;background: #fff;border-radius: 100em;padding-top: 18px;margin-left: auto;margin-right: auto;margin-bottom: 20px;}
.part.part2 .icon img{display: block;margin-left: auto;margin-right: auto;height: 110px;width: auto;max-width: none}
.part.part2 h3{
    color: #000000;margin-bottom:.5em;
}
.part.part2 p {color: #000000;max-width: 170px;margin-left: auto;margin-right: auto;}





.gift .text01{width: 30%;}
.gift .text01 img{position: relative;top: -60px;}

.gift .text02{width: 40%;padding: 10px;margin-bottom: 20px;}
.gift .text02 p{font-size: 16px;margin-bottom: 10px;}
.gift .text02 p span{color: #ff6091;}
.gift .text02 h3{color: #ff6091; font-size: 45px;margin-bottom: 10px;font-weight: bold;line-height: 1.2;}
.gift .text02 h4{color: #ff6091; font-size: 22px;font-weight: bold;}

.gift ul{list-style:none;padding-left:0px;margin-top: 20px;}
.gift ul li{font-size: 18px;margin-bottom: 8px;} 
.gift ul li span{ color: #ff6091;font-size: 20px;margin-right: 5px; padding:0 5px;display: inline-block;font-weight: bold;border-left: 5px solid #ff6091;} 


.gift .pic{width: 30%;}
.gift .pic img{margin-left: auto;margin-right: auto;max-width: 100%;}



@media screen and (max-width: 640px) {	
    
    .gift{margin-top: 30px;}
    .gift .text02 h3{font-size: 32px;}
    .gift .btn{margin-left: auto;margin-right: auto;display: block;width: 100%; }
    
}


.btn{ background: #ff6091; color: #fff; font-size: 20px;padding: 10px 30px;text-align: center;text-decoration: none;display: inline-block; 
    border-radius: 30px;margin-top: 20px; width: 80%; max-width: 300px;margin: 31px auto 10px;display: block;
transition:all .3s; -webkit-transition:all .3s;
}

/*.btn:hover{ background:#e52761 } */






/*----------------------------- 注意事項文字 -----------------------------------  */

/* ul { width:80%; margin:0 auto; color:#a3a3a3; list-style:decimal; padding-left:30px;}
 ul li{ margin-bottom:10px; font-size:15px; color:#333333; line-height:1.5;}
*/







@media screen and (max-width: 640px) {	
	
	
	
}