@charset "UTF-8";
.icons-sprite, .icons-click, .icons-link, .icons-list, .icons-nav_001, .icons-nav_002, .icons-nav_003, .icons-nav_004 { background-image: url('../images/icons-sb2a17728a3.png'); background-repeat: no-repeat; }

.icons-click { background-position: 0 0; }

.icons-link { background-position: 0 -50px; }

.icons-list { background-position: 0 -88px; }

.icons-nav_001 { background-position: 0 -130px; }

.icons-nav_002 { background-position: 0 -200px; }

.icons-nav_003 { background-position: 0 -270px; }

.icons-nav_004 { background-position: 0 -340px; }

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 { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; font-weight: normal; vertical-align: baseline; background: transparent; }

body { line-height: 1; }

ol, ul, li { list-style: none; }

blockquote, q { quotes: none; }

blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }

/* remember to define a styles! */
:link, :visited { text-decoration: none; }

: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; }

table tr td { vertical-align: middle; }

img { border: 0; }

a { color: inherit; }

input, button, textarea, select, optgroup, option { font-family: inherit; font-size: inherit; font-style: inherit; font-weight: inherit; }

/* padding */
*, *:after, *:before { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }

/*@purpose To enable resizing for IE */
/*@branch For IE6-Win, IE7-Win */
input, button, textarea, select { font-size: 100%; }

/* Clearfix hack by Nicolas Gallagher: http://nicolasgallagher.com/micro-clearfix-hack/ */
.clearfix:before, .clearfix:after { content: " "; display: table; }

.clearfix:after { clear: both; }

.clearfix { zoom: 1; }

/* other */
code, kbd, samp, tt { font-size: 100%; }

#nav ul li a, #product .product_list a, .btn_more a { width: 100%; height: 100%; display: block; color: inherit; }

.textarea { text-align: justify; word-break: normal; }

.bootstrap_default { display: inline-block; margin-right: -6px; vertical-align: top; }

