@font-face {
    font-family: 'fontface1';
    src: url('../fonts/IDHeiUltra.woff2') format('woff2');
    font-weight: 100;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'fontface1';
    src: url('../fonts/NotoSansTC-Medium.woff2') format('woff2');
    font-weight: 200;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'fontface1';
    src: url('../fonts/NotoSansTC-Bold.woff2') format('woff2');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}


html, body {
font-family: Arial, "文泉驛正黑", "WenQuanYi Zen Hei", "儷黑 Pro", "LiHei Pro", "微軟正黑體", "Microsoft JhengHei", sans-serif;
width:100%;
}
#warp {
padding:0;
margin: 10px auto 10px;
width: 100%;
}
#main{
    margin:10px auto 10px;
	padding-top:50px;
	width:960px;
	clear:both;
}
.row_title{
font: normal 12px 新細明體;
background-color:#D7EBFF;
text-align:center;
padding:5px 5px;
color:#2E5B89;
height:45px;
}
td {
font: normal 13px 新細明體;
color: #333333; 
}
.row_hotelname{
line-height:150%;
padding:5px;
}
.row_hotelname a{
font: normal 12pt 新細明體;
color: #CE5300; 
line-height:150%;
}
.row_text{
text-align:center;
font: normal 13px 新細明體;
color: #222222; 
background-color:#FFFFFF;
padding:5px 5px;
height:45px;
}
.text2{
font: normal 12px 新細明體;
padding:5px;
text-align: left;
height:30px;
}
.freetext {
font: normal 10pt 新細明體;
line-height:180%;
color: #222222; 
padding:2px 2px ;
}
.freetext2 {
font: normal 10pt 新細明體;
line-height:150%;
color: #222222; 
padding:2px 2px ;
}
.freetextp {
font: normal 10pt 新細明體;
line-height:150%;
color: #222222; 
padding:2px 2px ;
text-decoration:none;
text-align:right;
}
.freetextc {
font: normal 10pt 新細明體;
line-height:150%;
color: #222222; 
padding:2px 2px ;
text-decoration:none;
text-align:center;
}

