@charset "utf-8";
.extra-block,
.extra-table-cart,
.extra-block-title,
.extra-block-subtitle,
.cart-events,
.field-rows,
.extra-border-box {
	float: left;
	width: 100%;
	font-size: 17px;
	font-family: "Microsoft JhengHei UI", "Microsoft JhengHei", "微軟正黑體";
	line-height: 30px;
	color: #1E1E1E;
}
.mb1{
	margin-bottom: 40px;
}
.mb2{
	margin-bottom: 20px;
}
.extra-block.c2 {
	width: 50%;
	padding-right: 15px;
	padding-left: 15px;
}
.extra-block.shrink{
	padding-right: 15px;
	padding-left: 15px;
}
.extra-block.center {
	float: none;
	width: 570px;
	max-width:100%;
	margin-right: auto;
	margin-left: auto;
}




.extra-block .cart-step {
	display: table;
	margin-top: 0;
	margin-right: auto;
	margin-bottom: 0;
	margin-left: auto;
	padding-top: 35px;
	padding-bottom: 45px;
}
.extra-block .cart-step .items {
	display: table-cell;
	text-align: center;
	vertical-align: middle;
}
.extra-block .cart-step .items.space {
	width: 46px;
}
.extra-block .cart-step .items img{
	display: block;
	margin: 0 auto;
}
.extra-table-cart {
	border-collapse: collapse;
	border-spacing: 0px;
}
.extra-table-cart tr td{
	padding-top: 6px;
	padding-right: 15px;
	padding-bottom: 6px;
	padding-left: 15px;
	text-align: center;
}

.extra-table-cart .extra-table-field-name td,
.extra-block-title {
	background-image: url(../../images/extra/block-title-bg.png);
	background-repeat: repeat-x;
	background-size: auto 100%;
	line-height: 38px;
	position: relative;
	height: 40px;
	padding: 0px;
}
.extra-table-cart .extra-table-field-name td{
	font-size: 16px;
	color: #505050;
	padding-right: 15px;
	padding-left: 15px;
	font-weight: bold;
}
.extra-table-field-name td:not(:last-child):after{
	content: '';
	position: absolute;
	right: 0px;
	top: 0px;
	bottom: 0px;
	background-color: #D2D2D2;
	height: 14px;
	width: 1px;
	margin: auto;
}
.extra-table-cart .w1,
.extra-table-cart .w2 {
	white-space: nowrap;
}
.extra-table-cart-rows td {
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #c8c8c8;
}
.extra-table-cart-rows .image {
	width: 144px;
	text-align: center;
	vertical-align: middle;
}
.extra-table-cart-rows .image img{
	border: 1px solid #d7d7d7;
}
.extra-table-cart-rows .title {
	text-align: left;
}
.extra-table-cart-rows .title i {
	display: block;
	font-style: normal;	
	line-height: 19px;
}
.extra-table-cart-rows .title .name {
	text-decoration: none;
}
.extra-table-cart-rows .title .number {
	font-size: 16px;
	color: #878787;
	margin-bottom: 5px;
}
.extra-table-cart-rows .delete {
	font-size: 20px;
	color: #878787;
	text-decoration: none;
}
.extra-table-cart.order .extra-table-cart-rows td {
	width: 16.66%;
}
.extra-table-cart.order .extra-table-cart-rows td .link {
	color: #5D5D5D;
	text-decoration: none;
}
.extra-table-cart.order .extra-table-cart-rows td .link:before {
	font-family: FontAwesome;
	content: ' \f00e';
}
.extra-table-cart.order .extra-table-cart-rows:hover td,
.extra-table-cart.order .extra-table-cart-rows:hover td .link,
.extra-table-cart.order.show .extra-table-cart-rows td{
	color: #1E1E1E;	/*background-color: #FDFDFD;*/
}


.extra-table-cart.end {
	padding-right: 15px;
	padding-left: 15px;
	text-align: right;
	padding-top: 10px;
	padding-bottom: 35px;
	color: #000;
}
.extra-table-cart .items{
	color: #000;	
}
.extra-table-cart.end .items {
	clear: right;
	float: right;
	width: 465px;
	max-width:100%;
	line-height: 28px;
}
.extra-table-cart.end .items .mark {
	float: left;
}
.extra-table-cart.end .items .paytotal{
	font-size: 18px;
	color: #0067b6;
	font-weight: bold;
}



