@charset "utf-8";

/* * {
	margin: 0;
	padding: 0;
	border: none;
	font-size: 100%;
	line-height: 1.0;
	text-decoration: none;
	-webkit-text-size-adjust: none;
	
} */
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, 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,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
strong{
	 font-weight:bold
}
img {
	border: 0;
}

body {
	font-family:微軟正黑體, 新細明體 ,Arial, Helvetica, sans-serif;
	line-height: 1;
    background: url('../img/bk01.jpg') no-repeat center top;/**/
    background-size:cover;
}

body, html {
	width: 100%;/* 主要寬度 */;
	margin: 0 auto;/* 畫面置中 */
	position: relative;
    height:100%;
    min-height:100%

}

input,select{
	vertical-align:middle
}

table {
	border-collapse: collapse;
	border-spacing: 0;
}

html{
	 /*overflow:scroll;
	 overflow:-moz-scrollbars-vertical;
	 overflow-x:scroll;*/
} /*讓scrollbar全時出現*/


a{   outline: none; /* for Firefox Google Chrome  */
}

/*:hover
{
    transition: background 0.3s ease;
    -moz-transition: background 0.3s ease;
    -webkit-transition: background 0.3s ease;
    -ms-transition: background 0.3s ease;
    -o-webkit-transition: background 0.3s ease;
}*/

/**:link, *:hover  {
-o-transition: color .3s ease, background .3s ease, border-color .3s ease;
-webkit-transition: color .3s ease, background .3s ease, border-color .3s ease;
-moz-transition: color .3s ease, background .3s ease, border-color .3s ease;
transition: color .3s ease, background .3s ease, border-color .3s ease;
}*/


*:link{
       text-decoration:none

}
sup { 
    vertical-align: super;
    font-size: smaller;
    font-size:8px;-webkit-transform:scale(0.8); display:inline-block
}
/*--------------------------------------index設定　　開始---------------------------------------------------*/
.bbbk{
    width:1050px;
    height:1000px;
    background:url('../0518/0525-EPSON.jpg') no-repeat top center;
    position:  fixed;
    opacity:0.7;
    left:50%;
    margin-left:-525px;

}
.warp{
    margin:0 auto;
    width:1050px;

}
.top{
    margin:0 auto;
    width:1050px;
    height:165px;
    position:relative
}
.top > h1{
    margin:0 auto;
    position:absolute;
    top:17px;
    right:50px;
    width:87px;
    height:31px;
    background:url('../img/logo.png') no-repeat;
    text-indent:-9999px;

}
.top > h1 > a{
    width:87px;
    height:31px;
    display:block

}
.top > h2{
    margin:0 auto;
    position:absolute;
    top:27px;
    left:50px;
    width:275px;
    height:137px;
    background:url('../img/logo2.png') no-repeat;
    text-indent:-9999px;
    background-size:275px;
}
.top > h2 > a{
    width:275px;
    height:137px;
    display:block
}

.top_login{
    position:absolute;
    top:20px;
    right:140px;
    width:120px;
    height:30px;
}

.top_login > ul{
    position:relative;
    width:120px;
    height:30px;
}

.top_login > ul > li{
    position:relative;
    float:left;
        height:30px;
}

.top_login > ul > li:first-child{
        border-right:1px #666 solid
}

.new_login{
    position:relative;
    float:left;
    height:30px;
    display:block;
    color:#333;
    text-decoration:none;
    font-size:15px;
    padding:0 0px 0 30px;
    background:url('../img/icon_login.png') no-repeat 10px 6px;
    background-size:18px;
    line-height:28px;
    cursor:pointer;

}

.new_login:hover{
    padding:0 0px 0 30px;
    background:url('../img/icon_login01.png') no-repeat 10px 6px;
    background-size:18px;
        color:#0860ff;

}
.new_login > span{
    position:relative;
    float:left;
    height:30px;
    font-size:13px;
    line-height:30px;
    width:100px;
                    white-space:nowrap;
    overflow:hidden;text-overflow : ellipsis;


}
.menu_login_box{
    position:absolute;
    top: 25px;
    /*left: -50px;*/
    left: -50px;
    background:url('../img/login_menu_box.png') no-repeat;
    width:141px;
    height:69px;
    text-align:center;
    padding:20px 10px 0 10px;
                background-size:159px;
               display:none /**/
}

.menu_login_box > p{
    position:relative;
    top:-5px;
    padding:3px 0px 5px 0px;
    width:140px;
    font-size:13px;
    color:#666;
    font-weight:bold;
    border-bottom:1px #457dcd solid;
    float:left;
    text-align:left;
    line-height:1.2em;
            white-space:nowrap;
    overflow:hidden;text-overflow : ellipsis;
    
}

.menu_login_box > span{
    position:relative;
    padding:3px 0px;
    width:150px;
    font-size:11px; -webkit-transform:scale(0.9); display:inline-block;
    color:#666;
    float:left;
    text-align:left;
    left: -5px;
}

.menu_login_box > span > a.member_info{
    position:relative;
    padding:3px 10px 3px 0px;
    color:#666;
    float:left;
    display:block;
        top:-10px;
    left: 0px;
}

.menu_login_box > span > a.logout_bt{
    position:relative;
    padding:3px 0px;
    color:#666;
    float: right;
    display:block;
    top:-10px
}



.menu_login_box > a.menu_login_bt1{
    position:relative;
    padding:3px;
    width:130px;
    background:#014099;
    font-size:13px;
    color:#fff;
    font-weight:bold;
    border:2px #457dcd solid;
    float:left;
    height:15px;
    line-height:15px;
}


.menu_login_box > a.menu_login_bt1:hover{
    background:#1061d4;
    border:2px #5394ef solid;
}
.menu_login_box > a.menu_login_bt2{
    padding:8px 0 0 0;
    width:130px;
    font-size:12px;
    color:#333;
    font-weight:bold;
    float:left;
    height:15px;
    line-height:15px;
}


.menu_login_box > a.menu_login_bt2 > em{
    font-style:normal;
    text-decoration:underline;
    color:#014099
}


.menu > ul > li > a.login{
    position:relative;
    float:left;
    height:30px;
    display:block;
    color:#333;
    text-decoration:none;
    font-size:15px;
    padding:0 9px 0 7px;
    line-height:28px;
}


.menu> ul > li > a.login:hover{
        color:#0860ff;

}





.menu{
    position:absolute;
    top:100px;
    left:310px;
    width:700px;
    height:30px;
    z-index:200
}

.menu > ul{
    position:relative;
    float:left;
    height:30px;
        width:700px;

}

.menu > ul > li{
    position:relative;
    float:left;
    height:30px;
    background:url('../img/line_top.png') no-repeat right center
    /*border-right:1px #666 solid*/
}

.menu > ul > li:last-child{
    border-right:none;
    background:none
}
.menu > ul > li > a{
    position:relative;
    float:left;
    height:30px;
    display:block;
    color:#333;
    text-decoration:none;
    font-size:15px;
          line-height:28px;

}

.menu > ul > li > a.home{
    width:45px;
    background:url('../img/icon_home.png') no-repeat 10px 3px;
    text-indent:-9999px;
            background-size:23px;

}
.menu > ul > li > a.home:hover{
    background:url('../img/icon_home01.png') no-repeat 10px 3px;
    color:#0860ff;
        background-size:23px;
            text-indent:-9999px;
}

.menu > ul > li > a.long{
    padding:0 12px 0 32px;
    background:url('../img/icon_long.png') no-repeat 12px 5px;
    background-size:17px;
}

.menu > ul > li > a.long:hover{
    background:url('../img/icon_long01.png') no-repeat 12px 5px;
    color:#0860ff;
        background-size:17px;
}


.menu > ul > li > a.pro{
    padding:0 12px 0 32px;
    background:url('../img/icon_pro.png') no-repeat 12px 5px;
    background-size:17px;
}
.menu > ul > li > a.pro:hover{
    background:url('../img/icon_pro01.png') no-repeat 12px 5px;
    color:#0860ff;
        background-size:17px;
}

.menu > ul > li > a.book{
    padding:0 12px 0 32px;
    background:url('../img/icon_book.png') no-repeat 12px 5px;
    background-size:17px;
}
.menu > ul > li > a.book:hover{
    background:url('../img/icon_book01.png') no-repeat 12px 5px;
    color:#0860ff;
        background-size:17px;
}

.menu > ul > li > a.store{
    padding:0 12px 0 27px;
    background:url('../img/icon_store.png') no-repeat 12px 5px;
    background-size:12px;
}
.menu > ul > li > a.store:hover{
    background:url('../img/icon_store01.png') no-repeat 12px 5px;
    color:#0860ff;
        background-size:12px;
}


.menu > ul > li > a.facebook{
    width:40px;
    background:url('../img/icon_fb.png') no-repeat 10px 5px;
        background-size:20px;

    text-indent:-9999px;
}



/*KV*/
.kv{
    margin:0 auto;
    width:1050px;
    height:571px;
    position:relative;

     margin-bottom:25px;
    z-index:1;
    float:left;
    background:url('../img/kv_bk.png') no-repeat center center;

}
.index_pro{
    position:absolute;
    bottom:-1px;
    right:46px;
    background:url('../img/pro.png') no-repeat;
    width:277px;
    height:188px;
    z-index:500
}

.swiper-container {
    position:absolute;
    top:38px;
    left:-2px;
  height:481px;
  width: 953px;
}
.content-slide {
  padding: 20px;
  color: #fff;
}
.pagination {
  position: absolute;
  left: 0;
  text-align: center;
  bottom:27px;
  width: 100%;
  z-index:999
}

.swiper-pagination-switch {
  display: inline-block;
  width: 10px;
  height: 10px;
  border-radius: 10px;
  background: #fff;
  box-shadow:0px 0px 10px #000;
  margin: 0 6px;
  cursor: pointer;
    opacity:0.5

}
.swiper-active-switch {
      opacity:1

}






/*index_bt*/
.index_bt_box{
    margin:0 auto;
    width:1050px;
    height:150px;
    position:relative
}

.index_bt_box > ul{
    position:relative;
    float:left
}

.index_bt_box > ul > li{
    position:relative;
    float:left;
    top: 0px;
    left: 0px;
}

.index_bt_box > ul > li > a.bt_long{
    display:block;
    width:250px;
    height:100px;
    background:url('../img/index_bt01.png') no-repeat 60px 15px;
    text-indent:-9999px;
    padding:30px 10px 0 100px;
}
.index_bt_box > ul > li > a.bt_news{
    display:block;
    width:250px;
    height:100px;
    background:url('../img/index_bt02.png') no-repeat  20px 15px;
    text-indent:-9999px;
    padding:30px 10px 0 70px;
}

.index_bt_box > ul > li > a.bt_speed{
    display:block;
    width:250px;
    height:100px;
    background:url('../img/index_bt03.png') no-repeat  20px 15px;
    text-indent:-9999px;
    padding:30px 10px 0 70px;
}

.index_bt_box > ul > li > a.bt_speed01{
    display:block;
    width:250px;
    height:100px;
    background:url('../img/index_bt03a.png') no-repeat  20px 15px;
    text-indent:-9999px;
    padding:30px 10px 0 70px;
}


/*首頁長照片特輯*/
.index_book{
    position:relative;
       width:970px;
padding:10px 40px 20px 40px;
height:253px;
float:left;
/*overflow:hidden*/
}



.slider{overflow:hidden; position:relative; width:100%; height:163px !important; }
.slider ul{margin:0; padding:0; height:163px;}
.slider li{ float:left; list-style:none; margin:0 5px 0 0;}







.footer{
    margin:0 auto;
    width:1050px;
    height:40px;
    position:relative;
    line-height:40px;
    text-align:center;
    font-size:13px;
    color:#666;
    top: 0px;
    left: 0px;
}


/*動手拼出長照片*/
.long_all{
   width:1010px;
   height:700px;
   position:relative
}

.long_box{
    position:absolute;
   width:957px;
   height:654px;
  background:url('../img/box.png') no-repeat ; /**/
   top:40px;
   left:50px;
}

.long_all > h3{
    position:absolute;
   width:282px;
   height:62px;
   background:url('../img/long_tit.png') no-repeat ;
   top:25px;
   left:37px;
   text-indent:-9999px;
   z-index:10
}
.long_step{
    position:absolute;
   width:550px;
   top:5px;
   left:450px;
   z-index:10
}

.long_step ul{
position:relative;
float:left
}