.freetext a:link{color:#FF3300;font-size:10pt;line-height:normal;text-decoration:none;}
.freetext a:visited{color:#FF3300;font-size:10pt;line-height:normal;text-decoration:none;}
.freetext a:hover{color:#0066CC;font-size:10pt;line-height:normal;text-decoration:underline;}
.freetext a:active{color:#FF3300;font-size:10pt;line-height:normal;text-decoration:none;}
.freetext2 a:link{color:#0066CC;font-size:10pt;line-height:normal;text-decoration:underline;}
.freetext2 a:visited{color:#0066CC;font-size:10pt;line-height:normal;text-decoration:underline;}
.freetext2 a:hover{color:#FF3300;font-size:10pt;line-height:normal;text-decoration:none;}
.freetext2 a:active{color:#0066CC;font-size:10pt;line-height:normal;text-decoration:underline;}
.order_title{
	/* padding:5px; */
    /* background: #fff;
    border: 1px solid #f3f3f3;
    margin: 10px 0; */
}
.order_titleh{
    font-family:"新細明體";
    /* color:#00458A; */
    color:#1393c0;
    font-size:16pt;
    font-weight:normal;
	text-decoration:none;
	font-weight:bold;
}
.order_titlet a:link, .order_titlet a:visited{
    font-family:"新細明體";
    /* color:#ff3300; */
    color:#ff6700;
    font-size:16pt;
    font-weight:normal;
	text-decoration:none;
	font-weight:bold;		
		}
.order_titlet a:hover, .order_titlet a:active{
    font-family:"新細明體";
    color:#0066CC;
    font-size:16pt;
    font-weight:normal;
	text-decoration:none;
	font-weight:bold;		
}
.order_titlet{
    font-family:"新細明體";
    /* color:#0066CC; */
    color:#666;
    font-size:16pt;
    font-weight:normal;
	line-height:normal;
	text-decoration:none;
}
@media screen and (max-width: 768px){
    .order_titleh{
        margin-left: 10px;
    }
}

/* ------------------------------------------------ 2026.02.26 整體排版 ------------------------------------------------ */
#mq{
    /* display: flex; */
    width:100%; 
    max-width:1260px; 
    margin: 0 auto
}
#menu{
    background: #fff;
}
#wrap{
    background: #fbfbfb;
}
/* ------------------------------------------------ 2026.03.24 重整左右主要區塊 ------------------------------------------------ */
.main-container{
    width:100%;
    margin-top:20px;
    /* padding:0px 5px; */
    display: flex;
    /* background-color: #f5f5f5; */
    align-items: flex-start;
}
.left-container{
    width: 70%; 
    /* margin-top:20px;  */
    padding:0px 5px;
    /* background-color: blue; */
}
.right-container{
    width: 30%;
    /* display: flex; */
    background-color: #f5f5f5;
    /* background-color: #dfdfdf; */
    /* box-shadow: 0 2px 6px rgba(0,0,0,0.1); */
    position: sticky;
    top: 20px;
    margin-top: 37px;
}
.cost-Details-title{
    font-size: 20px;
    font-weight: bold;
    color: #666;
    padding: 10px;
    background-color: #dfdfdf;
    width: 100%;
}
.empty_message{
    font-size: 24px;
    font-weight: bold;
    text-align: center;
    padding: 38px 0;
    color: #666;
}
.cost-Details-text1{
    display: flex;
    padding: 10px 15px;
    border-bottom: 1px solid #cdcbcb;
    font-size: 16px;
    color: #666;
}
.cost-Details-text2{
    display: flex;
    padding: 10px 15px;
    font-size: 16px;
    color: #666;
    border-bottom: 1px solid #cdcbcb;
}
.fees-text1{
    color: #006699; 
}
.feex-text2{
    color: #666;
}
.cost-Details-text1-left{
    flex: 1;
}
.cost-Details-text1-center{
    flex: 1;
    text-align: center;
}
.cost-Details-text1-right{
    flex: 2;
    text-align: right;
}
.cost-Details-text2-left{
    flex: 1;
    text-align: left;
    font-weight: bold;
}
.cost-Details-text2-right{
    flex: 1;
    text-align: right;
}
.total_price-text{
    font-size: 24px;
    color: #ff6700;
    font-weight: bold;
}
.plus,.minus{
    user-select: none;
    -webkit-user-select: none;
    -moz-user-select: none;
}
/* ===== 手機底部 bar ===== */

#mobile-bar{
    display:none;
}

/* ===== drawer ===== */

#mobile-drawer{
    display:none;
}
.mobile-drawer{
	position: relative;
	padding-bottom: 80px;
}
.drawer-confirm-btn{
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	height: 60px;

	background: #ff6700;
	color: #fff;

	display: flex;
	align-items: center;
	justify-content: center;

	font-size: 18px;
	font-weight: bold;

	z-index: 9999;

	cursor: pointer;
}
/* ===== 手機版 ===== */

@media screen and (max-width: 768px){
    .left-container{
        width:100%;
    }
    .main-container > .right-container{
        display:none;
    }
    .right-container{
        width: 100%;
        margin-top: 14px;
        margin-bottom: 50px;
    }

    /* ===== 底部 bar ===== */
    #mobile-bar{
        display:flex;
        position:fixed;
        bottom:0;
        left:0;
        width:100%;
        /* background-color: #5C93C9; */
        background-color: #004e9b;
        /* background:#fff; */
        justify-content:space-between;
        align-items:center;
        padding:10px 15px;
        z-index:1000;
        font-size: 16px;
    }
    .mobile-price{
        font-size:18px;
        font-weight:bold;
        /* color:#666; */
        color:#fff;
    }
    .total_price-mobile{
        font-size:24px;
        /* color:#d0021b; */
        color:#ff6700;
    }
    #mobile-bar button{
        background:#ff4d4f;
        color:#fff;
        border:none;
        padding:8px 12px;
        border-radius:5px;
        cursor:pointer;
    }

    .objectSwitch-container-mobile{
        display: flex;
        align-items: center;
        /* background-color: #5C93C9; */
        /* padding: 6px 10px; */
        color: #fff;
        gap: 6px;
    }
    #mobile-bar .objectSwitch-container-mobile .objectSwitch-buttons button{
        background-color: #fff;
        color: #666;
        border: 0;
        border-radius: 4px;
        padding: 8px 12px;
    }
    #mobile-bar .objectSwitch-container-mobile .objectSwitch-buttons button:hover{
        background-color: #ff6700;
        color: #fff;
    }
    #mobile-bar .objectSwitch-container-mobile .objectSwitch-buttons button.active{
        background-color: #ff6700;
        color: #fff;

    }


    /* ===== drawer ===== */
    #mobile-drawer{
        display:block;
        position:fixed;
        bottom:-100%;
        left:0;
        width:100%;
        /* height:48%; */
        height:100%;
        background:#fff;
        z-index:1001;
        transition:0.3s;
        box-shadow:0 -2px 10px rgba(0,0,0,0.2);
    }
    #mobile-drawer.active{
        bottom:0;
    }
    .drawer-content{
        height:100%;
        overflow-y:auto;
        /* padding:15px; */
        padding:0 15px 15px 15px;
    }
    .drawer-header{
        display:flex;
        justify-content:space-between;
        align-items:center;
        font-size:18px;
        font-weight:bold;
    }
    .drawer-header span{
        cursor:pointer;
        font-size:20px;
        margin-left: auto;
    }
    /* 避免被底部 bar 擋住 */
    body{
        padding-bottom:60px;
    }
    .icon_gp{
        margin-bottom: 70px !important;
    }
}
/* ------------------------------------------------ 2026.02.26 階段箭頭 ------------------------------------------------ */
.steps {
    display: flex;
    /* background: #fff; */
    padding: 20px 0;
    font-size: 28px;
    text-align: center;
    margin: 10px 0;
    font-family: 'fontface1';
    font-weight: 300;
    font-weight: bold;
}
.step {
    flex: 1;
    position: relative;
    padding: 12px 40px;
    background: #ddd;
    color: #999;
    font-weight: bold;
    z-index: 1;

    clip-path: polygon(
        0 0,
        calc(100% - 20px) 0,
        100% 50%,
        calc(100% - 20px) 100%,
        0 100%
    );
}
.step + .step {
    margin-left: -20px;
}
.step:last-child::after {
    display: none;
}
.step_active {
    color: #fff;
    background-color: #67b0d1;
    /* z-index: 3; */
}
.step.no_arrow{
    clip-path: none;
}
.step.no_arrow::after{
    display: none;
}
.step:nth-child(1) { z-index: 3; }
.step:nth-child(2) { z-index: 2; }
.step:nth-child(3) { z-index: 1; }