.table { display: table; border-spacing: 0.5rem; border-collapse: collapse; width: 100%; table-layout: fixed; }

 /*@mixin fontall( $font-weight:normal; $font-size:14px; $line-height:1.6; $font-family:Verdana, "微軟正黑體", sans-serif;){ font-weight:$font-weight; font-size:$font-size; line-height:$line-height; font-family:$font-family; }
*/
/* animation-name: example; 動畫名稱 */
/* animation-duration: 4s; 動畫時間長度 */
/* animation-timing-function: linear; 動畫速度 */
/* animation-delay:2s; 動畫開始秒數'' */
/* animation-iteration-count: 3; 動畫循環次數 */
/* animation-direction: alternate; 動畫時間方向性 */
body { font: normal 16px/1.6 Verdana, "微軟正黑體", sans-serif; color: #333; }

/* BOOTSTRAP */
body.modal-open { overflow: hidden; }

.bootstrap_default { padding: 0px; float: none !important; }

/* RWD */
.pc { display: inline-block; }

.mobile { display: none; }

/* TABLE */
.table .table_row { display: table-row; }
.table .table_cell { display: table-cell; vertical-align: middle; }

#nav { width: 100%; max-width: 1100px; background: #fca125; font-size: 18px; margin: 0px auto 0px auto; border-radius: 20px; -moz-border-radius: 20px; -webkit-border-radius: 20px; position: absolute; bottom: -50px; left: 0px; right: 0px; z-index: 999; }
#nav ul { max-width: 1100px; padding: 10px 0px; margin: 0px auto; overflow: hidden; }
#nav ul li { transition: 0.5s; -webkit-transition: 0.5s; -moz-transition: 0.5s; text-align: center; color: #fff; border-right: 1px solid #fff; }
#nav ul li img { margin-right: 10px; display: inline-block; vertical-align: middle; }
#nav ul li div { text-align: left; display: inline-block; vertical-align: middle; }
#nav ul li a { transition: 0.5s; -webkit-transition: 0.5s; -moz-transition: 0.5s; padding: 10px 10px; }
#nav ul li a:hover { transition: 0.5s; -webkit-transition: 0.5s; -moz-transition: 0.5s; color: #000; }
#nav ul li:last-child { border-right: none; }

#banner { width: 100%; height: 500px; background: url(https://event.cdn-gunnarworks.com/events/2017-hotel-thsrc/banner_001.jpg) no-repeat bottom center; background-size: cover; position: relative; }
#banner .banner { width: 100%; height: 100%; overflow: hidden; position: absolute; z-index: 999; }
#banner .banner img { width: 100%; height: auto; }
#banner .banner_text { height: 100%; text-align: center; position: relative; overflow: hidden; }
#banner .banner_text li { position: absolute; top: 0; left: 0; bottom: 0; right: 0; z-index: 999; }
#banner .banner_text li img { width: auto; height: 100%; }
#banner .banner_text .b1 { -webkit-animation-name: pulse; animation-name: pulse; }
#banner .banner_text .b2 { -webkit-animation-name: pulse; animation-name: pulse; }
#banner .banner_text .b3 { animation: bright 1.5s linear infinite; -webkit-animation: bright 1.5s linear infinite; -moz-animation: bright 1.5s linear infinite; }
#banner .banner_m img { width: 100%; }

.event_bn{width: 100%;height: auto;}
.event_bn img{width: 100%;height: auto;}
.event_bn .mobile img{margin-top: 40px;}


/* CONTAINER */
section { padding: 100px 0px; }
section .content { max-width: 1100px; margin: 0px auto; overflow: hidden; }
section .content_title { text-align: center; margin-bottom: 30px; }
section .content_title h2 { max-width: 1100px; margin: 0px auto; font-size: 24px; font-weight: bold; padding: 30px 0px; }
section .content_title h2 span { font-size: 32px; color: #fca125; font-weight: bold; }
section .t1 h2 { background: url(../images/t1.png) no-repeat 30% center; }
section .t2 h2 { background: url(../images/t2.png) no-repeat 30% center; }
section .t3 h2 { background: url(../images/t3.png) no-repeat 30% center; }
section .t4 h2 { background: url(../images/t4.png) no-repeat 30% center; }
section:nth-child(2n+1) { background: #fff9e2; }

.textarea { margin-bottom: 30px; }
.textarea .textarea_title { font-weight: bold; font-size: 20px; margin-bottom: 10px; }
.textarea .textarea_list { background: url(../images/icons/list.png) no-repeat 2px 2px; padding: 0px 0px 10px 27px; }
.textarea .textarea_list b { font-weight: bold; }
.textarea .textarea_list_list { padding-left: 27px; }
.textarea .textarea_list_list b { font-weight: bold; }
.textarea .textarea_text { padding-left: 27px; position: relative; line-height: 1.8; }
.textarea .textarea_text span { position: absolute; left: 4px; top: 0px; }
.textarea .textarea_img { padding-left: 30px; }
.textarea .textarea_img img { width: 100%; }
.textarea .textarea_btn a { transition: 0.5s; -webkit-transition: 0.5s; -moz-transition: 0.5s; border-radius: 20px; -moz-border-radius: 20px; -webkit-border-radius: 20px; border: 1px #029ea3 dotted; color: #029ea3; padding: 4px 15px; }
.textarea .textarea_btn a:hover { transition: 0.5s; -webkit-transition: 0.5s; -moz-transition: 0.5s; background: #ffed00; color: #fff; border: 1px #ffed00 dotted; }

/* PRODUCT */
#product { margin: 0px 0px 0px 0px; overflow: hidden; }
#product .product_list { transition: 0.5s; -webkit-transition: 0.5s; -moz-transition: 0.5s; padding: 0px 10px 30px 10px; text-align: center; position: relative; }
#product .product_list a { transition: 0.5s; -webkit-transition: 0.5s; -moz-transition: 0.5s; border-radius: 10px; -moz-border-radius: 10px; -webkit-border-radius: 10px; border: 3px #000 solid; margin-top: -20px; position: relative; overflow: hidden; }
#product .product_list:hover img { transition: 0.5s; -webkit-transition: 0.5s; -moz-transition: 0.5s; transform: scale(1.08); -webkit-transform: scale(1.08); -moz-transform: scale(1.08); }
#product .product_list_title { border-radius: 30px; -moz-border-radius: 30px; -webkit-border-radius: 30px; width: 80%; background: #ffed00; font-weight: bold; font-size: 18px; padding: 5px 10px; margin: 0px auto; border: 3px #000 solid; position: relative; z-index: 999; }
#product .product_list_btn { width: 40px; height: 40px; background: #fca125; color: #fff; font-size: 16px; border-top: 3px #000 solid; border-left: 3px #000 solid; padding: 5px; position: absolute; bottom: 0px; right: 0px; z-index: 999; }
#product .product_list_img { margin-top: -20px; }
#product .product_list_img img { transition: 0.5s; -webkit-transition: 0.5s; -moz-transition: 0.5s; width: 100%; margin-bottom: -6px; }

/* EXTRA */
#extra { margin: 0px 0px 0px 0px; overflow: hidden; }
#extra .extra_des { text-align: center; margin-bottom: 20px; }
#extra .extra_des span { font-weight: bold; font-size: 18px; color: #fca125; }
#extra .extra_list { padding: 0px 10px 20px; }
#extra .extra_list .extra_list_title { border-radius: 50%; -moz-border-radius: 50%; -webkit-border-radius: 50%; width: 90px; height: 90px; font-weight: bold; line-height: 1.4; font-size: 18px; background: #fca125; text-align: center; border: 3px #000 solid; margin: 0px auto; padding-top: 30px; position: relative; z-index: 999; }
#extra .extra_list .extra_content { border-radius: 10px; -moz-border-radius: 10px; -webkit-border-radius: 10px; background: #fff9e2; border: 3px #000 solid; margin-top: -45px; padding: 60px 30px 30px; text-align: center; }
#extra .extra_list .extra_content .extra_more { display: none; background: #fca125; color: #fff; padding: 10px; margin-top: 20px; }
#extra .extra_list .extra_content .extra_img { display: block; }
#extra .extra_list .extra_content img { border-radius: 6px; -moz-border-radius: 6px; -webkit-border-radius: 6px; width: 100%; border: 1px #999 solid; margin: 20px 0px; }
#extra .extra_list .extra_content p span { color: #fca125; font-weight: bold; font-size: 18px; }

/* STEP */
#step .step_list { padding: 0px 10px 20px; overflow: hidden; }
#step .step_list .step_list_step { border-radius: 50%; -moz-border-radius: 50%; -webkit-border-radius: 50%; width: 90px; height: 90px; font-weight: bold; line-height: 1.4; font-size: 18px; background: #fca125; text-align: center; border: 3px #000 solid; margin: 0px auto; padding-top: 20px; position: relative; z-index: 999; }
#step .step_list .step_list_step span { display: block; font-size: 12px; color: #fff; }
#step .step_list .step_content { border-radius: 10px; -moz-border-radius: 10px; -webkit-border-radius: 10px; background: #fff; border: 3px #000 solid; margin-top: -45px; padding: 60px 30px 30px; text-align: center; }
#step .step_list .step_content .step_content_title { display: block; font-weight: bold; font-size: 18px; color: #fca125; border-bottom: 1px #999 solid; padding-bottom: 20px; }
#step .step_list .step_content img { border-radius: 6px; -moz-border-radius: 6px; -webkit-border-radius: 6px; width: 70%; border: 1px #999 solid; margin: 20px 0px; }

/* APP */
#app{ margin: 0px 0px 0px 0px; overflow: hidden;}
#app .content{background-color: #fff;}
#app img{width: 100%;}

/* NOTICE */
#notice { background: #f5f5f5; }

#btn_top { position: fixed; right: 30px; bottom: -1000; }

.btn_more { text-align: center; }
.btn_more a { transition: all 1s; -webkit-transition: all 1s; -moz-transition: all 1s; border-radius: 50px; -moz-border-radius: 50px; -webkit-border-radius: 50px; width: 260px; background: #fca125 url(../images/icons/click.png) no-repeat 80% 50%; font-weight: bold; font-size: 18px; padding: 15px 0px; margin: 40px auto 0px auto; border: 2px #fca125 solid; }
.btn_more a:hover { transition: all 1s; -webkit-transition: all 1s; -moz-transition: all 1s; border: 2px #000 solid; }

.red { color: #ffed00; }

.green { color: #fca125; }

.z-999 { position: static; z-index: 999; }

@keyframes move { 0% { bottom: 48px; }
  50% { bottom: 56px; }
  100% { bottom: 48px; } }
@keyframes bright { 0% { filter: brightness(1); }
  50% { filter: brightness(1.3); }
  100% { filter: brightness(1); } }
/*Styles for screen 1366px and lower*/
/*Styles for screen 1024px and lower*/
@media screen and (max-width: 1024px) { /* CONTAINER */
  section { padding: 100px 0px; }
  section .content { padding: 0px 30px; } }
/*Styles for screen 1024px and lower*/
@media screen and (max-width: 1000px) { #banner { height: 400px; }
  /* CONTAINER */
  section { padding: 80px 0px; }
  section .content { padding: 0px 30px; } }
/*Styles for screen 768px and lower*/
@media screen and (max-width: 768px) { #btn_top { right: 10px; opacity: 0.8; transition: 0.5s; -webkit-transition: 0.5s; -moz-transition: 0.5s; }
  #btn_top:hover { opacity: 1; transition: 0.5s; -webkit-transition: 0.5s; -moz-transition: 0.5s; } }
/*Styles for screen 680px and lower*/
@media screen and (max-width: 680px) { /* RWD */
  .pc { display: none; }
  .mobile { display: block; }
  #nav { position: relative; bottom: 20px; }
  #nav ul li:nth-child(1) { border-bottom: 1px solid #fff; }
  #nav ul li:nth-child(2) { border-bottom: 1px solid #fff; }
  #nav ul li:nth-child(2n) { border-right: none; }
  #banner { height: 360px; background: none; }
  #banner .banner { display: none; }
  #banner .banner_text { display: none; }
  .event_bn .mobile img{margin-top: 120px;}

  @media screen and (max-width: 560px) { 
  .event_bn .mobile img{margin-top: 20px;}}

  @media screen and (max-width: 375px) { 
  .event_bn .mobile img{margin-top: 10px;}}
  

  /* CONTAINER */
  section { padding: 40px 0px; }
  section .t1 h2 { background: url(../images/t1.png) no-repeat center; }
  section .t2 h2 { background: url(../images/t2.png) no-repeat center; }
  section .t3 h2 { background: url(../images/t3.png) no-repeat center; }
  section .t4 h2 { background: url(../images/t4.png) no-repeat center; }
  /* PRODUCT */
  #product { padding: 60px 0px 40px; }
  #product .product_list { margin-bottom: 20px; }
  /* EXTRA */
  #extra .extra_des { padding: 0px 30px; }
  #extra .extra_list .extra_content .extra_more { display: block; }
  #extra .extra_list .extra_content .extra_img { display: none; }
  /* NOTICE */
  #notice { /* padding:40px 30px; */ }
  .btn_more a { margin: 20px auto 0px auto; } }
/*Styles for screen 480px and lower*/

/*# sourceMappingURL=common.css.map */