.long_step ul li{
position:relative;
float:left;
width:100px;
font-weight:bold;
padding:0 0 0 10px ;
height:30px;
line-height:30px;
background:url('../img/icon_run.png') no-repeat 100px 8px;
}

.long_step > ul > li:last-child{
background-image: none;
}


.long_step >ul > li > p{
font-size:14px;
color:#026d59;
position:relative;
z-index:10
}

.long_step >ul > li > em.s1,
.long_step >ul > li > em.s2,
.long_step >ul > li > em.s3,
.long_step >ul > li > em.s4,
.long_step >ul > li > em.s5{
background:url('../img/step_bk.png') no-repeat;
position:absolute;
top:0;
  left: 4px;
  width: 100px;
height:30px;
z-index:1
}

/*step1*/
.step1{
position:absolute;
width:700px;
height:400px;
top:55px;
left:120px;
float:left
}
.step1 > h4{
position:relative;
font-size:19px;
color:#026d59;
font-weight:bold;
width:700px;
float:left;
padding-bottom:5px
}
.step1 > h4.pipi_h4{
position:relative;
font-size:19px;
color:#026d59;
font-weight:bold;
width:700px;
float:left;
padding-bottom:5px;
 top: 95px;

}

.size_hw{
    width:680px;
    padding:0px 0 0px 20px;
    float:left
}

.size_hw > p{
     float:left;
     padding:0 25px 0 0;
     display:block;
     height:57px;
     line-height:57px;
     color:#333;
     font-weight:bold
}

.size_hw > label{
          cursor:pointer;
}

.size_hw img
{
    vertical-align:middle;
    padding-left:5px
}

.pipi_tit{
  position: absolute;
  width: 282px;
  height: 62px;
  background: url('../img/long_tit01.png') no-repeat;
  top: 370px;
  left: -135px;
  text-indent: -9999px;
  z-index: 10;

}
.size_select{
    width:680px;
    padding:0px 0 0px 20px;
    float:left
}
.size_select1{
    width:380px;
    padding:0px 0 0px 175px;
    float:left
}
.size_select2{
    width:630px;
    padding:5px 0 15px 20px;
    float:left;
    margin-bottom:10px;
    border-bottom:1px #ccc dotted
}
.size_select2a{
    width:630px;
    padding:5px 0 15px 175px;
    float:left;
    margin-bottom:10px;
    border-bottom:1px #ccc dotted
}
.size_select2 > p,
.size_select2a > p{
     float:left;
     padding:0 35px 0 0;
     display:block;
     color:#333;
     line-height:1em;
     font-weight:bold;
     font-size:15px;
}

.size_select2 > p  em,
.size_select2a > p  em{
     color:#8f8f8f;
     font-size:14px;
}


.size_select2 > p  b,
.size_select2a > p  b{
     color:#d40000;
     font-size:13px;
     padding-left:25px;
}


.long_bt{
    width:700px;
    padding:10px 0 0px 0px;
    text-align:center;
    float:left;
}
.long_bt2{
    position:absolute;
    bottom:5px;
    width:700px;
    padding:10px 0 0px 0px;
    text-align:center;
    float:left;
}

.box_note{
    position:absolute;
    bottom:75px;
    width:700px;
    text-align:center;
    color:#d40000;
    font-size:13px;
}

a.bt_go01{
    padding:10px 40px;
    color:#fff;
    background:#3ed3b6;
    font-weight:bold;
    font-size:20px;
    text-decoration:none;
    position:relative;
    margin:0 20px;
}

a.bt_go01:hover{
    background:#11b091;
    top:-1px;
    left:-1px;
    box-shadow:2px 2px 6px -2px rgba(20%,20%,40%,0.5);
}

a.pop_qa{
    position:absolute;
    top: 10px;
    right: 16px;
    padding:5px 10px;
    background:#61ccff;
    color:#fff;
    font-size:13px;
    font-weight:bold;
    border-bottom-left-radius:5px;
    display:none
}

a.pop_qa:hover{
    background:#26aeee;
}
a.bt_go01a{
    padding:10px 40px;
    color:#fff;
    background:#959595;
    font-weight:bold;
    font-size:20px;
    text-decoration:none;
    position:relative;
    margin:0 20px;
}

a.bt_go01a:hover{
    background:#666;
    top:-1px;
    left:-1px;
    box-shadow:2px 2px 6px -2px rgba(20%,20%,40%,0.5);
}
/*step2*/
.red_f_pic00{
    position: absolute;
    top: 17px;
    left: 325px;
    width: 355px;
    color: #d40000;
    font-size: 13px;
    line-height: 1.5em;
    padding: 5px;
    border: 1px #d40000 solid;
}

.red_f_pic01{
  position: absolute;
  top: 25px;
  left: 565px;
  width: 185px;
  color: #d40000;
  font-size: 13px;
  line-height: 1.5em;
  padding: 5px;
  border: 1px #d40000 solid;
}

.step2{
position:absolute;
width:700px;
height:555px;
top:55px;
left:120px;
float:left
}


.step2 > h4{
position:relative;
font-size:19px;
color:#026d59;
font-weight:bold;
width:700px;
float:left;
/*padding-bottom:5px*/
}

.step2 > h4 > b{
float:left;
padding-right:5px
}
.step2 > h4 > span{
position:relative;
font-size:12px;
color:#026d59;
font-weight:bold;
float:left;
padding-bottom:5px;
line-height:2em
}

.step2_upload{
position:relative;
font-size:12px;
color:#026d59;
font-weight:bold;
float:left;
line-height:2em;
width:680px;
padding:5px 0 5px 0px;
}

a.my_upload{
    position: relative;
    padding:5px 20px;
    margin:0 15px 0 0;
    background:#f599bd;
    border:4px #f5cadd solid;
    color:#fff;
    font-weight:bold;
    font-size:16px;
    text-decoration:none;
    float:left;
    display:block
}

a.my_upload:hover{
    position: relative;
    background:#f8639e;
    border:4px #f7b4d2 solid;
    color:#fff;
    top:-1px;
    left:-1px;
    box-shadow:2px 2px 6px -2px rgba(20%,20%,40%,0.5);
}


a.my_fb{
    position: relative;
    padding:5px 20px;
    margin:0 15px 0 0;
    background:#348ce3;
    border:4px #91c6fe solid;
    color:#fff;
    font-weight:bold;
    font-size:16px;
    text-decoration:none;
    float:left;
    display:block
}

a.my_fb:hover{
    position: relative;
    background:#0074e6;
    border:4px #75b8ff solid;
    color:#fff;
    top:-1px;
    left:-1px;
    box-shadow:2px 2px 6px -2px rgba(20%,20%,40%,0.5);
}
a.pop_android{
position: relative;
    width: 700px;
    padding: 0px 0 8px 15px;
    color: #d40000;
    font-size: 12px;
    float: left;
}

.select2_pic{
    position:relative;
    padding:10px;
    width:660px;
    height:300px;
    margin:0 10px;
        box-shadow:2px 2px 6px -2px rgba(20%,20%,40%,0.5);
        float:left;
        background:#fff/**/
}
.select2_pic img{
    padding:6px;
}

.step2 > p{
        position:relative;
    padding:10px;
    width:660px;
    margin:0 10px;
font-size:13px;
color:#d40000;
line-height:1.1em;
float:left
}


/*step2-1*/
.step2-1{
position:absolute;
width:700px;
height:555px;
top:55px;
left:120px;
float:left
}


.step2-1 > h4{
position:relative;
font-size:19px;
color:#026d59;
font-weight:bold;
width:700px;
float:left;
padding-bottom:5px
}

.step2-1 > h4 > b{
float:left;
padding-right:5px
}

.step2-1 > h4 > span{
position:relative;
font-size:12px;
color:#d40000;
font-weight:bold;
float:left;
padding-bottom:5px;
line-height:1.7em
}

.step2-1 > h4 > span > em{
font-size:18px;
}

.step2-1 > h4 > label{
position:relative;
font-size:12px;
color:#026d59;
float:left;
line-height:2em

}

.select2-1_pic{
    position:relative;
    padding:10px;
    width:660px;
    height:300px;
    margin:0 10px;
        box-shadow:2px 2px 6px -2px rgba(20%,20%,40%,0.5);
        float:left;
        background:#fff/**/;
    top: 1px;
    left: 0px;
    overflow-x:scroll
}
.select2-1_pic img{
    padding:6px;
}

.setp2-1_select{
    width:690px;
    padding:15px 0 10px 20px;
    float:left
}

.setp2-1_select > p{
     float:left;
     padding:0 25px 0 0;
     display:block;
     color:#333;
     font-weight:bold
}

.setp2-1_select > label{
          cursor:pointer;
}

.setp2-1_select img
{
    vertical-align:middle;
    padding-left:5px
}

/*step3*/
.step3{
position:absolute;
width:700px;
height:555px;
top:55px;
left:120px;
float:left
}


.step3 > h4{
position:relative;
font-size:19px;
color:#026d59;
font-weight:bold;
width:700px;
float:left;
padding-bottom:5px
}

.step3 > h4 > b{
float:left;
padding-right:5px
}
.step3 > h4 > span{
position:relative;
font-size:12px;
color:#026d59;
font-weight:bold;
float:left;
padding-bottom:5px;
line-height:2em
}

.step3_mod{
    position:absolute;
    top:0;
    right:0;

}


.step3_mod a{
    position: relative;
    padding:5px 50px;
    background:#f599bd;
    border:4px #f5cadd solid;
    color:#fff;
    font-weight:bold;
    font-size:16px;
    text-decoration:none;
    float:left;
    display:block
}

.step3_mod a:hover{
    position: relative;
    background:#f8639e;
    border:4px #f7b4d2 solid;
    color:#fff;
    top:-1px;
    left:-1px;
    box-shadow:2px 2px 6px -2px rgba(20%,20%,40%,0.5);
}

.step3_select_h{
    width:680px;
    padding:30px 0 10px 20px;
    float:left
}

.step3_select_h > p{
     float:left;
     padding:0 25px 0 0;
     display:block;
     color:#333;
     font-weight:bold;
     font-size:13px;
     text-align: right;
     margin:0 6px
}

.step3_select_h > label{
          cursor:pointer;
}

.step3_select_h img
{
    vertical-align:middle;
    margin:5px 0;
}

.step3_select_w{
    width:680px;
    padding:30px 0 10px 20px;
    float:left
}

.step3_select_w > p{
     float:left;
     padding:10px 5px 10px 0;
     display:block;
     color:#333;
     font-weight:bold;
     font-size:13px;
     text-align:center;
}

.step3_select_w > label{
          cursor:pointer;
}

.step3_select_w img
{
    vertical-align:middle;
    margin:5px 0;
}


/*step3a單張挑選*/
.step3a{
position:absolute;
width:700px;
height:555px;
top:55px;
left:120px;
float:left
}


.step3a > h4{
position:relative;
font-size:19px;
color:#026d59;
font-weight:bold;
width:700px;
float:left;
padding-bottom:5px
}

.step3a > h4 > b{
float:left;
padding-right:5px
}

.step3a > h4 > span{
position:relative;
font-size:12px;
color:#026d59;
font-weight:bold;
float:left;
padding-bottom:5px;
line-height:2em
}

.red_fa01{
  position: absolute;
  top: 25px;
  left: 144px;
  width: 412px;
  color: #d40000;
  font-size: 13px;
  line-height: 1.5em;
  padding: 5px;
}
.red_fw01{
  position: absolute;
  top: 25px;
  left: 80px;
  width: 412px;
  color: #d40000;
  font-size: 13px;
  line-height: 1.5em;
  padding: 5px;
}

/*step3-1a單張進階編輯照片*/
.step3-1a{
position:absolute;
width:900px;
height:555px;
top:55px;
left:20px;
float:left
}


.step3-1a > h4{
position:relative;
font-size:19px;
color:#026d59;
font-weight:bold;
width:700px;
float:left;
padding:0 0 5px 100px;
}

.step3-1a > h4 > b{
float:left;
padding-right:5px
}


.step3-1a > h4 > span{
position:relative;
font-size:12px;
color:#026d59;
font-weight:bold;
float:left;
padding-bottom:5px;
line-height:2em
}
.step3-1a_mod{
position: relative;
width:900px;
height:450px;
float:left
}







/*step3-1進階編輯照片*/
.step3-1{
position:absolute;
width:900px;
height:555px;
top:55px;
left:20px;
float:left
}


.step3-1 > h4{
position:relative;
font-size:19px;
color:#026d59;
font-weight:bold;
width:700px;
float:left;
padding:0 0 5px 100px;
}