.qty-box {
	border: 1px solid #B3B3B3;
	line-height: 30px;
	display: inline-block;
	border-radius: 3px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	overflow: hidden;
	white-space: nowrap;
}
.qty-box > *{
	display: inline-block;
	*display:inline;/*for IE 7 */
    *zoom:1;/*for IE 7 */
    vertical-align:top;
	margin: 0px;
	padding: 0px;
}
.qty-box .button {
	width: 32px;
	color: #323232;
	text-decoration: none;
	text-align: center;
	background-color: #FFF;
}
.qty-box input {
	max-width: 56px;
	text-align: center;
	height: 30px;
	line-height: 30px;
	border-right-width: 1px;
	border-left-width: 1px;
	border-top-style: none;
	border-right-style: solid;
	border-bottom-style: none;
	border-left-style: solid;
	border-right-color: #B3B3B3;
	border-left-color: #B3B3B3;
}

.extra-block-title {
	padding-left: 20px;
	font-size: 17px;
	color: #3c3c3c;
	font-weight: bold;
}
.extra-block-title .icon {
	margin-right: 13px;
}
.extra-block-subtitle {
	font-size: 18px;
	color: #0067b6;
	margin-bottom: 20px;
	font-family: "Microsoft JhengHei UI", "Microsoft JhengHei", "微軟正黑體";
	font-weight: bold;
}
.extra-block-subtitle .icon{margin-right: 10px;}
.extra-block-subtitle .fa{
	font-size: 18px;
	color: #769F09;
	margin-right: 15px;
}
.extra-block-subtitle #same {
	color: #323232;
	float: right;
	font-size: 16px;
}
.extra-block-subtitle #same input{
	margin-right: 10px;
}
.extra-block-subtitle.type2 {
	font-size: 16px;
	color: #787878;
	margin-bottom: 12px;
}


.extra-field{
	height: 35px;
	width: 100%;
	border: 1px solid #D2D2D2;
	padding-top: 0px;
	padding-right: 15px;
	padding-bottom: 0px;
	padding-left: 15px;
	line-height: 33px;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-box-shadow: inset 0px 0px 5px 0px rgba(0, 0, 0, 0.1);
	-moz-box-shadow: inset 0px 0px 5px 0px rgba(0, 0, 0, 0.1);
	box-shadow: inset 0px 0px 5px 0px rgba(0, 0, 0, 0.1);
	margin: 0px;
	float: left;
}
.extra-field.date {
	width: 60px;
	padding-right: 0px;
	padding-left: 0px;
	text-align: center;
}
.extra-field.date.year{width: 80px;}
.cart-events {
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #D2D2D2;
	display: flex;
	justify-content: space-between;
	align-items: center;
	line-height: 35px;
	padding-top: 12px;
	padding-bottom: 12px;
	padding-right: 20px;
	padding-left: 20px;
}
.cart-events .l {
	float: left;
}
.cart-events .l.sn input {
	width: 200px;
	margin-right: 15px;
	float: none;
}
.cart-events .l.sn.f:after{
	font-family: FontAwesome;
	content: '\f057';
	color: #ED1C24;
	font-size: 24px;
}
.cart-events .l.sn.t:after{
	font-family: FontAwesome;
	content: '\f058';
	color: #66CC33;
	font-size: 24px;
}
.cart-events .r {
	float: right;
}
.cart-events.payment .type-name {
	float: left;
	width: 160px;
	margin-right: 20px;
	color: #505050;
}
.cart-events.payment .type-name:after {
	content: '|';
	font-size: 15px;
	color: #D2D2D2;
	float: right;
}
.cart-events.payment .type-note {
	font-size: 16px;
	color: #878787;
	float: left;
}
.guide-button {
	text-align: center;
	padding-bottom: 20px;
}
.guide-button.mt1{
	margin-top: 25px;
}
.guide-button .common {
	margin: 0 5px;
	width: 170px;
}


.font-color-1 {
	color: #0067b6;
}
.font-color-1.large {
	font-size: 18px;
	font-weight: bold;
}
.field-rows {
	margin-bottom: 15px;
	line-height: 35px;
}
.field-rows .name {
	float: left;
	width: 110px;
}
.field-rows.necessary .name:after {
	content: ' *';
	color: #0067b6;
}

.field-rows .box,
.field-rows .box .limit {
	overflow: hidden;
}
.field-rows .box .limit {
	flex:1;
}
.field-rows .box .field {
	float: left;
	width: 100%;
}
.field-rows .box .addnum {
	width: 80px;
}
.field-rows .box .adds {
	font-weight: bold;
	text-align: center;
	float: left;
	width: 20px;
}
.field-rows .box .note {
	float: left;
	width: 100%;
	line-height: 19px;
	margin-top: 8px;
	margin-bottom: 8px;
}
.field-rows .box #message {
	height: 100px;
	overflow: hidden;
}
.field-rows .box .date-mark {
	text-align: center;
	float: left;
	width: 30px;
}
.field-rows .box label{
	float: left;
	margin-right: 10px;
}
.extra-border-box {
	padding: 15px;
	border: 1px solid #D2D2D2;
	margin-bottom: 25px;
}