.order-progress-icon {
    width: 20px;
    height: 20px;
    display: inline-block;
    margin-right: 8px;

    background-color: black;

    -webkit-mask-size: contain;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-position: center;

    mask-size: contain;
    mask-repeat: no-repeat;
    mask-position: center;
}
.ic1 {
    -webkit-mask-image: url('../icon/tag24.png');
    mask-image: url('../icon/tag24.png');
}
.ic2 {
    -webkit-mask-image: url('../icon/clipboard24.png');
    mask-image: url('../icon/clipboard24.png');
}
.ic3 {
    -webkit-mask-image: url('../icon/check-mark24.png');
    mask-image: url('../icon/check-mark24.png');
}
.step .order-progress-icon {
    background-color: #999;
}
.step_active .order-progress-icon {
    background-color: #fff;
}
@media screen and (max-width: 768px) {
    .steps {
        font-size: 19px;
        padding: 0;
    }
    .step {
        padding: 6px 0;
    }
    .order-progress-icon {
        width: 15px;
        height: 15px;
        margin: 0;
    }
}


/* ---------------------------------------------- 2026.03.02 各標題微調+送出訂單按鈕 ---------------------------------------------- */
.order_titleh {
    position: relative;
    padding-left: 12px;
    display: inline-block;
    font-size: 20px;
    font-family: 'fontface1';
    font-weight: 400;
    font-weight: bold;
    color: #1393c0;
}
.order_titleh:before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    bottom : 0;
    width: 5px;
    background-color: #67b0d1;
}
.contract-container{
    display: flex;
    justify-content: center;
    text-align: center;
    max-width: 100%;
    margin-bottom: 5px;
    font-size: 18px;
    font-weight: bold;
}
.ContractsAndNoticesLink {
    color: #1393c0 !important;
    font-size: 18px;
    text-decoration: none;
}
.ContractsAndNoticesLink:hover{
    color: #0e6e91 !important;
    text-decoration: none;
}
input[type=checkbox]{
    width: 16px !important ;
}
.form-horizontal2{
    margin: 16px auto;
}
.line-Login-Button{
    text-align: center;
}
.submit-button{
    text-align: center;
}
@media screen and (max-width: 768px){
    .contract-container{
        flex-direction: column;
    }
}
/* ---------------------------------------------- 2026.03.03 契約彈窗 ---------------------------------------------- */
#modal_bg{
    position:fixed;
    left:0;
    top:0;
    width:100%;
    height:100%;
    background:rgba(0,0,0,0.6);
    z-index:9999;
}
#modal_box{
    background:#fff;
    width:90%;
    max-width:800px;
    max-height:80%;
    overflow:auto;
    margin:5% auto;
    padding:20px;
}
/* ---------------------------------------------- 2026.03.04 床位、人數----------------------------------------------  */
.bed-container{
    width: 100%;
    max-width: 1260px;
    margin: 20px auto;
    /* padding: 20px 0; */
}
.bed-title{
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 15px;
}
.靠左邊{
    font-size: 20px;
    font-weight: bold;
    color: #1393c0;
}
.bed-content{
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    /* background:#dfdfdf; */
    background:#f5f5f5;
    padding:20px;
    border-radius:8px;
}
.bed-item1{
    display: flex;
    flex: 5;
    justify-content: center;
    align-items: center;
}
.bed-item1 div{
    padding: 6px;
}
.bed-content2{
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    gap: 10px;
    background: #f5f5f5;
    padding: 4px;
    border-radius: 8px;
}
.bed-subtitle{
    width:100%;
    font-weight:bold;
    color:#ff6700;
    font-size: 16px;
    /* color:#e60023; */
    /* margin-bottom:10px; */
}
.bed-item{
    flex:1;
    /* min-width:160px; */
}
.選擇人數內容{
    /* width: 50%; */

    background:#fff;
    border-radius:8px;
    padding:22px 12px;
    box-shadow:0 2px 6px rgba(0,0,0,0.1);

    display:flex;
    flex-direction:column;
    gap:10px;
}
.上半部{
    /* display:flex; */
    /* justify-content:space-between; */
    font-size:14px;
    font-weight: bold;
}
.room-type-text{
    text-align: center;
}
.room-type-price{
    text-align: center;
}
.room-type-price span{
    color: #1393c0;
}
.下半部{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:10px;
}
.下半部 span{
    width:28px;
    height:28px;
    border:1px solid #1393c0;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    cursor:pointer;
    color:#1393c0;
}
.下半部 input{
    width:40px;
    text-align:center;
}