.step3-1 > h4 > b{
float:left;
padding-right:5px
}


.step3-1 > h4 > span{
position:relative;
font-size:12px;
color:#026d59;
font-weight:bold;
float:left;
padding-bottom:5px;
line-height:2em
}



.step3-1 > h5{
position:relative;
font-size:19px;
color:#026d59;
font-weight:bold;
width:700px;
float:left;
padding:0 0 5px 100px;
    top: 33px;
    left: 31px;
}

.step3-1 > h5 > b{
float:left;
padding-right:5px
}


.step3-1 > h5 > span{
position:relative;
font-size:12px;
color:#026d59;
font-weight:bold;
float:left;
padding-bottom:5px;
line-height:2em
}

.step3-1_mod{
position: relative;
width:900px;
height:450px;
float:left
}

/*step4風格設計*/
.step4{
position:absolute;
width:900px;
height:555px;
top:55px;
left:20px;
float:left
}


.step4 > h4{
position:relative;
font-size:19px;
color:#026d59;
font-weight:bold;
width:700px;
float:left;
padding:0 0 5px 100px;
}

.step4 > h4 > b{
float:left;
padding-right:5px
}


.step4 > h4 > span{
position:relative;
font-size:12px;
color:#026d59;
font-weight:bold;
float:left;
padding-bottom:5px;
line-height:2em
}
.step4_mod{
position: relative;
width:900px;
height:450px;
float:left
}

/*step4a單張風格設計*/
.step4a{
position:absolute;
width:900px;
height:555px;
top:55px;
left:20px;
float:left
}


.step4a > h4{
position:relative;
font-size:19px;
color:#026d59;
font-weight:bold;
width:700px;
float:left;
padding:0 0 5px 100px;
}

.step4a > h4 > b{
float:left;
padding-right:5px
}


.step4a > h4 > span{
position:relative;
font-size:12px;
color:#026d59;
font-weight:bold;
float:left;
padding-bottom:5px;
line-height:2em
}
.step4a_mod{
position: relative;
width:900px;
height:450px;
float:left
}


/*step4-1挑選相框*/
.step4-1{
position:absolute;
width:700px;
height:555px;
top:55px;
left:120px;
float:left
}


.step4-1 > h4{
position:relative;
font-size:19px;
color:#026d59;
font-weight:bold;
width:700px;
float:left;
padding-bottom:5px
}

.step4-1 > h4 > b{
float:left;
padding-right:5px
}
.step4-1 > h4 > span{
position:relative;
font-size:12px;
color:#026d59;
font-weight:bold;
float:left;
padding-bottom:5px;
line-height:2em
}

.step4-1_box{
position: relative;
width:700px;
height:450px;
float:left
}


.step4-1_pic_h_all{
position: absolute;
width:145px;
height:410px;
top:20px;
left:170px;
}


.step4-1_pic_h_bk{
position: absolute;
width:145px;
height:410px;
top:0px;
left:0px;
line-height:410px;
text-align:center
}
.step4-1_pic_h_bk img{
 vertical-align:middle

}
.step4-1_pic_h{
position: absolute;
width:145px;
height:410px;
top:0px;
left:0px;
line-height:410px;
text-align:center
}

.step4-1_pic_h img{
 vertical-align:middle
}

.step4-1_pic_h_select{
position: absolute;
width:155px;
height:320px;
top:70px;
right:180px;
text-align:center

}


.step4-1_pic_h_select > ul{
float:left;
position:relative
}

.step4-1_pic_h_select > ul >li{
float:left;
position:relative
}

.step4-1_pic_h_select > ul >li > a{
float:left;
position:relative;
width:155px;
height:94px;
display:block;
margin:0 0 10px 0;
line-height:94px;
text-decoration:none;
}

.step4-1_pic_h_select > ul >li > a > p{
font-size:22px;
font-weight:bold;
color:#026d59;
z-index:10;
position:relative
}

.step4-1_pic_h_select > ul >li > a > span{
position:absolute;
bottom:10px;
right:10px;
background:url('../img/box_select.png') no-repeat;
width:13px;
height:13px;
z-index:11
}

.step4-1_pic_h_select > ul >li > a > em{
position:absolute;
width:155px;
height:94px;
top:0;
left:0;
z-index:1
}



.step4-1_pic_w_all{
position: absolute;
width:674px;
height:205px;
top:40px;
left:10px;
}


.step4-1_pic_w_bk{
position: absolute;
width:674px;
height:205px;
top:0px;
left:0px;
line-height:205px;
text-align:center
}
.step4-1_pic_w_bk img{
 vertical-align:middle

}
.step4-1_pic_w{
position: absolute;
width:674px;
height:205px;
top:0px;
left:0px;
line-height:205px;
text-align:center
}

.step4-1_pic_w img{
 vertical-align:middle
}

.step4-1_pic_w_select{
position: absolute;
width:500px;
height:95px;
top:320px;
left:100px;
text-align:center

}


.step4-1_pic_w_select > ul{
float:left;
position:relative
}

.step4-1_pic_w_select > ul >li{
float:left;
position:relative
}

.step4-1_pic_w_select > ul >li > a{
float:left;
position:relative;
width:155px;
height:94px;
display:block;
margin:0 11px 0 0;
line-height:94px;
text-decoration:none;
}

.step4-1_pic_w_select > ul >li > a > p{
font-size:22px;
font-weight:bold;
color:#026d59;
z-index:10;
position:relative
}

.step4-1_pic_w_select > ul >li > a > span{
position:absolute;
bottom:10px;
right:10px;
background:url('../img/box_select.png') no-repeat;
width:13px;
height:13px;
z-index:11
}

.step4-1_pic_w_select > ul >li > a > em{
position:absolute;
width:155px;
height:94px;
top:0;
left:0;
z-index:1
}





/*step5發布fb*/
.step5{
position:absolute;
width:700px;
height:555px;
top:55px;
left:120px;
float:left
}


.step5 > h4{
position:relative;
font-size:19px;
color:#026d59;
font-weight:bold;
width:700px;
float:left;
padding-bottom:5px
}


.step5_h{
position: relative;
width:700px;
height:430px;
padding:35px 0 0 0;
float:left;
text-align:center
}

.step5_h > p{
position: relative;
width:400px;
padding:25px 0 20px 40px;
float:left;
text-align:center;
font-size:17px;
line-height:1.5em;
color:#333;
font-weight:bold
}

.step5_h > p > b{
font-size:29px;
line-height:1.5em
}

.step5_h > p > span{
color:#d40000
}

.step5_h > p > span > em{
font-size:25px;
font-style:normal
}


.step5_h > p > strong{

}

.step5_h > p > label{
        position: relative;
width:400px;
float:left;
padding-top:20px;
}




.step5_ha{
position: relative;
width:700px;
height:550px;
padding:0px 0 0 0;
float:left;
text-align:center;
    top: -20px;
}
.pipi_all{
    position:relative;
    width:480px;
    margin:0 110px;

}
.pipi_all > img{
    position:relative;
    float:left;
    margin:5px;
    /*box-shadow:0px 0px 15px 3px rgba(10%,10%,10%,0.7);*/
    top: 0px;
    left: 0px;
}
.step5_ha > p{
position: relative;
width:700px;
padding:0px 0 20px 00px;
float:left;
text-align:center;
font-size:17px;
line-height:1.5em;
color:#333;
font-weight:bold
}

.step5_ha > p > b{
font-size:29px;
line-height:1.5em
}

.step5_ha > p > span{
color:#d40000
}

.step5_ha > p > span > em{
font-size:25px;
font-style:normal
}


.step5_ha > p > strong{

}

.step5_ha > p > label{
        position: relative;
width:700px;
float:left;
padding-top:20px;
    top: 0px;
    left: 0px;
}


.step5_ha > img{
        position: relative;
float:left;
 margin:50px 0 0 0;
box-shadow:2px 2px 6px -2px rgba(20%,20%,40%,0.5);
}










.step5_w{
position: relative;
width:700px;
height:540px;
padding:0px 0 0 0;
float:left;
text-align:center
}

.step5_w > p{
position: relative;
width:700px;
padding:0 0 20px 0;
float:left;
top:-35px;
text-align:center;
font-size:17px;
line-height:1.5em;
color:#333;
font-weight:bold
}

.step5_w > img{
    position:relative;
    top:-35px
}

.step5_w > p > b{
font-size:29px;
line-height:1.5em
}

.step5_w > p > span{
color:#d40000
}

.step5_w > p > span > em{
font-size:25px;
font-style:normal
}

.share_book{
    position: absolute;
    top: 435px;
    left: 200px;
    width: 290px;
    height: 43px;
    line-height: 1.5em;
    text-align: left;
    padding: 5px;
    background: #eee;
    font-size: 14px;
}

.share_book > p{
     float:left;
     padding:0 25px 0 0;
     display:block;
     color:#333;
     font-weight:bold
}


.share_book > label{
          cursor:pointer;
}

.share_book img
{
    vertical-align:middle;
    margin:5px 0;
}


.share_book_h{
    position: absolute;
    top: 300px;
    left: 60px;
    width: 350px;
    height: 50px;
    line-height: 1.5em;
    text-align: left;
    padding: 5px;
    background: #eee;
}

.share_book_h > p{
     float:left;
     padding:0 25px 0 0;
     display:block;
     color:#333;
     font-weight:bold
}


.share_book_h > label{
          cursor:pointer;
}

.share_book_h img
{
    vertical-align:middle;
    margin:5px 0;
}

.share_book_ha{
    position: absolute;
    top: 445px;
    left: 182px;
    width: 299px;
    line-height: 1.5em;
    text-align: left;
    padding: 5px;
    background: #eee;
}

.share_book_ha > p{
     float:left;
     padding:0 25px 0 0;
     display:block;
     color:#333;
     font-weight:bold
}


.share_book_ha > label{
          cursor:pointer;
}

.share_book_ha img{
    vertical-align:middle;
    margin:5px 0;
}
.red_fw {
    position: absolute;
    top: 375px;
    left: 70px;
    width: 570px;
    color: #d40000;
    font-size: 13px;
    line-height: 1.3em;
}

.red_fa{
  position: absolute;
  top: 125px;
  left: 585px;
  width: 210px;
  color: #d40000;
  font-size: 13px;
  line-height: 1.5em;
  padding:5px;
  border:1px #d40000 solid
}


.red_fh{
    position: absolute;
    top: 213px;
    left: 35px;
    width: 412px;
    color: #d40000;
    font-size: 13px;
    line-height: 1.5em;
}


a.bt_fb01{
    padding:10px 20px;
    color:#fff;
    background:#004098;
    font-weight:bold;
    font-size:20px;
    text-decoration:none;
    position:relative;
    margin:0 10px;
}

a.bt_fb01:hover{
    background:#0061e6;
    top:-1px;
    left:-1px;
    box-shadow:2px 2px 6px -2px rgba(20%,20%,40%,0.5);
}

a.bt_book01{
    padding:10px 20px;
    color:#fff;
    background:#888;
    font-weight:bold;
    font-size:20px;
    text-decoration:none;
    position:relative;
    margin:0 10px;
    /*display:none*/
}

a.bt_book01:hover{
    background:#2aad94;
    top:-1px;
    left:-1px;
    box-shadow:2px 2px 6px -2px rgba(20%,20%,40%,0.5);
}

.long_bt4{
    position:absolute;
    bottom:10px;
    left:0;
    width:700px;
    padding:10px 0 0px 0px;
    text-align:center;
    float:left;
}

.long_bt4a{
  position: absolute;
  bottom: 35px;
  left: 10px;
  width: 400px;
  padding: 10px 0 0px 0px;
  text-align: center;
  float: left;
}

.long_bt4b{
    position: absolute;
    bottom: 0px;
    left: 140px;
    width: 400px;
    padding: 10px 0 0px 0px;
    text-align: center;
    float: left;
}


.long_bt4c{
  position: absolute;
  bottom: 55px;
  left: 33px;
  width: 400px;
  padding: 10px 0 0px 0px;
  text-align: center;
  float: left;
}









/*系統運算中*/
.step_load{
position:absolute;
width:700px;
height:450px;
top:55px;
left:120px;
background:url('../img/lo01.png') no-repeat center center
}
.step_load > p{
position:absolute;
width:120px;
height:60px;
top:50%;
left:50%;
 margin-left:-60px;
 margin-top:-30px;
color:#026d59;
text-align:center;
font-weight:bold
}
.step_load > p > span{
font-size:30px;
}