.step3-top {
	font-size: 18px;
	display: table;
	margin-right: auto;
	margin-left: auto;
	line-height: 30px;
	background-color: #5a96d2;
	text-align: center;
	font-weight: bold;
	color: #FFF;
	padding: 2px 25px;
	border-radius: 15px;
}

/*member*/
.member-menu {
	float: left;
	width: 220px;
	margin-right: 20px;
	margin-bottom: 20px;
}
.member-box,
.member-menu .top,
.member-menu ul,
.member-menu ul li,
.member-menu ul li a{
	float: left;
	width: 100%;
}
.member-menu .top {
	font-size: 16px;
	line-height: 45px;
	font-weight: bold;
	color: #FFFFFF;
	text-align: center;
	position: relative;
	padding-right: 13px;
	padding-left: 40px;
	justify-content: space-between;
	background-image: url(/images/extra/mem-nav-top.png);
	background-repeat: repeat-x;
	background-position: left center;
	background-size: auto 100%;
}
.member-menu ul {
	background-color: #E5E5E5;
}
.member-menu ul li a {
	line-height: 48px;
	color: #1E1E1E;
	text-decoration: none;
	padding-left: 40px;
	background-image: url(../../images/extra/icon-m-2.png);
	background-repeat: no-repeat;
	background-position: 22px center;
	background-size:auto 8px;
}
.member-menu ul li:not(:last-child) a{
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #FFFFFF;
}
.member-menu ul li a:hover,
.member-menu ul li a.selected{
	background-color: #D6D6D6;
}
.member-inner {
	overflow: hidden;
}
.member-inner .center-box {
	width: 595px;
	margin-right: auto;
	margin-left: auto;
}

.w1100px{}
@media screen and (max-width: 1100px) {
/*member*/
.member-menu,
.member-inner{
	float: left;
	width: 100%;
}
.member-menu ul{
	display: none;
}
.member-menu.active ul {
	display: block;
}
.member-menu{
	margin-right: 0px;
}
}

.w820px{}
@media screen and (max-width: 820px) {
.extra-block .cart-step .items:not(.active),
.extra-table-field-name,
.cart-events .r,
.field-rows.filling{
	display: none;
}
.cart-events.show-paytype .r{
	display: block;
}
.extra-block.c2,
.extra-table-cart tr,
.extra-table-cart td,
.extra-table-cart .w1,
.extra-table-cart .w2,
.extra-table-cart.order .extra-table-cart-rows,
.extra-table-cart.order .extra-table-cart-rows td,
.extra-table-cart-rows .image,
.extra-table-cart-rows .title,
.extra-table-cart.end .items,
.guide-button .common,
.field-rows .name,
.field-rows .box {
	float: left;
	width: 100%;
}
.extra-block.c2,
.extra-block.shrink{
	padding: 0;
}
.extra-table-cart .w1,
.extra-table-cart .w2{
	height: 50px;
	display: flex;
	justify-content: space-between;
	align-items: center;	
}

.extra-table-cart-rows:not(:last-of-type){
	margin-bottom: 5px;
}
.extra-table-cart-rows:not(:first-of-type){
	border-top-width: 1px;
	border-top-style: solid;
	border-top-color: #e8a100;
}
.extra-table-cart-rows .tagr{
	text-align: right;
}
.extra-table-cart-rows .tagr:before,
.extra-table-cart.order .extra-table-cart-rows td:after {
	content: attr(data-tag);
	float: left;
}
.extra-table-cart.order .extra-table-cart-rows td{
	text-align: left;
}
.extra-table-cart.order .extra-table-cart-rows td:after {
	width: 105px;
}
.extra-table-cart-rows .title{
	padding-top: 15px;
	padding-bottom: 15px;
}
.field-rows{
	margin-bottom: 10px;
}
.cart-events {
	padding:12px 15px;
}
.cart-events.payment .type-name,
.cart-events.payment .type-note{
	clear: left;
}
.cart-events.payment .type-name:after {
	content: none;
}
.cart-events.payment .type-note {
	line-height: 20px;
}
.guide-button .common{
	margin: 5px 0px;
}
}

.w480px{}
@media screen and (max-width: 480px) {
.extra-table-cart.end .items{
	text-align: left;
	margin-bottom: 10px;
}
.extra-table-cart.end .items .mark{
	width: 100%;
}
}