.minus, .plus {
    position: relative;
    display: inline-block;
    width: 26px;
    height: 26px;
    border: 1px solid #ccc;
    cursor: pointer;
}

.minus::before, .plus::before {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    width: 12px;
    height: 2px;
    background: #1393c0;
    transform: translate(-50%, -50%);
}

/* plus 的直線 */
.plus::after {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    width: 2px;
    height: 12px;
    background: #1393c0;
    transform: translate(-50%, -50%);
}

/* 移除 Chrome Safari Edge 箭頭 */
input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

/* 移除 Firefox 箭頭 */
input[type="number"] {
    -moz-appearance: textfield;
}

/* 視覺樣式 */
input[type="number"] {
    border: none;
    outline: none;
    background: transparent;
    text-align: center;
    width: 40px;
}
/* 關閉鼠標hover顯示可輸入的圖標 */
input[readonly] {
    pointer-events: none;
}

.remark{
    padding: 6px;
    width: 100%;
    color: #666;
    /* background: #fff; */
}
.remark2{
    padding: 2px;
    color: #666;
    /* background-color: #666; */
}

/* ----------------------------------------------2026.03.09---------------------------------------------- */
.goplane-container{
    width: 100%;
    background: #fff;
    border-radius: 16px;
    padding: 12px;
    margin-bottom: 16px;
    border: 1px solid #ededed;
}
.goplane-airport{
    display: flex;
    align-items: center;
    width: 100%;
}
.airport-item1, .airport-item1-1{
    min-width:90px;
    text-align: center;
    font-size: 16px;
    padding: 6px 16px;
    margin-right: 16px;
    border-radius: 16px;
}
.airport-item1{
    background-color: #67b0d1;
    color: #fff;
}
.airport-item1-1{
    background-color: #fff;
    color: #67b0d1;
    border: 1px solid #c4d4db;
}
.airport-item2{
    color: #666;
    font-size: 20px;
    font-weight: bold;
}