.step_load > em{
position:absolute;
width:150px;
height:150px;
top:50%;
left:50%;
 margin-left:-75px;
 margin-top:-75px;
 background:url('../img/loading.gif') no-repeat
}


.load2{
position: fixed;
width:462px;
height:366px;
top:50%;
left:50%;
margin-left:-231px;
margin-top:-183px;
background:url('../img/loading_bk.png') no-repeat center center;
z-index:9999
}
.load2 > p{
position:absolute;
width:170px;
height:26px;
top:201px;
left:144px;
color:#666;
text-align:center;
font-weight:bold
}
.load2 > p > span{
font-size:30px;
}

.load2 > em{
position:absolute;
width:170px;
height:36px;
top:153px;
left:147px;
 background:url('../img/loading02.gif') no-repeat
}






.long_bt3{
    position:absolute;
    bottom:15px;
    width:900px;
    padding:10px 0 0px 0px;
    text-align:center;
    float:left;
}



/*光箱*/
.pop_bk{
    position:fixed;
    width:100%;
    height:100%;
    min-height:100%;
    z-index:999;
    background:url('../img/point01.png');
    display:none
}

.pop_go_long{
    position:  fixed;
    width:847px;
    height:580px;
    z-index:999;
   top:50%;
    left:50%;
        margin-left:-413px;
margin-top:-290px; /**/
padding:0px 0 0 0;

background: url('../img/how.jpg') no-repeat;
box-shadow:0px 0px 15px 3px rgba(10%,10%,10%,0.7);
    display:none


}
a.gogogo_bt{
    position:absolute;
    top:500px;
    left:320px;
    width:220px;
    height:47px;
    background:url('../img/go_long_bt.gif') no-repeat;
    text-indent:-9999px;
}


.pop_note{
    position: absolute;
    width:846px;
    height:550px;
    z-index:999;
   top:50%;
    left:50%;
        margin-left:-423px;
margin-top:-290px; /**/
padding:0px 0 0 0;

background:#fff;
box-shadow:0px 0px 15px 3px rgba(10%,10%,10%,0.7);
display:none

}

.pop_note > h3{
    position: relative;
    width:756px;
    height:50px;
    z-index:999;
padding:30px 0 20px 90px;
color:#fff;
font-size:30px;

background:#e54973/**/

}

.note_box{
    position:relative;
    float:left;
     margin:30px 30px;
    width:786px;
    height:380px;
    overflow-x: auto;
    overflow-y:no-display

}
.note_box2{
    position:relative;
    float:left;
      padding:0px 60px;
    width:626px;
}
.note_box2 > h4{
    position:relative;
    float:left;
    width:660px;
    color:#d40000;
    line-height:1.5em;
    font-size:15px;
    font-weight:bold
}

.note_box2 > p{
    position:relative;
    float:left;
    width:660px;
    color:#666;
    line-height:1.3em;
    font-size:13px;
    padding-bottom:20px;
    top: 0px;
    left: 0px;
}


.pop_ie9{
    position: absolute;
    width:466px;
    height:280px;
    z-index:999;
   top:50%;
    left:50%;
        margin-left:-233px;
margin-top:-155px; /**/
text-align:center;
padding:30px 0 0 0;

background:#fff
   /* background:url('../img/bb05.jpg') no-repeat;*/

}
.pop_android_pic{
    position:  relative;
    width:847px;
    height:583px;
    z-index:999;
   background:url('../img/android_pic.jpg') no-repeat;
}
.pop_pic{
    position:  relative;
    width:940px;
    height:580px;
    z-index:999;
padding:10px;
text-align:center;
vertical-align:middle;
background:#fff;
   /* background:url('../img/bb05.jpg') no-repeat;*/
}
.pop_pic img{
vertical-align:middle;
}

.pipi_list{
        position:  absolute;
        top:123px;
        left:193px;

        width:600px;
    height:400px;

}

.pipi_list img{
        position:  relative;

float:left;
padding:15px;
}

/*店點地圖*/

.pop_store{
    position: absolute;
    width:570px;
    height:520px;
    z-index:999;
  top:50%;
    left:50%;
        margin-left:-285px;
margin-top:-260px; /* */
padding:15px;
background:#fff;
box-shadow:0px 0px 15px 3px rgba(10%,10%,10%,0.7);
display:none
}



.pop_store > h3{
    position: absolute;
    width:140px;
    height:60px;
    z-index:999;
padding:25px 0 0px 30px;
color:#fff;
font-size:24px;
top:5px;
left:478px;
background:url('../img/store_bt03.png') no-repeat
}


.pop_store > p{
    position:  relative;
    width:460px;
color:#666;
font-size:13px;
line-height:1.3em;
float:left;
padding:0 0 10px 0;
}

.store_map{
    position: relative;
    width:570px;
height:380px;
float:left
}
.pop_store > p > span{
font-weight:bold
}


.store_bt_box{
    position: relative;
    width:570px;
height:50px;
float:left;
text-align:center;
padding:15px 0 0 0;
}
.store_bt_box > a{
            position: relative;
            padding:6px 32px;
            font-size:25px;
            color:#fff;
            font-weight:bold;
            text-align:center;
            /*text-shadow: 0px 0px 6px rgba(255,255,255,0.7);*/
            text-shadow: 0 0 0, 0 1px 1px rgba(0, 0, 0, 0.5);
            background:#61ccff;
            border:1px #0686cd solid;
            box-shadow:1px 1px 5px 1px rgba(30%,30%,60%,0.5);
            margin:0 12px 15px 0

}
.store_bt_box > a:hover {
    /*text-shadow: 0px 0px 6px rgba(255,255,255,0.7);*/
    text-shadow: 0 0 0, 0 1px 1px rgba(0, 0, 0, 0.5);
    background: #18b5ff;
    border: 1px #006ca8 solid;
    box-shadow: 1px 1px 5px 0px rgba(30%,30%,60%,0.5);
    top: 1px;
    left: 1px;
}




















a.pop_close{
    position: absolute;
    width:33px;
    height:36px;
    z-index:999;
background:url('../img/icon_close.png');
top:7px;
right:-11px;
display:block;
text-indent:-9999px
}
a.pop_close2{
    position: absolute;
    width:116px;
    height:61px;
    z-index:999;
background:url('../img/icon_close2.png');
top:20px;
right:-17px;
display:block;
text-indent:-9999px
}
/*大圖縮放功能*/
.smooth_zoom_preloader {
		background-image: url(../img/preloader.gif);
	}	
	.smooth_zoom_icons {
		background-image: url(../img/icons.png);
	}








/*登入畫面*/
.login_all{
   width:1010px;
   height:550px;
   position:relative
}

.login_box{
    position:absolute;
   width:968px;
   height:486px;
  background:url('../img/login_box.png') no-repeat ; /**/
   top:35px;
   left:40px;
}

.login_box2{
    position:absolute;
   width:700px;
   height:286px;
   /*background:url('../img/box.png') no-repeat ;*/
   top:80px;
   left:140px;
}

.login_left{
    position:absolute;
   width:330px;
   height:286px;
   /*background:url('../img/box.png') no-repeat ;*/
   top:0px;
   left:0px;
}


.login_left h3{
    position:absolute;
   width:197px;
   height:27px;
   background:url('../img/login_tit2.gif') no-repeat ;
   top:31px;
   left:75px;
   text-indent:-9999px;
}

.login_left_dt{
position:absolute;
   width:260px;
   height:200px;
   top:75px;
   left:35px;
}
.login_left_dt > dl{
        position: relative;
float:left;
padding-bottom:15px;

}
.login_left_dt > dl > dt{
    position: relative;
   width:40px;
   height:30px;
   float:left;
   font-size:14px;
   color:#666;
   font-weight:bold;
   line-height:30px;
   text-align:center;
}
.login_left_dt > dl > dd{
    position: relative;
   width:210px;
   padding:0 0 0 5px;
   height:30px;
   float:left;
   font-size:14px;
   color:#666;
   font-weight:bold;
   line-height:30px;
   text-align: left
}
select.select01{
       padding:0px;
   height:24px;
      font-size:14px;
   color:#666;
   font-weight:bold;
      text-align: left;
   vertical-align:middle;
      border:1px #ddd solid;
         line-height:10px;
         font-family:微軟正黑體;
            box-shadow:2px 2px 6px -2px rgba(20%,20%,40%,0.8) inset; 
            margin:0 15px 0 0
}



input.input_01{
    position: relative;
   width:200px;
   padding:5px;
   height:14px;
   font-size:14px;
   color:#666;
   font-weight:bold;
   line-height:14px;
   text-align: left;
   vertical-align:middle;
   border:1px #ddd solid;
   box-shadow:2px 2px 6px -2px rgba(20%,20%,40%,0.8) inset; 
}
.login_left_dt >p{
position: relative;
   width:260px;
   float:left;
   text-align:center;
}
a.login_bt01{
position: relative;
   width:100%;
   float:left;
   display:block;
   padding:10px 0;
   text-align:center;
   color:#fff;
   font-size:16px;
   font-weight:bold;
   background: linear-gradient(to bottom, #ee7199 0%,#d52754 100%);
   text-decoration:none
}
a.login_bt01:hover{
   background: linear-gradient(to bottom, #e54578 0%,#b90b38 100%);
position: relative;
top:-1px;
left:-1px;

}

a.forget_ps{
    color:#d40000;
    font-size:13px;
    text-decoration:none
}

a.login_bt02{
    color:#d40000;
    font-weight:bold;
    font-size:14px;
    padding:15px 0 0 0;
    display:block;
    text-decoration:solid
}

a.login_bt02:hover{
    color:#ff0a0a;
}

.line01{
    position:absolute;
    top:30px;
    left:480px;
    width:1px;
    background:url('../img/line01.gif') no-repeat;
    height:408px;
    display:block

}


.login_right{
    position:absolute;
   width:260px;
   height:156px;
   /*background:url('../img/box.png') no-repeat ;*/
   top:90px;
   left:390px;
}

.login_right > h3{
    position: relative;
   width:260px;
   height:106px;
   text-align:center;
   color:#234282;
   font-size:18px;

   /*background:url('../img/box.png') no-repeat ;*/
  
}

a.fb_bt02{
position: relative;
   width:190px;
   float:left;
   display:block;
   padding:10px 0 10px 70px;
   text-align:center;
   color:#fff;
   font-size:16px;
   font-weight:bold;
   background:url('../img/fb_logo.png') no-repeat 55px 9px, border-box linear-gradient(to bottom, #7a95c4 0%,#415f9d 100%);
   text-decoration:none
}
a.fb_bt02:hover{
   background: url('../img/fb_logo.png') no-repeat 55px 9px,linear-gradient(to bottom, #5779b5 0%,#2d4881 100%);
position: relative;
top:-1px;
left:-1px;

}


.member_new{
    position:absolute;
            width: 553px;
            height: 405px;
            top: 35px;
            left: 200px;

}

.member_new > h3{
    position: relative;
            width: 553px;
            height: 50px;
            float:left;
            background:url('../img/login_tit01.gif') no-repeat center center;
            text-indent:-9999px;

}


.member_new > dl{
    position: relative;
            width: 553px;
            float:left
}

.member_new > dl > dt{
    position: relative;
            width: 180px;
            float:left;
            text-align:right;
             vertical-align:middle;
             height:20px;
             line-height:20px;
             font-size:14px;
             font-weight:bold;
             padding-bottom:10px
}

.member_new > dl > dd{
    position: relative;
            width: 250px;
            float:left;
            vertical-align:middle;
                         padding-bottom:10px;
                         padding-left:5px;
                         font-size:13px;
                                      height:20px;
             line-height:20px;

}

a.note_bt01{
    text-decoration:underline;
    color:#d40000
}


.member_new > p{
    position: relative;
            width: 550px;
            float:left;
            padding:15px 0;
            text-align:center;
            margin-top:20px
}



a.reset_bt{
    position: relative;
    padding:5px 60px ;
    color:#fff;
    text-decoration:none;
    margin:0 10px;
   background: linear-gradient(to bottom, #c3c3c3 0%,#8f8f8f 100%);
   font-size :17px;
}
a.reset_bt:hover{
   background: linear-gradient(to bottom, #8f8f8f 0%,#666 100%);
position: relative;
top:-1px;
left:-1px;

}

a.login_ok_bt{
    position: relative;
    padding:5px 60px ;
    color:#fff;
    text-decoration:none;
    margin:0 10px;
   background: linear-gradient(to bottom, #ee7199 0%,#d52754 100%);
      font-size:17px;

}
a.login_ok_bt:hover{
   background: linear-gradient(to bottom, #e54578 0%,#b90b38 100%);
position: relative;
top:-1px;
left:-1px;

}





/*忘記密碼*/
.pop_pass{
    position: absolute;
    width:466px;
    height:312px;
    z-index:999;
  top:50%;
    left:50%;
        margin-left:-233px;
margin-top:-156px; /* */
padding:0px 0 0 0;
/*background:url('../img/sse.gif') no-repeat;*/
background:#fff;
box-shadow:0px 0px 15px 3px rgba(10%,10%,10%,0.7);
display:none/**/}

.pass_box{
    position:absolute;
    width:300px;
    height:200px;
    top:45px;
    left:40px;
    text-align:center
}
.pass_box > h4{
    position: relative;
    width:380px;
    font-weight:bold;
    font-size:21px;
    color:#333;
    
}
.pass_box > h5{
    position: relative;
    width:380px;
    font-weight:bold;
    font-size:15px;
    color:#333;
    padding:10px 0;
    line-height:1.5em
    
}
.pass_box > h6{
    position: relative;
    width:380px;
    font-weight:bold;
    font-size:15px;
    color:#d40000;
    padding:5px 0;
    line-height:1.5em
}
.pass_box > p{
    position: relative;
    width:380px;
    font-size:15px;
    color:#333;
    padding:15px 0;
    line-height:1.5em;
    text-align:center
}

a.login_bt01a{
position: relative;
   padding:10px 20px;
   text-align:center;
   color:#fff;
   font-size:16px;
   font-weight:bold;
   background: linear-gradient(to bottom, #ee7199 0%,#d52754 100%);
   text-decoration:none
}
a.login_bt01a:hover{
   background: linear-gradient(to bottom, #e54578 0%,#b90b38 100%);
position: relative;
top:-1px;
left:-1px;

}








/*店點*/

.store_all{
   width:1010px;
   height:650px;
   position:relative
}

.store_box{
    position:absolute;
   width:957px;
   height:600px;
  background:url('../img/store_box.png') no-repeat ; /**/
   top:40px;
   left:50px;
}


.store_box > h3{
    position:absolute;
   width:241px;
   height:66px;
   background:url('../img/store_tit.png') no-repeat ;
   top:-20px;
   left:-12px;
   text-indent:-9999px;
   z-index:10
}
.store_box > h4{
    position:absolute;
   width:196px;
   height:83px;
   top:55px;
   right:-12px;
}
.store_box > h4 > a{
    position: relative;
   width:196px;
   height:60px;
   background:url('../img/store_bt01.png') no-repeat; /**/
   z-index:10;
   display:block;
   padding:25px 0 0 15px;
   color:#fff;
   font-size:22px;
   font-weight:normal;
   letter-spacing:-1px;
}
.store_box > h4 > a:hover,
.store_box > h4 > a.on{
    position: relative;
   width:196px;
   height:60px;
   background:url('../img/store_bt02.png') no-repeat; /**/
   z-index:10;
   display:block;
   padding:25px 0 0 15px;
   color:#fff;
   font-size:22px;
   font-weight:normal;
   letter-spacing:-1px;
   top:-1px;
   left:-1px;
}
.store_box > h4 > a > em{
font-style:normal;
font-weight:bold;
   font-size:25px;
}

.store_note{
            position: absolute;
            width: 656px;
            height: 472px;
            top: 68px;
            left: 77px;
           background:#f6f6f6; 
            box-shadow:0px 0px 6px 1px rgba(20%,20%,40%,0.3) inset; /**/
}
.store_note > h5{
            position: absolute;
            width: 350px;
            top: 120px;
            left: 25px;
            font-size:20px;
            line-height:1.4em;
            font-weight:normal;
            color:#666;
            letter-spacing:-1px
}
.store_note > h5 > span{
            font-size:25px;
            font-weight: bold;
}
.store_note > em{
            position:absolute;
            top:70px;
            left:340px;
}
.store_note > p{
            position:absolute;
            top:240px;
            left:30px;
            width:580px;
            height:200px;
            line-height:1.7em;
            font-size:15px;
            color:#666
}
.store_note2 label{
    position:absolute;
    top:2px;
    left:262px;

    background:url('../img/1hr.png') no-repeat;
    width:190px;
    height:38px;
}


.store_note2 {
            position: absolute;
            width: 606px;
            height: 432px;
            top: 68px;
            left: 77px;
            padding:15px 25px 25px 25px;
           background:#f6f6f6; 
            box-shadow:0px 0px 6px 1px rgba(20%,20%,40%,0.3) inset; /**/
            overflow-x:auto
}

.store_note2 > h4{
            position: relative;
            width: 606px;
            float:left;
            font-size:22px;
            color:#666;
            padding:5px 0;
}
.store_note2 > h5{
            position: relative;
            width: 606px;
            float:left;
            font-size:22px;
            color:#666;
            padding:5px 0;
            height:35px;
            line-height:35px;
}
.store_note2 > h5 >span{
            color:#61ccff;
            font-size:25px;
            font-weight:bold
}
.store_area{
            position: relative;
            width: 615px;
            float:left;
            padding:5px 0;
}
.store_area > a{
            position: relative;
            float:left;
            padding:6px 31px;
            font-size:25px;
            color:#fff;
            font-weight:bold;
            text-align:center;
            /*text-shadow: 0px 0px 6px rgba(255,255,255,0.7);*/
            text-shadow: 0 0 0, 0 1px 1px rgba(0, 0, 0, 0.5);
            display:block;
            background:#61ccff;
            border:1px #0686cd solid;
            box-shadow:1px 1px 5px 1px rgba(30%,30%,60%,0.5);
            margin:0 12px 15px 0

}
.store_area > a.no,
.store_area > a.no:hover{
            position: relative;
            float:left;
            padding:6px 31px;
            font-size:25px;
            color:#fff;
            font-weight:bold;
            text-align:center;
            /*text-shadow: 0px 0px 6px rgba(255,255,255,0.7);*/
            text-shadow: 0 0 0, 0 1px 1px rgba(0, 0, 0, 0.5);
            display:block;
            background:#aaa;
            border:1px  #999 solid;
            box-shadow:1px 1px 5px 1px rgba(30%,30%,60%,0.5);
            margin:0 12px 15px 0;
                        top:0px;
            left:0px;
            cursor: default


}
.store_area > a:hover{
            /*text-shadow: 0px 0px 6px rgba(255,255,255,0.7);*/
            text-shadow: 0 0 0, 0 1px 1px rgba(0, 0, 0, 0.5);
            display:block;
            background:#18b5ff;
            border:1px #006ca8 solid;
            box-shadow:1px 1px 5px 0px rgba(30%,30%,60%,0.5);
            top:1px;
            left:1px;

}


.store_area2{
            position: relative;
            width: 585px;
            float:left;
            padding:10px;
            height:350px;
}

.store_detail_box{
    position:relative;
    width:555px;
    padding:10px 15px;
    background:#fff;
    box-shadow:0px 0px 6px 1px rgba(20%,20%,40%,0.3) inset;
    border:1px #a0a0a0 solid;
    margin:0 0 20px 0;
    display:table
}

.store_detail_box > strong.hr_ok{
    position:relative;
    width:38px;
    height:32px;
        display:table-cell;
    vertical-align: middle;
    text-align:center;
    background:url('../img/1hr02.png') no-repeat center center

}
.store_detail_box > strong{
    position:relative;
    width:38px;
    height:32px;
        display:table-cell;
    vertical-align: middle;
    text-align:center;

}

.store_detail_box > h5{
    position:relative;
    width:140px;
    font-size:20px;
    color:#666;
        display:table-cell;
    vertical-align: middle;
    text-align:center;

}

.store_detail_box > p{
    position:relative;
    width:310px;
    font-size:13px;
    color:#666;
    padding:0px 0 0 15px;
    line-height:1.1em;
    float:left

}
.store_detail_box > p > span{
font-weight:bold
}
.store_detail_box > p > span > a.line_qr{
padding:3px ;background:#aaa;
display:block;
color:#fff;
float:left;
margin-top:4px;
border-radius:3px;
position:relative
}


em.qr_box{
        background:url('../img/qr_box.png') no-repeat;
        width:175px;height:166px;
        padding:7px 0 0 15px;
        position:absolute;
        top:-76px;
        left:83px;
        display:none;/**/
        z-index:999
}
em.qr_box > img{
        border-radius:10px;
}




.store_detail_box > em{
    position:relative;
        display:table-cell;
    vertical-align: middle;

}


a.store_pop_bt{
            position: relative;
            padding:5px 10px;
            font-size:20px;
            text-align:center;
            width:50px;
            float:right;
            color:#fff;
            font-weight:bold;
            display:block;
            background:#8e9295;
            box-shadow:1px 1px 5px 1px rgba(30%,30%,60%,0.5);
    top: 0px;
    left: 0px;
}

a.store_pop_bt:hover{
            /*text-shadow: 0px 0px 6px rgba(255,255,255,0.7);*/
            background:#0478ae;
            box-shadow:1px 1px 5px 0px rgba(30%,30%,60%,0.5);
            top:1px;
             left:1px;

}





a.store_bk_bt{
            position:  absolute;
            padding:1px 10px;
            font-size:20px;
            color:#fff;
            font-weight:bold;
            /*text-shadow: 0px 0px 6px rgba(255,255,255,0.7);*/
            text-shadow: 0 0 0, 0 1px 1px rgba(0, 0, 0, 0.5);
            display:block;
            background:#61ccff;
            border:1px #0686cd solid;
            box-shadow:1px 1px 5px 1px rgba(30%,30%,60%,0.5);
            top:0px;
            right:10px;

}
a.store_bk_bt:hover{
            /*text-shadow: 0px 0px 6px rgba(255,255,255,0.7);*/
            text-shadow: 0 0 0, 0 1px 1px rgba(0, 0, 0, 0.5);
            background:#18b5ff;
            border:1px #006ca8 solid;
            box-shadow:1px 1px 5px 0px rgba(30%,30%,60%,0.5);
            top:1px;
            right:9px;

}




/*特輯*/
.book_all{
   width:1010px;
   height:650px;
   position:relative
}

.page_list{
    position:absolute;
   bottom:35px;
   right:200px;
   padding:5px 10px;
   color:#333;
   font-size:13px;
   margin:0 5px;
}

.page_list a{
   padding:0px 5px;
   color:#333;
   font-size:13px;
}

.page_list a:hover,
.page_list a span{
   color:#0860ff;
   font-size:13px;

}

a.book_next{
    position:absolute;
   bottom:35px;
   right:50px;
   padding:5px 10px;
   background:#e9e9e9;
   text-decoration:none;
   color:#333;
   font-size:13px;
   box-shadow:1px 1px 5px 1px rgba(30%,30%,60%,0.5);
   margin:0 5px;
}

a.book_prev{
    position:absolute;
   bottom:35px;
   right:130px;
   padding:5px 10px;
   background:#e9e9e9;
   text-decoration:none;
   color:#333;
   font-size:13px;
   box-shadow:1px 1px 3px 1px rgba(30%,30%,60%,0.5);
   margin:0 5px;
}

a.book_prev:hover,a.book_next:hover{
   box-shadow:1px 1px 1px 1px rgba(30%,30%,60%,0.5);
      background:rgba(20%,20%,40%,0.3);

}


.book_box{
    position:absolute;
   width:968px;
   height:597px;
   background:url('../img/book_box.png') no-repeat ;/**/
   top:35px;
   left:40px;
}


.book_box > h3{
    position:absolute;
   width:282px;
   height:60px;
   background:url('../img/book_tit01.png') no-repeat ;
   top:-10px;
   left:-3px;
   text-indent:-9999px;
   z-index:10
}

.book_box > h4{
    position:absolute;
   width:497px;
   height:60px;
   top:67px;
   left:72px;
   z-index:8;
   line-height:1.4em;
   font-size:17px;
   /*display:none;*/
}

.book_box > h4 > em{
font-size:23px;
font-style:normal}

.book_box > h4 > span{
font-size:23px;
color:#d40000
}


.book_box > h4 > a{
font-size:14px;
text-decoration:underline;
color:#666

}





a.long_bt05{
    position:absolute;
   width:290px;
   height:101px;
   top:40px;
   left:620px;
   z-index:8;
      background:url('../img/go_long_bt.png') no-repeat;
      text-indent:-9999px;
}

.book_list{
    position:absolute;
    top:180px;
    left:85px;
    width:815px;
    height:360px;
    overflow-x:auto;
    padding:10px 30px;
                box-shadow:0px 0px 6px 1px rgba(20%,20%,40%,0.3) inset; /**/

}


.book_sbox {
    position: relative;
    width:175px;
    padding:5px;
    background:#fff;
        box-shadow:2px 2px 6px -2px rgba(20%,20%,40%,0.5);
        margin:0 7px 20px 7px;
        float:left
}

.book_st{
    position:absolute;
    left:15px;
    bottom:10px;
    color:#fff;
    text-shadow: 0px 0px 5px rgba(000,000,000,1);
    pointer-events:none
}


.book_st > p{
    font-size:12px;
    float:left;
    padding-right:3px;
}


.book_st > strong{
    font-size:40px;
        float:left;
            line-height:1em;
            font-family:  '新細明體'

}

.book_st > span{
    font-size:12px;
        float:left;
            line-height:4.5em


}


a.love_bt {
    position: absolute;
    width:23px;
    height:16px;
    background:#fff;
              background:url('../img/love.gif') no-repeat;
              bottom:4px;
              right:5px;
              text-indent:-9999px;
}

.book_sbox > a > img{
padding-bottom:5px;
float:left;
width:175px;
height:175px;
overflow:hidden;
vertical-align:middle
}
.book_sbox > span{
font-size:13px;
color:#666;
float:left;
width:100px;
}


.book_sbox > span >em{
color:#d40000;
font-weight:bold;
font-style:normal;
}


.book_pop_bk{
    position:absolute;
    top:13px;
    left:12px;
    width:928px;
    height:565px;
    background:url('../img/point01.png');
    z-index:9;
    overflow:hidden;
    display:table;
    display:none/**/

}

.book_pop{
    position: relative;
    width:928px;
    height:565px;
        display:table-cell;
    vertical-align: middle;
    text-align:center;

}

a.book_close{
    position:absolute;
    top:25px;
    right:25px;
    background:url('../img/icon_close3.png') no-repeat;
    width:33px;
    height:30px;
    text-indent:-9999px;
    display:block;
    z-index:11
}

.pop_note2{
    position: absolute;
    width:846px;
    height:550px;
    z-index:999;
  top:50%;
    left:50%;
        margin-left:-423px;
margin-top:-290px; /* */
padding:0px 0 0 0;

background:#fff;
box-shadow:0px 0px 15px 3px rgba(10%,10%,10%,0.7);
display:none

}

.pop_note2 > h3{
    position: relative;
    width:756px;
    height:50px;
    z-index:999;
padding:30px 0 20px 90px;
color:#fff;
font-size:25px;

background:#58c69b/**/

}

.pop_note2 > h3 > em{
font-style:normal;
font-size:17px;
}
.note_box3{
    position:relative;
    float:left;
     margin:30px 30px;
    width:786px;
    height:380px;
    overflow-x: auto;
    overflow-y:no-display

}
.note_box4{
    position:relative;
    float:left;
      padding:0px 60px;
    width:626px;
}
.note_box4 > h4{
    position:relative;
    float:left;
    width:660px;
    color:#d40000;
    line-height:1.5em;
    font-size:15px;
    font-weight:bold
}
.note_box4 > ol{
    position:relative;
    float:left;
    width:660px;
    line-height:1.5em;
    font-size:13px;
    list-style:decimal-leading-zero;
        padding-bottom:20px

}
.note_box4 > span{
    position:relative;
    float:left;
    width:660px;
    line-height:1.5em;
    font-size:13px;
    list-style:decimal-leading-zero;
        padding-bottom:20px

}
.note_box4 > ol > li{
    position:relative;
    float:left;
    width:630px;
    line-height:1.5em;
    font-size:13px;
     margin: 0 0 0 30px;
}
.note_box4 > ol > li strong{
font-weight:bold}
.note_box4 > ol > li em{
font-weight:bold}

.note_box4 > p{
    position:relative;
    float:left;
    width:660px;
    color:#666;
    line-height:1.3em;
    font-size:13px;
    padding-bottom:20px;
    top: 0px;
    left: 0px;
}


/*右邊line*/
.lint_bt {
    position: fixed;
    top: 345px;
    right: 0;
    width: 166px;
    height: 91px;
    z-index: 900;

}


.line_bt_a{
    width:166px;
    height:91px;
    text-indent:-9999px;
    display:block;
        background:url('../img/qa_bt.png') no-repeat;
    z-index:900
}

.animated1 { 
    -webkit-animation-duration: 5s; 
    animation-duration: 5s; 
    -webkit-animation-fill-mode: both; 
    animation-fill-mode: both; 
    -webkit-animation-timing-function: ease-in-out; 
    animation-timing-function: ease-in-out; 
    animation-iteration-count:infinite; 
    -webkit-animation-iteration-count:infinite; 
} 

@-webkit-keyframes shake { 
    0%, 100% {-webkit-transform: translateX(0);} 
    10%, 30%, 50%, 70%, 90% {-webkit-transform: translateX(-10px);} 
    20%, 40%, 60%, 80% {-webkit-transform: translateX(10px);} 
} 
@keyframes shake { 
    0%, 100% {transform: translateX(0);} 
    10%, 30%, 50%, 70%, 90% {transform: translateX(-10px);} 
    20%, 40%, 60%, 80% {transform: translateX(10px);} 
} 
.shake { 
    -webkit-animation-name: shake; 
    animation-name: shake; 
}


/*會員專區*/
.member_all{
   width:1010px;
   height:700px;
   position:relative
}

.member_box{
    position:absolute;
   width:957px;
   height:597px;
  background:url('../img/book_box.png') no-repeat ; /**/
   top:41px;
   left:50px;
}
.member_all > h3{
    position:absolute;
   width:241px;
   height:59px;
   background:url('../img/member.gif') no-repeat ;
   top:25px;
   left:37px;
   text-indent:-9999px;
   z-index:10
}

.info_box{
    position:absolute;
    top:64px;
    left:74px;
    width:793px;
    border-bottom:1px #ccc solid;
    height: 36px;
}

.info_box > h4{
    position:absolute;
    top:2px;
    left:4px;
    width:302px;
    padding:0 0 0 40px;
    background:url('../img/icon_login01.png') no-repeat 10px 5px;
    background-size:20px;
    line-height:30px;
    height:30px;
    color:#026d59;
    font-size:23px;
    font-weight:bold;
}

.member_box > h5{
    position:absolute;
    top:115px;
    left:120px;
    width:702px;
    line-height:30px;
    height:30px;
    color:#666;
    font-size:16px;
}

.member_box > h5 > span{
    color:#d40000;
}


.member_log{
    position:absolute;
    top:149px;
    left:73px;
    width:826px;
    height:318px;
    overflow-x:auto
}
.member_a_box{
        position:absolute;
    top:510px;
    left:72px;
    width:826px;
    height:50px;
    text-align:center
}
.member_a_box > a.go_long_bt{
            position: relative;
            padding:6px 20px;
            font-size:25px;
            color:#fff;
            font-weight:bold;
            text-align:center;
            /*text-shadow: 0px 0px 6px rgba(255,255,255,0.7);*/
            text-shadow: 0 0 0, 0 1px 1px rgba(0, 0, 0, 0.5);
            background:#61ccff;
            border:1px #0686cd solid;
            box-shadow:1px 1px 5px 1px rgba(30%,30%,60%,0.5);
            margin:0 12px 15px 0

}
.member_a_box > a.go_long_bt:hover{
    /*text-shadow: 0px 0px 6px rgba(255,255,255,0.7);*/
    text-shadow: 0 0 0, 0 1px 1px rgba(0, 0, 0, 0.5);
    background: #18b5ff;
    border: 1px #006ca8 solid;
    box-shadow: 1px 1px 5px 0px rgba(30%,30%,60%,0.5);
    top: 1px;
    left: 1px;
}

.member_a_box > a.go_store_bt{
            position: relative;
            padding:6px 20px;
            font-size:25px;
            color:#fff;
            font-weight:bold;
            text-align:center;
            /*text-shadow: 0px 0px 6px rgba(255,255,255,0.7);*/
            text-shadow: 0 0 0, 0 1px 1px rgba(0, 0, 0, 0.5);
            background:#61ccff;
            border:1px #0686cd solid;
            box-shadow:1px 1px 5px 1px rgba(30%,30%,60%,0.5);
            margin:0 12px 15px 0

}
.member_a_box > a.go_store_bt:hover{
    /*text-shadow: 0px 0px 6px rgba(255,255,255,0.7);*/
    text-shadow: 0 0 0, 0 1px 1px rgba(0, 0, 0, 0.5);
    background: #18b5ff;
    border: 1px #006ca8 solid;
    box-shadow: 1px 1px 5px 0px rgba(30%,30%,60%,0.5);
    top: 1px;
    left: 1px;
}





.member_tit{
    position: relative;
    margin:0 0 0 20px;
    width:770px;
    background:#dee4eb;
    float:left
}
.member_list{
    position: relative;
    margin:0 0 0 20px;
    width:770px;
    /*background:#dee4eb*/
    float:left
}


.member_tit > p,
.member_list > p{
    position:relative;
    font-size:15px;
    float:left;
    padding:3px;
    line-height:1.5em;
    color:#666
}

.member_tit > p > img,
.member_tit > p > input
{
 vertical-align:middle;

}

p.log01{
    width:23px;
        text-align:center;
    vertical-align:middle;

}

p.log01a{
    width:35px;
        text-align:center;
    vertical-align:middle;
}
p.log01a > span{
    width:25px;
    height:20px;
    line-height:20px;
    display:block;
    float:left;
     margin:2px;
        text-align:center;
    vertical-align:middle;
    border:1px #333 solid;
    overflow:hidden
}
p.log01a > span > img{
    max-height:30px;
    vertical-align:middle;
}
p.log01 input{
    display:block;
    float:left;
    vertical-align:middle;
    margin-top:5px;
    margin-right:3px;

}
p.log02{
    width:178px;
}
p.log02a{
    width:84px;
    text-align:center;
}
p.log03{
    width:150px;
}
p.log03a{
    width:150px;
}

p.log04{
    width:52px;
    text-align:center
}

p.log05{
    width:50px;
    text-align:center
}

p.log05 > a{
padding:3px 7px;
background:#ff7500;
color:#fff
}


.info_bt{
    position:relative;
    float:right;
    height:36px;
    line-height:36px;
}
.info_bt > ul{
    position:relative;
    float: left;
    border-left:1px #888 dotted
}
.info_bt > ul > li{
    position:relative;
    float: left;
}
.info_bt > ul > li > a{
    position:relative;
    float: left;
    height:36px;
    line-height:36px;
    padding:0 25px;
    color:#026d59;
    font-weight:bold;
        border-right:1px #888 dotted

}
.info_bt > ul > li > a:hover,
.info_bt > ul > li > a.ons{
background:#eaeaea
}



.member_mod{
    position:absolute;
            width: 553px;
            height: 405px;
            top: 150px;
            left: 205px;

}

.forget_pass{
    position:absolute;
            width: 553px;
            height: 405px;
            top: 150px;
            left: 205px;

}

.member_mod > dl,
.forget_pass > dl{
    position: relative;
            width: 553px;
            float:left
}

.member_mod > dl > dt,
.forget_pass > dl > dt{
    position: relative;
            width: 180px;
            float:left;
            text-align:right;
             vertical-align:middle;
             height:20px;
             line-height:20px;
             font-size:14px;
             font-weight:bold;
             padding-bottom:10px
}

.member_mod > dl > dd,
.forget_pass > dl > dd{
    position: relative;
            width: 250px;
            float:left;
            vertical-align:middle;
                         padding-bottom:10px;
                         padding-left:5px;
                         font-size:13px;
                                      height:20px;
             line-height:20px;

}

.member_mod > p,
.forget_pass > p{
    position: relative;
            width: 550px;
            float:left;
            padding:15px 0;
            text-align:center;
            margin-top:20px;
    top: 0px;
    left: 0px;
}


/*產品介紹*/
.pro_all{
   width:1010px;
   height:700px;
   position:relative
}

.pro_box{
    position:absolute;
   width:968px;
   height:666px;
  /*background:url('../img/pro_bbk.jpg') no-repeat 197px 13px,url('../img/pro_box.png') no-repeat ;*/ 
  background:url('../img/pro_box.png') no-repeat ; 
   top:40px;
   left:50px;
}

.pro_uc{
    position:absolute;
    width:740px;
    height:628px;
    top:8px;
    left:199px;
    background:url('../img/pro_l_bk.gif') repeat-y
}

p.pro_up01{
    position:absolute;
    top:192px;
    left:275px;
    width:289px;
    height:127px;
}

p.pro_up01 > a.pro_uc01{
    position:relative;
    display:block;
    width:289px;
    height:127px;
    background:url('../img/pro_s01.png') no-repeat;
}

em.pro_up01s {
    position: absolute;
    width:289px;
    height:127px;
    background:url('../img/pro_s01a.png') no-repeat;
    display:none;
        top:192px;
    left:275px;


}

p.pro_up01 > a.pro_uc01:hover{
    position:relative;
    display:block;
    width:289px;
    height:127px;
    background:url('../img/pro_s01b.png') no-repeat;
}

p.pro_up02{
    position:absolute;
    top:78px;
    left:380px;
    width:190px;
    height:111px;
}

p.pro_up02 > a.pro_uc02{
    position:relative;
    display:block;
    width:190px;
    height:111px;
    background:url('../img/pro_s02.png') no-repeat;
}

em.pro_up02s{
    position:absolute;
    width:190px;
    height:111px;
    background:url('../img/pro_s02a.png') no-repeat;
        display:none;
            top:78px;
    left:380px;

}

p.pro_up02 > a.pro_uc02:hover{
    position:relative;
    display:block;
    width:190px;
    height:111px;
    background:url('../img/pro_s02b.png') no-repeat;
}


p.pro_up03{
    position:absolute;
    width:123px;
    height:77px;
        top: 472px;
    left: 224px;

}

p.pro_up03 > a.pro_uc03{
    position:relative;
    display:block;
    width:123px;
    height:77px;
    background:url('../img/pro_s03.png') no-repeat;
}

em.pro_up03s{
    position:absolute;
    width:123px;
    height:77px;
    background:url('../img/pro_s03a.png') no-repeat;
            display:none;
        top: 472px;
    left: 224px;

}

p.pro_up03 > a.pro_uc03:hover{
    position:relative;
    display:block;
    width:123px;
    height:77px;
    background:url('../img/pro_s03b.png') no-repeat;
}
p.pro_up04{
    position:absolute;
    width:136px;
    height:74px;
        top : 475px;
    left: 349px;

}

p.pro_up04 > a.pro_uc04{
    position:relative;
    display:block;
    width:136px;
    height:74px;
    background:url('../img/pro_s04.png') no-repeat;

}

em.pro_up04s{
    position:absolute;
    width:136px;
    height:74px;
    background:url('../img/pro_s04a.png') no-repeat;
    display:none;
            top: 475px;
    left: 349px;

}

p.pro_up04 > a.pro_uc04:hover{
    position:relative;
    display:block;
    width:136px;
    height:74px;
    background:url('../img/pro_s04b.png') no-repeat;
}

.pro_box > h3{
    position:absolute;
   width:241px;
   height:68px;
   background:url('../img/pro_tit01.png') no-repeat ;
   top:-20px;
   left:-12px;
   text-indent:-9999px;
   z-index:10
}

.pro_menu{
    position:absolute;
    top:104px;
    left:24px;
    width:164px;
height:288px;
z-index:50
}


.pro_menu > ul{
    position: relative;
    float:left
}

.pro_menu > ul > li{
    position: relative;
    float:left
}


.pro_menu > ul > li > a{
    position: relative;
    float:left;
    width:134px;
    padding:0 0 0 30px;
    height:70px;
    line-height:70px;
    color:#333;
    font-weight:bold;
    font-size:14px;
    background:url('../img/icon_02.gif') no-repeat 15px 32px;
    display:block
}



.pro_menu > ul > li > a:hover{
color:#ea7db4

}

.pro_close{
    /*position:absolute;
    top:-5px;
    right:12px;
    background:url('../img/icon_close3.png') no-repeat;
    width:33px;
    height:30px;
    cursor:pointer;
    z-index:500;
    display:none*/
}

.pro_list{
    position: relative;
    overflow-x:auto;
    top:20px;
    left:225px;
    width:720px;
     height:610px;
     /*display:none*/
    /*height:2550px;*/
}
.pro_list_img{
    position: relative;
    width:700px;
    
    height:2550px;/**/
    background:url('../img/pro_all.jpg') no-repeat center top
}

.pro_s01{
    position:absolute;
    top:85px;
    left:45px;
    width:613px;
    height:210px;
}
.pro_pic{
    position:absolute;
    top:18px;
    left:47px;
    width:509px;
    height:113px;
    z-index:90
}
.pro_color1,
.pro_color4{
    position:absolute;
    top:2px;
    left:30px;
    width:541px;
    height:144px;
    background:url('../img/pro_01s01.jpg') no-repeat;
    z-index:80
}
.pro_color2,
.pro_color5{
    position:absolute;
    top:2px;
    left:30px;
    width:541px;
    height:144px;
    background:url('../img/pro_01s02.jpg') no-repeat;
    z-index:80
}
.pro_color3,
.pro_color6{
    position:absolute;
    top:2px;
    left:30px;
    width:541px;
    height:144px;
    background:url('../img/pro_01s03.jpg') no-repeat;
    z-index:80
}

.pro_s01 > ul,
.pro_s02 > ul{
position:absolute;
width:230px;
height:50px;
top:152px;
left:187px;
}

.pro_s01 > ul > li,
.pro_s02 > ul > li{
position: relative;
float:left
}
a.pro_bt1,
a.pro_bt4{
    position:relative;
    width:75px;
    float:left;
    height:50px;
}
a.pro_bt1 > span,
a.pro_bt4 > span{
    position:absolute;
    width:25px;
    border:1px #666 solid;
    height:25px;
    background:#000;
    top:2px;
    left:25px;
}
a.pro_bt1 > em,
a.pro_bt4 > em{
    position:absolute;
    width:45px;
    top:35px;
    left:15px;
    font-size:13px;
    font-style:normal;
    text-align:center;
    color:#333
}
a.pro_bt1:hover > em,
a.pro_bt2:hover > em,
a.pro_bt3:hover > em,
a.pro_bt4:hover > em,
a.pro_bt5:hover > em,
a.pro_bt6:hover > em{
    color:#ff7d00
}
a.pro_bt1:hover > span,
a.pro_bt2:hover > span,
a.pro_bt3:hover > span,
a.pro_bt4:hover > span,
a.pro_bt5:hover > span,
a.pro_bt6:hover > span{
    border:1px #ff7d00 solid;
}

a.pro_bt2,
a.pro_bt5{
    position:relative;
    width:75px;
    float:left;
    height:50px;
}
a.pro_bt2 > span,
a.pro_bt5 > span{
    position:absolute;
    width:25px;
    border:1px #666 solid;
    height:25px;
    background:#fff;
    top:2px;
    left:25px;
}
a.pro_bt2 > em,
a.pro_bt5 > em{
    position:absolute;
    width:45px;
    top:35px;
    left:15px;
    font-size:13px;
    font-style:normal;
    text-align:center;
    color:#333
}
a.pro_bt3,
a.pro_bt6{
    position:relative;
    width:75px;
    float:left;
    height:50px;
}
a.pro_bt3 > span,
a.pro_bt6 > span{
    position:absolute;
    width:25px;
    border:1px #666 solid;
    height:25px;
    background:url('../img/pro_icon_bk03.jpg');
    top:2px;
    left:25px;
}
a.pro_bt3 > em,
a.pro_bt6 > em{
    position:absolute;
    width:45px;
    top:35px;
    left:15px;
    font-size:13px;
    font-style:normal;
    text-align:center;
    color:#333
}


.pro_s02{
    position:absolute;
    top:690px;
    left:45px;
    width:613px;
    height:210px;
}

a.gogo_bt{
    position:absolute;
    top:324px;
    right:100px;
    background:url('../img/gogo_bt.png') no-repeat;
    width:153px;
    height:47px;
    display:block
}
a.gogo_bt2{
    position:absolute;
    top:926px;
    right:100px;
    background:url('../img/gogo_bt.png') no-repeat;
    width:153px;
    height:43px;
    display:block
}
a.gogo_bt3{
    position:absolute;
    top:1532px;
    right:100px;
    background:url('../img/gogo_bt.png') no-repeat;
    width:153px;
    height:43px;
    display:block
}
a.gogo_bt4{
    position:absolute;
    top:2154px;
    right:100px;
    background:url('../img/gogo_bt.png') no-repeat;
    width:153px;
    height:43px;
    display:block
}


.line_all{
   width:1010px;
   height:700px;
   position:relative
}

.line_box{
    position:absolute;
   width:968px;
   height:666px;
  /*background:url('../img/pro_bbk.jpg') no-repeat 197px 13px,url('../img/pro_box.png') no-repeat ;*/ 
  background:url('../img/line_box.png') no-repeat ; 
   top:40px;
   left:50px;
   z-index:99
}

.line_box > h3{
    position:absolute;
   width:344px;
   height:72px;
   background:url('../img/line_tit01.png') no-repeat ;
   top:-20px;
   left:-12px;
   text-indent:-9999px;
   z-index:100
}

a.line_close_bt{
    position:absolute;
    top:19px;
    right:0px;
    background:url('../img/icon_close.png') no-repeat;
    width:33px;
    height:36px;
}

/*
有線的表格
*/
table.linetd {
}
table.linetd th {
	border: 1px solid #aaa;
	font-weight: bold;
	/*text-align: center;*/
	padding: 3px;
	background-color: #efefef;
	color: #3333cc;
}
table.linetd tr {
	border: 0px;
	padding: 0px;
}
table.linetd td {
	border: 1px solid #aaa;
	padding: 5px;
    font-size:13px;
}


a.line_qr02{
padding:3px ;background:#aaa;
display:block;
color:#fff;
float:left;
margin-top:4px;
border-radius:3px;
position:relative
}


em.qr_box02{
        background:url('../img/qr_box.png') no-repeat;
        width:175px;height:166px;
        padding:7px 0 0 11px;
        position:absolute;
        top:-76px;
        left:83px;
        display:none;/**/
        z-index:999
}
em.qr_box02 > img{
        border-radius:10px;
}



.lint_tit01{
    position:absolute;
    top:17px;
    left:176px;
    width:489px;
    padding:80px 0 0 252px;
    height:200px;
    background:url('../img/line_tit02.png') no-repeat;
    z-index:90;
    font-size:13px;
    line-height:1.7em;
    color:#026d59
}
.lint_tit01 img{
 vertical-align:middle;

}

.lint_list{
    position:absolute;
    top:207px;
    left:65px;
    width:835px;
    height:410px;
    text-align:center;
    overflow-y:auto;
    box-shadow:2px 2px 6px -2px rgba(20%,20%,40%,0.5) inset; 
    border:1px #ddd solid
}


.lint_list h5{
    position: relative;
    width:820px;
    text-align:center;
    padding:10px 0;
    font-size:22px;
    margin:20px 0 5px 5px;color:#fff;
    background:#55952a
}

.line_area{
    position:absolute;
    top:183px;
    left:725px;
    width:172px;
    height:25px;
    z-index:100
}

.line_area > a{
    position: relative;
    float:left;
    padding:3px;
    margin:0 5px;
    background:#0686cd;
    font-size:14px;
    color:#fff
}
.line_area > a:hover{
    background:#02aa8b;
}


/*time*/

.time_all{
   width:1010px;
   height:700px;
   position:relative
}

.time_box{
    position:absolute;
   width:968px;
   height:666px;
  /*background:url('../img/pro_bbk.jpg') no-repeat 197px 13px,url('../img/pro_box.png') no-repeat ;*/ 
  background:url('../img/box2.png') no-repeat ; 
   top:40px;
   left:50px;
}

.time_box > h3{
    position:absolute;
   width:344px;
   height:79px;
   background:url('../img/time_tit01.png') no-repeat ;
   top:-20px;
   left:-12px;
   text-indent:-9999px;
   z-index:10
}

.time_kv{
    position:absolute;
    top:6px;
    left:6px;
    width:950px;
    height:645px;
    background:url('../img/time01.jpg') no-repeat;
    z-index:3
}

.time_mov{
    position:absolute;
    top:191px;
    left:150px;
    width:629px;
    height:354px;
}

a.time_bt01{
    position:absolute;
    top:130px;
    left:685px;
    background:url('../img/time_bt01.gif') no-repeat;
    width:108px;
    height:28px;
}

a.time_bt02{
    position:absolute;
    top:566px;
    left:280px;
    background:url('../img/time_fb.png') no-repeat;
    width:371px;
    height:62px;
}

a.time_winner_bt01{
    position:absolute;
    top:129px;
    left:797px;
    width:108px;
    height:28px;
    line-height:28px;
    background:#d40000;
    color:#fff;
    text-align:center;
    font-weight:bold;
    font-size:14px;
    border:1px rgba(20%,20%,40%,0.5) solid
}

.pop_time_note{
    position: absolute;
    width:846px;
    height:550px;
    z-index:999;
   top:50%;
    left:50%;
        margin-left:-423px;
margin-top:-290px; 
padding:0px 0 0 0;

background:#fff;
box-shadow:0px 0px 15px 3px rgba(10%,10%,10%,0.7);
display:none

}

.pop_time_note > h3{
    position: relative;
    width:756px;
    height:50px;
    z-index:999;
padding:30px 0 20px 90px;
color:#fff;
font-size:30px;

background:#58c69b/**/

}

.pop_time_note > h3 >span{
font-size:17px;

background:#58c69b/**/

}


.time_note_box{
    position:relative;
    float:left;
     margin:30px 30px;
    width:786px;
    height:380px;
    overflow-x: auto;
    overflow-y:no-display

}

.time_note_imp{
    position:relative;
    float:left;
      padding:15px 60px;
    width:626px;
    text-align:center;
}

.time_note_imp h3{
    position:relative;
    float:left;
    width:660px;
    color:#d40000;
    line-height:1.5em;
    font-size:15px;
    font-weight:bold;    text-align:center;

}

.time_note_imp p{
    position:relative;
    float:left;
    width:660px;
    color:#666;
    line-height:1.3em;
    font-size:13px;
    padding-bottom:20px;
    text-align:center;
}

.time_note_box2{
    position:relative;
    float:left;
      padding:15px 60px;
    width:626px;
}
.time_note_box2 > h4{
    position:relative;
    float:left;
    width:660px;
    color:#d40000;
    line-height:1.5em;
    font-size:15px;
    font-weight:bold
}
.time_note_box2 > ol{
    position:relative;
    float:left;
    width:660px;
    line-height:1.5em;
    font-size:13px;
    list-style:decimal-leading-zero;
        padding-bottom:20px

}
.time_note_box2 > span{
    position:relative;
    float:left;
    width:660px;
    line-height:1.5em;
    font-size:13px;
    list-style:decimal-leading-zero;
        padding-bottom:20px

}
.time_note_box2 > ol > li{
    position:relative;
    float:left;
    width:630px;
    line-height:1.5em;
    font-size:13px;
     margin: 0 0 0 30px;
}
.time_note_box2 > ol > li strong{
font-weight:bold}
.time_note_box2 > ol > li em{
font-weight:bold}

.time_note_box2 > p{
    position:relative;
    float:left;
    width:660px;
    color:#666;
    line-height:1.3em;
    font-size:13px;
    padding-bottom:20px;
    top: 0px;
    left: 0px;
}

/*winner*/
.pop_time_winner{
    position:  relative;
    width:846px;
    height:575px;
    z-index:999;
   /*top:50%;
    left:50%;
        margin-left:-423px;
margin-top:-290px;*/ 
padding:0px 0 0 0;

background:#fff;
box-shadow:0px 0px 15px 3px rgba(10%,10%,10%,0.7);
/*display:none*/

}

.pop_time_winner > h3{
    position: relative;
    width:756px;
    height:50px;
    z-index:999;
padding:30px 0 10px 90px;
color:#fff;
font-size:30px;

background:#589cc6/**/

}

.pop_time_winner > h3 >span{
font-size:17px;

background:#58c69b/**/

}

.time_note_box_winner{
    position:relative;
    float:left;
     margin:10px 30px;
    width:786px;
    height:380px;
    /*overflow-x: auto;
    overflow-y:no-display*/

}

.time_note_imp2{
    position: relative;
    float: left;
    padding: 13px 0 0 88px;
    width: 626px;
}


.time_note_imp2 p{
    position:relative;
    float:left;
    width:660px;
    color:#666;
    line-height:1.5em;
    font-size:14px;
    padding-bottom:5px;
}

.time_note_box_qa{
    position:relative;
    float:left;
     margin:10px 30px;
    width:786px;
    height:450px;
    overflow-x: auto;
    overflow-y:no-display

}

.time_note_qa2{
    position: relative;
    float: left;
    padding: 13px 0 0 33px;
    width:710px;
}


.time_note_qa2 h3{
    position:relative;
    float:left;
    width:710px;
    color:#d40000;
    font-weight:bold;
    line-height:1.5em;
    font-size:15px;
    padding-bottom:5px;
    top: 0px;
    left: 0px;
}

.time_note_qa2 p{
    position:relative;
    float:left;
    width:710px;
    color:#666;
    line-height:1.5em;
    font-size:14px;
    padding-bottom:15px;
    top: 0px;
    left: 0px;
}

/*
有線的表格
*/
table.line {
    width:500px;
    margin:0 70px;
    text-align:center
}
table.line th {
	border: 1px solid #aaa;
	font-weight: bold; /*text-align: center;*/;
	padding: 3px;
	background-color: #afe2b4;
	color: #333;

}
table.line tr {
	border: 0px;
	padding: 0px;
}
table.line td {
	border: 1px solid #aaa;
	padding: 3px;
    font-size:14px;
}



/*news*/
.news_all{
   width:1010px;
   height:700px;
   position:relative
}

.news_box{
    position:absolute;
   width:968px;
   height:666px;
  /*background:url('../img/pro_bbk.jpg') no-repeat 197px 13px,url('../img/pro_box.png') no-repeat ;*/ 
  background:url('../img/line_box.png') no-repeat ; 
   top:40px;
   left:50px;
   z-index:99
}

.news_box > h3{
    position:absolute;
   width:241px;
   height:59px;
   background:url('../img/news_tit01.gif') no-repeat ;
   top:-10px;
   left:-7px;
   text-indent:-9999px;
   z-index:100
}
.news_area{
    position:absolute;
    top:100px;
    left:105px;
    width:750px;
    height:453px;
    text-align:center;
    overflow-y:auto;
    box-shadow:2px 2px 6px -2px rgba(20%,20%,40%,0.5) inset; 
    border:1px #ddd solid
}

.news_01{
    position:relative;
    float:left;
    width:710px;
    padding:10px 10px 10px 10px;
    border-bottom:1px #ddd dotted;
    margin-bottom:10px;
    text-align:left
}

.news_01 > h5{
    position:relative;
    float:left;
    width:710px;
    font-size:13px;
    color:#333;
    line-height:1.5em
}

.news_01 > a {
    position:relative;
    float:left;
    width:710px;
    display:block
}

.news_01 > a > h4{
    position:relative;
    float:left;
    width:710px;
    font-size:17px;
    color:#333;
    line-height:1.5em
}

.news_01 > a > p{
    position:relative;
    float:left;
    width:710px;
    font-size:14px;
    color:#0860ff;
    line-height:1.5em
}
.news_02{
    position:relative;
    float:left;
    width:710px;
    padding:10px 10px 10px 10px;
    border-bottom:1px #ddd dotted;
    margin-bottom:10px;
    text-align:left
}
.news_02 > h3{
    position:relative;
    float:left;
    width:710px;
    font-size:22px;
    color:#0860ff;
    line-height:1.5em
}
.news_02 > h5{
    position:relative;
    float:left;
    width:710px;
    font-size:15px;
    color:#666;
    line-height:1.5em;
    margin-bottom:10px;
    padding-bottom:10px;
        border-bottom:1px #ddd dotted;

}
.news_02 > p{
    position:relative;
    float:left;
    width:710px;
    font-size:15px;
    color:#666;
    line-height:1.5em;

}
.news_bt{
    position:absolute;
bottom:56px;
    width:710px;
    font-size:15px;
    color:#666;
    line-height:1.5em;
    left: 131px;
    text-align:center;
    height: 23px;
}


.news_bt01:hover {
  background: #11b091;
  top: -1px;
  left: -1px;
  box-shadow: 2px 2px 6px -2px rgba(20%,20%,40%,0.5);
}

a.news_bt01 {
  padding: 10px 40px;
  color: #fff;
  background: #3ed3b6;
  font-weight: bold;
  font-size: 20px;
  text-decoration: none;
  position: relative;
  margin: 0 20px;
}



/*拉霸*/
::-webkit-scrollbar {
     width:5px;
	 height:10px;
}
::-webkit-scrollbar-track-piece  {
   	background-color:#fff;
}
::-webkit-scrollbar-thumb {
   width: 15px;
	background-color:#8f8f8f;
}

/*選擇鈕效果*/
input[type="radio"] {
    display:none;
}
input[type="radio"] + label span {
    display:inline-block;
    width:21px;
    height:21px;
    margin:-1px 4px 0 0;
    vertical-align:middle;
    background:url(../img/check_radio_sheet.png) left top no-repeat;
    cursor:pointer;
}
input[type="radio"]:checked + label span {
    background:url(../img/check_radio_sheet.png) right top no-repeat;
}




input[type="checkbox"] {
    display:none;
}
input[type="checkbox"] + label span {
    display:inline-block;
    width:21px;
    height:21px;
    margin:-1px 4px 0 0;
    vertical-align:middle;
    background:url(../img/check_sheet.png) left top no-repeat;
    cursor:pointer;
}

input[type="checkbox"]:checked + label span {
    background:url(../img/check_sheet.png) right top no-repeat;
}



/*201508文字*/
/*step4風格設計*/
.step4f{
position:absolute;
width:900px;
height:555px;
top:55px;
left:20px;
float:left
}


.step4f > h4{
font-size:19px;
color:#026d59;
font-weight:bold;
position:absolute;top:0px; left:0px;width:400px;padding:0
}



.step4f > h4 > b{
float:left;
padding-right:5px
}


.step4f > h4 > span{
position:relative;
font-size:12px;
color:#026d59;
font-weight:bold;
float:left;
padding-bottom:5px;
line-height:2em
}

.step4f > h5{
font-size:19px;
color:#026d59;
font-weight:bold;
position:absolute;top:5px; left:650px;width:250px;padding:0
}



.step4f > h5 > b{
float:left;
padding-right:5px
}


.step4f > h5 > span{
position:relative;
font-size:12px;
color:#026d59;
font-weight:bold;
float:left;
padding-bottom:5px;
line-height:2em
}


.step4f_mod{
position: relative;
width:900px;
height:450px;
float:left
}

.ft_01{
   position:absolute;
   left:650px;
   top:25px;
   width:250px;
}


.ft_01 > h6,.ft_02 > h6{
   position: relative;
   padding:10px 0 5px 0;
   margin:0 0 5px 0;
   width:250px;
   font-size:16px;
color:#026d59;
font-weight:bold;
border-bottom:1px #ddd dotted;
    top: 0px;
    left: 0px;
}

.ft_02{
   position:absolute;
   left:650px;
   top:235px;
   width:250px;
}
.ft_sel{
   position: relative;
   padding:5px 0  ;
   width:250px;
   font-size:13px;
color:#026d59;
   vertical-align:middle;

}
.ft_size{
   position: relative;
   padding:5px 0;
   width:250px;
   font-size:13px;
color:#026d59;
   vertical-align:middle;
    top: 0px;
    left: 0px;
}
.ft_inp{
   position: relative;
   padding:5px 0  ;
   width:250px;
   font-size:13px;
color:#026d59;
   vertical-align:middle;

}

input.ft_pv{
    position:absolute;
    top: 450px;
    left: 720px;
    border:none;
    padding:5px 10px;
    background:#61ccff;
    color:#fff;
    font-family:"微軟正黑體";
    font-size:14px;
    font-weight:bold;
    cursor:pointer
}

input.font_s01{
        position: relative;
   padding:3px;
   font-size:13px;
   color:#666;
   text-align: left;
   vertical-align:middle;
   border:1px #ddd solid;
   box-shadow:2px 2px 6px -2px rgba(20%,20%,40%,0.8) inset; 

}

select.font_s02{
        position: relative;
   padding:3px;
   font-size:13px;
   color:#666;
   text-align: left;
   vertical-align:middle;
   border:1px #ddd solid;
   box-shadow:2px 2px 6px -2px rgba(20%,20%,40%,0.8) inset; 

}