.goplane-dateAndTime{
    display: flex;
    align-items:center;
    margin-top:10px;
}
.flight-airline{
    width:35%;
    text-align: center;
    color: #888;
    font-size: 16px;
    /* font-weight: bold */
}
.flight-depart, .flight-arrive{
    text-align:center;
}
.flight-depart, .flight-arrive{
    width: 20%;
}
.flight-duration{
    flex:1;
    color: #888;
    text-align:center;
    position:relative;
}

.flight-date{
    color:#888;
    font-size:16px;
}
.flight-time{
    font-size:22px;
    font-weight:bold;
    color: #444;
}



.arrow2{
    height:2px;
    background:#ddd;
    margin-top:6px;
    position:relative;
}
.arrow2:after{
    content:"";
    position:absolute;
    right:0;
    top:-3px;
    border-left:6px solid #ccc;
    border-top:4px solid transparent;
    border-bottom:4px solid transparent;
}
@media screen and (max-width: 768px){
    .選擇人數內容{
        padding: 8px 4px;
    }
    .上半部{
        font-size: 16px;
    }
    .bed-content{
        padding: 8px;
    }
    .goplane-container{
        padding: 8px 4px;
    }
    .airport-item1, .airport-item1-1{
        min-width: 85px;
        margin-right: 6px;
    }
    .airport-item2{
        font-size: 19px;
    }
    .flight-airline{
        font-size: 12px;
    }
    .flight-date{
        font-size: 16px;
    }
    .flight-time{
        font-size: 20px;
    }
}

/* 2026.04.21 */
.Tcash-remark{
    color: #666;

}
.member-point-container{
    background-color: #fff;
}
.member-point-container2{
    display: flex;
    /* background-color: #fff; */
    /* justify-content: center; */
    align-items: center;
}
.member-point-container2 input{
    width: 10%;
}
.member-point1{
    display: flex;
    font-weight: bold; 
    justify-content: center;
    padding: 10px;
    color: #666;
}
.member-point1 span{
    padding-right: 4px;
}


.discountCode-content{
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    /* background:#dfdfdf; */
    background:#f5f5f5;
    padding:20px 0px;
    border-radius:8px;
}
@media screen and (max-width: 768px){
    .discountCode-content{
        flex-direction : column;
    }
    .promo_code{
        width: 30%;
    }
}



.booking-list{
    display: flex;
    flex-wrap: wrap;

    justify-content: space-between;



    gap: 12px;
    background: #f5f5f5;
    padding: 20px;
    border-radius: 8px;
}
.booking-list table{
    margin: 0;
}


.odetail-container{
    width: calc(50% - 8px);
    box-sizing: border-box;
    /* display: flex; */
    /* width: 100%; */
    /* flex-direction: column; */
    color: #666;
    font-size: 16px;
    border: 1px solid #d0d0d0;
    border-radius: 6px;
    padding: 8px;
}
.odetail-item1{
    display: flex;
    margin-bottom: 6px;
    /* flex-direction: column; */
}
.odetail-item1-title{
    padding-right: 4px;
    background-color: #1393c0;
    color: #fff;
    padding: 2px 6px;
    /* border-radius: 10px; */
}
.odetail-item1-text{
    color: #ff6700;
    display: flex;
    align-items: center;
    gap: 4px;
}
.odetail-item1-text span{ 
    background-color: #ff6700;
    color: #fff;
    padding: 2px 6px;
}
.odetail-item1-text input{
    border:1px solid #d0d0d0;
}
.odetail-item2{

}
.odetail-item2-title{
    padding: 4px;
}
@media screen and (max-width: 768px){
    .booking-list .odetail-container{
        width: 100%;
        flex-basis: 100%;
    }
}







/* 2026.04.28-付款人資料、付款方式等填寫區塊... */
.booking-info-row-container{
    display: flex;
}
.booking-info-row{
    width: 100%;
    font-size: 20px;
}
.booking-info-field{
    display: flex;
    padding: 6px;
    align-items: center;
}
.paytype-block, .paymethod-block, .cardmethod-block{
    width: 100%;
    background-color: #fff;
    padding: 4px;
}
.paymethod-content{
    margin: 6px 0;
}
.paymethod-content2 div{
    margin: 6px 0;
    font-size: 12pt;
}
.paytype-title, .paymethod-title, .cardmethod-title{
    color: #ff6700;
    font-size: 16px;
    font-weight: bold;
}
.paytype-option, .paymethod-option, .cardmethod-option{
    padding: 6px;
}
.booking-info-field input{
    border: 1px solid #ddd;
    color: #666;
}
.booking-info-title{
    width: 15%;
    color: #666;
    font-weight: bold;
}
.paymethod-link{
    color: #666 !important;
}
.cardmethod-row span{
    padding: 6px;
}
@media screen and (max-width: 768px){
    .booking-info-title{
        width: 30%;
    }
    .booking-info-row{
        font-size: 16px;
    }
}



/* order13右側總計 */
.order13-details-container{
    border-bottom: 1px solid #cdcbcb;
    padding: 8px 16px;
}
@media screen and (max-width: 768px){
    .order13-details-container{
        padding: 8px 10px;
    }
}
.member-discount-container{
    display: flex;
    padding: 6px;
    align-items: center;
    /* justify-content: space-between; */
}
.member-discount-title{
    display: flex;
    align-items: center;
    width: 40%;
}
.member-discount-title span{
    padding-right: 6px;
}
.member-discount-title2{
    display: flex;
    align-items: center;
    width: 60%;
}
.member-discount-title2 span{
    padding-right: 6px;
}
.member-discount-value{
    background-color: #fff;
    border: 1px solid #dfdfdf;
    padding: 4px 8px;
    color: #666
}
.member-discount-value input{
    border: none;
}



.tourFee-container{
    display: flex;
    padding: 6px;
    align-items: center;
    /* justify-content: space-between; */
}
.tourFee-container input{
    width: 100%;
    max-width: 40px;

    background-color: #fff;
    border: 1px solid #dfdfdf;
    padding: 4px 8px;
    color: #666
}
.tourFee-item1 input, .tourFee-item2 input, .tourFee-item3 input{
    background-color: #fff;
    border: 1px solid #dfdfdf;
    padding: 4px 8px;
    color: #666;
}
.tourFee-item1{
    width: 25%;
}
.tourFee-item1 input{
    max-width: 40px;
}
.tourFee-item2{
    width: 35%;
}
.tourFee-item2 input{
    max-width: 70px;
}
.tourFee-item3{
    width: 35%;
}
.tourFee-item3 input{
    max-width: 70px;
}





.objectSwitch-container{
    display: flex;
    align-items: center;
    font-size: 20px;
    background-color: #5C93C9;
    padding: 6px 10px;
    color: #fff;
    gap: 6px;
}
.objectSwitch-buttons button{
    color: #666;
    border: 0;
    border-radius: 4px;
    padding: 4px 8px;
}
.objectSwitch-buttons button:hover{
    background-color: #ff6700;
    color: #fff;
}
.objectSwitch-buttons button.active{
    background-color: #ff6700;
    color: #fff;

}





.order-submit{
    text-align: center;
}
.order-submit button{
    padding: 8px 16px;
    font-size: 24px;
    background-color: #ff6700;
    color: #fff;
    border: none;
    border-radius: 8px;
    margin: 24px auto 36px auto;
}
.order-submit button:hover{
	background-color: #ff8633;
    color: #fff;
}


.submit-button input{
    padding: 8px 16px;
    font-size: 24px;
    background-color: #ff6700;
    color: #fff;
    border: none;
    border-radius: 8px;
    margin: 24px auto 36px auto;
}
.submit-button input:hover{
	background-color: #ff8633;
    color: #fff;
}


/* 服務專員區 */
.service-specialist{
    background: #f5f5f5;
    border-radius: 8px;
}
.service-specialist-container{
    display: flex;
    padding: 8px;
}
.service-specialist-item1{
    display: flex;
    padding: 10px 8px;
    align-items: center;
}
.service-specialist-item1 div{
    padding-right: 6px;
}
.service-specialist-item2{
    display: flex;
    padding: 10px 8px;
    flex-direction: column;
}
.service-specialist-remark{
    color: #ff6700;
    font-size: 16px;
    font-weight: bold;
    margin-bottom: 6px;
}
@media screen and (max-width: 768px){
    .service-specialist-container{
        padding: 0;
    }
}


/* .service-specialist-item2{
    display: flex;
    padding: 10px 8px;
    flex-direction: column;
}
.service-specialist-item2-2{
    display: flex;
    gap: 22px;
} */


