:root{
   --linar: linear-gradient(to bottom,#C9B386,#BF9347);
}
/*index*/
.index_info{
   padding: 80px 0;
}
.index_info h6{
   font-size: var(--f35);
   font-weight: 500;
}
.info_link{
   display: flex;
   align-items: center;
   padding: 15px 0;
   border-bottom: 1px solid #CCCCCC;
}
.info_link a{
   max-width: fit-content;
   width: 100%;
   display: flex;
   align-items: center;
}
.info_link a+a{
   padding-left: 20px;
}
.info_link a i{
   margin-right: 5px;
}
.info_link span{
   letter-spacing: 0.5px;
   transition: .5s ease;
}
.info_link a:hover span{
   color: #BF9347;
}
.index_info ul{
   max-width: 870px;
   display: grid;
   grid-template-columns: repeat(2,1fr);
   gap: 20px;
   padding-top: 20px;
}
.index_info li{
   display: flex;
   align-items: center;
   justify-content: space-between;
}
.index_info li span{
   display: block;
   max-width: 90px;
   width: 100%;
   background: #444444;
   color: #FFFFFF;
   text-align: center;
   padding: 2px 0;
}
.index_info p{
   width: calc(100% - 100px);
   color: #525252;
}
.index_notice h6{
   display: flex;
   align-items: center;
   justify-content: space-between;
   font-size: var(--f28);
   font-weight: 500;
}
.index_notice h6::before{
   content: '';
   display: block;
   width: 10px;
   height: 10px;
   background: #202020;
}
.index_notice h6::after{
   content: '';
   display: block;
   width: calc(100% - 150px);
   height: 1px;
   background: #CCCCCC;
}
.index_choose dl{
   display: flex;
   align-items: center;
   justify-content: space-between;
}
.index_choose dd,.index_choose dt{
   width: 49%;
}
.index_choose h6{
   font-size: var(--f18);
   font-weight: 500;
   padding-bottom: 10px;
}
.index_time_date{
   /* border-bottom: 1px solid #CCCCCC; */
}
.index_time_date ul{
   display: flex;
   align-items: center;
   justify-content: space-between;
}
.index_time_date li{
   width: 49%;
   position: relative;
}
.index_time_date select{
   width: 100%;
   padding: 10px;
   background: #FFFFFF;
   border: 1px solid #CCCCCC;
   border-radius: 5px;
   font-family: "Noto Sans TC", serif;
   font-size: var(--f16);
   letter-spacing: 1px;
}
.index_time_date select:hover,.index_time_date option:hover{
   cursor: pointer;
}
.index_time_date option:hover{
   background: #202020;
}
/*select修改樣式 start*/
/*移除原本下拉右側箭頭*/
select.index_select {
   appearance:none;
   -moz-appearance:none;
   -webkit-appearance:none;
}
/*IE隱藏箭頭樣式*/
.index_select::-ms-expand { 
   display: none; 
}
.index_time_date li i{
   position: absolute;
   width: fit-content;
   top: 50%;
   right: 10px;
   transform: translateY(-50%);
   font-size: var(--f14);
   color: #CCCCCC;
}

/*focus*/
.index_time_date input:focus,.index_select:focus{
   border-color: #444444;
   outline: 0;
}

.index_time_date p{
   font-size: var(--f14);
   padding: 20px 0;
}
.index_time_date u{
   text-decoration: none;
}
.index_time_date a{
   color: var(--maincolor);
}
.index_time_date a:hover{
   color: var(--subcolor);
}
.index_date_input{
   display: flex;
   align-items: center;
   justify-content: space-between;
}
.index_date_input input[type=text]{
   width: calc(100% - 60px);
}
.index_date_input input[type=submit]{
   padding: 5px 10px;
   border: 1px solid #CCCCCC;
   border-radius: 5px;
   outline: none;
   cursor: pointer;
   font-family: "Noto Sans TC", serif;
   font-size: var(--f16);
   letter-spacing: 1px;
   background: #FFFFFF;
   transition: .5s ease;
}
.index_date_input input[type=submit]:hover{
   background: var(--maincolor);
   color: #FFFFFF;
}

.index_time_period{
   border-top: 1px solid #CCCCCC;
   padding: 50px 0;
}
.index_time_period h6{
   font-size: var(--f18);
   font-weight: 500;
}
.index_time_period s{
   font-size: var(--f12);
   font-weight: 400;
   color: #CCCCCC;
   text-decoration: none;
   padding-left: 10px;
}
.index_time_period h4{
   font-size: var(--f14);
   padding-bottom: 15px;
}
.index_time_period del{
   text-decoration: none;
}

.index_time_period h5{
   font-size: var(--f14);
   font-weight: 400;
   color: #212121;
}
.period_text{
   font-size: var(--f14);
   line-height: 150%;
}

.index_time_period h5,.index_menu h6{
   display: flex;
   align-items: center;
   justify-content: space-between;
   padding-bottom: 20px;
   font-size: var(--f18);
   font-weight: 500;
}
.index_time_period h5::after,.index_menu h6::after{
   content: '';
   display: block;
   width: calc(100% - 50px);
   height: 1px;
   background: #CCCCCC;
}
.index_morning,.index_afternoon,.index_evening,.index_night{
   padding-top: 50px;
}

.index_time_period article{
   display: grid;
   /* grid-template-columns: repeat(auto-fit, minmax(110px, 110px)); */
   grid-template-columns: repeat(9,1fr);
   gap: 20px;
}

.index_time_period button{
   display: flex;
   justify-content: center;
   align-items: center;
   align-content: center;
   flex-flow: wrap;
   border: 1px solid #ccc;
   background: #FFFFFF;
   border-radius: 5px;
   min-height: 50px;
   cursor: pointer;
   font-size: var(--f16);
   color: #666666;
}

button.disabled {
   color: #ddd;
   cursor: not-allowed;
}

.index_time_period span {
   display: none;
   width: 100%;
   font-size: 12px;
   color: #ddd;
   text-align: center;
}
button.disabled span{
   display: block;
}
button.selected {
   background-color: var(--subcolor);
   border-color: var(--subcolor);
   color: white;
}

.index_menu section{
   position: relative;
}
.swiper-horizontal{
   overflow: hidden;
}
.index_menu .swiper {
   width: 100%;
   height: 100%;
}

.index_menu .swiper-slide {
   text-align: center;
   font-size: 18px;
   background: #fff;
   display: flex;
   justify-content: center;
   align-items: center;
}

.index_menu .swiper-slide img {
   /* display: block;
   width: 100%;
   height: 100%;
   object-fit: cover; */
}

.index_menu .swiper-button-next,.index_menu .swiper-button-prev{
   display: flex;
   align-items: center;
   justify-content: center;
   width: 45px;
   height: 45px;
   background: #CCCCCC;
   border-radius: 50%;
   transition: .5s ease;
}
.index_menu .swiper-button-next,.index_menu .swiper-rtl .swiper-button-prev{
   right: -22.5px;
}
.index_menu .swiper-button-prev,.index_menu .swiper-rtl .swiper-button-next{
   left: -22.5px;
}
.index_menu .swiper-button-next:after,.index_menu .swiper-button-prev:after{
   font-size: 20px;
   font-weight: bold;
   color: #FFFFFF;
}
.index_menu .swiper-button-next:hover,.index_menu .swiper-button-prev:hover{
   background: var(--maincolor);
}

.no-scroll {
   overflow: hidden;
}
.index_nextpage{
   padding: 80px 0;
}
.index_nextpage input[type=submit]{
   display: block;
   max-width: 135px;
   width: 100%;
   margin: 0 auto;
   padding: 10px 0;
   background: #202020;
   font-family: "Noto Sans TC", serif;
   font-size: var(--f16);
   color: #FFFFFF;
   letter-spacing: 1px;
   outline: none;
   border: none;
   transition: .5s ease;
}
.index_nextpage input[type=submit]:hover{
   cursor: pointer;
   background: var(--maincolor);
}
@media screen and (max-width:1200px) {
.index_menu .swiper-button-next,.index_menu .swiper-rtl .swiper-button-prev{
   right: -15px;
}
.index_menu .swiper-button-prev,.index_menu .swiper-rtl .swiper-button-next{
   left: -15px;
}
}
@media screen and (max-width:1024px) {
.index_notice h6::after{width: calc(100% - 130px);}
}
@media screen and (max-width:920px) {
.index_info ul{grid-template-columns: 1fr;}
.index_time_period article{gap: 10px;grid-template-columns: repeat(6,1fr);}
}
@media screen and (max-width:768px) {
.index_info{padding: 70px 0;}
}
@media screen and (max-width:650px) {
.index_time_period article{grid-template-columns: repeat(5,1fr);}
}
@media screen and (max-width:600px) {
.index_info{padding: 50px 0;}
.index_info ul{gap: 10px;}
.index_choose dl{flex-flow: wrap;justify-content: center;}
.index_choose dd,.index_choose dt{width: 100%;}
.index_choose dt{padding-top: 10px;}
.index_time_period{padding: 30px 0;}
.index_morning,.index_afternoon,.index_evening, .index_night{padding-top: 30px;}
.index_nextpage{padding: 50px 0;}
}
@media screen and (max-width:500px) {
.index_time_period article{grid-template-columns: repeat(4,1fr);}
.index_menu .swiper-button-next,.index_menu .swiper-button-prev{width: 35px;height: 35px;}
.index_menu .swiper-button-next:after,.index_menu .swiper-button-prev:after{font-size: 10px;}
}
@media screen and (max-width:450px) {
.info_link{display: grid;grid-template-columns: repeat(2,1fr);gap: 10px;}
.info_link a+a{padding: 0;}
.index_info li{flex-flow: wrap;}
.index_info li span{max-width: 110px;}
.index_info p{width: 100%;padding: 10px 0 0;}
.index_time_period article{grid-template-columns: repeat(3,1fr);}
}
@media screen and (max-width:425px) {
.index_time_period s{display: block;padding: 5px 0 0;}
}




/*Information*/
body.information_page,body.information_page .content_part{
   overflow: initial;
}
.information{
   padding: 100px 0;
   overflow: initial;
}
.information section{
   display: flex;
   align-items: flex-start;
   justify-content: space-between;
   overflow: initial;
   position: relative;
}
.info_confirm{
   max-width: 400px;
   border: 1px solid #AAAAAA;
   position: sticky;
   top: 20px;
   left: 0;
}
.info_confirm div{
   padding: 20px 30px;
}
.info_confirm h6{
   font-size: var(--f20);
   font-weight: 400;
   color: #525252;
}
.info_confirm p{
   display: flex;
   align-items: center;
   padding-top: 20px;
   font-size: var(--f18);
   font-weight: 400;
}
.info_confirm i{
   margin-right: 10px;
}
.information form{
   max-width: 740px;
   width: calc(100% - 420px);
}
.form_gender{
   max-width: 480px;
   display: flex;
   align-items: center;
   justify-content: space-between;
}
.form_gender input[type=text]{
   width: calc(100% - 220px);
}
.form_gender ul{
   display: flex;
   align-items: center;
   justify-content: space-between;
   max-width: 200px;
   width: 100%;
}
.form_gender li{
   width: 30%;
}
.form_gender ul label{
   font-size: var(--f18);
   color: #525252;
}

.form_gender input[type=radio]{
   /* display: none; */
   visibility: hidden;
   position: absolute;
   top: 0;
   left: 0;
}


.form_label{
   font-size: var(--f18);
   font-weight: 500;
   color: #525252;
   padding-bottom: 10px;
}
.form_label span{
   color: #FF0000;
}
.form_insert{
   padding-bottom: 20px;
}
.info_tab dd{
   display: flex;
   align-items: center;
}
.info_tab dd a{
   max-width: 155px;
   width: 25%;
   border-radius: 10px 10px 0 0;
   border-width: 1px 1px 0 1px;
   border-style: solid;
   border-color: #CCCCCC;
   padding: 10px;
   cursor: pointer;
   font-size: var(--f18);
   font-weight: 500;
   text-align: center;
}
.info_tab dd a.active{
   background: var(--subcolor);
   color: #FFFFFF;
}
.info_tab dt{
   display: none;
   border: 1px solid #CCCCCC;
   padding: 30px;
}
.info_tab dt.tab-1{
   display: block;
}
.info_tab p{
   display: flex;
   align-items: center;
   justify-content: space-between;
}
.info_tab p+p{
   padding-top: 20px;
}
.info_tab p input[type=number]{
   max-width: 50px;
   border: 1px solid #CCCCCC;
   border-radius: initial;
   padding: 5px 0 5px 10px;
   font-size: var(--f14);
}
.info_tab span{
   display: block;
   width: calc(100% - 60px);
}
.info_tab u{
   padding: 0 10px 0 0;
   font-size: var(--f18);
   text-decoration: none;
}
.info_tab b{
   font-weight: 400;
   font-size: var(--f14);
   color: #FF0000;
   padding-right: 10px;
   display: none;
}
p.info_nochoose u,p.info_nochoose s{
   color: #CCCCCC;
}
p.info_nochoose b{
   display: inline-block;
}
.info_tab s{
   text-decoration: none;
}
@media screen and (max-width:1024px) {
.info_confirm{
   display: flex;
   align-items: center;
   justify-content: space-between;
   position: initial;
   max-width: 100%;
   width: 100%;
}
.info_confirm div{padding: 10px 20px;width: calc(100% - 400px);}
.info_confirm p{padding-top: 5px;}
.information section{flex-flow: wrap;}
.information form{width: 100%;padding-top: 30px;max-width: 100%;}
}
@media screen and (max-width:768px) {
.information{padding: 80px 0;}
.info_confirm{flex-flow: wrap;max-width: 400px;}
.info_confirm div{width: 100%;padding: 30px 20px;}
}
@media screen and (max-width:600px) {
.information{padding: 50px 0;}
}
@media screen and (max-width:500px) {
.info_tab dt{padding: 20px;}
.form_gender{flex-flow: wrap;}
.form_gender input[type=text]{width: 100%;}
.form_gender ul{padding-top: 10px;}
}
@media screen and (max-width:450px) {
.info_tab dd a{max-width: 65px;padding: 10px;}
}



/*confirm*/
.confirm_index{
   padding: 100px 0;
}
/*all h6 title*/
.confirm_index h6{
   background: var(--linar);
   padding: 10px;
   font-size: var(--f25);
   font-weight: 500;
   color: #FFFFFF;
   text-align: center;
}

.confirm_cheack{
   display: flex;
   justify-content: space-between;
}
.confirm_cheack li{
   width: 49%;
   box-shadow: 0 0 5px #DDDDDD;
}
.confirm_cheack section,.confirm_cheack dl{
   max-width: 500px;
   margin: 0 auto;
   padding: 40px 20px;
}

.confirm_cheack section p{
   font-size: var(--f18);
   font-weight: 500;
   color: #525252;
}
.confirm_cheack section p+p{
   padding-top: 20px;
}
.confirm_cheack section p:nth-of-type(2){
   padding-top: 10px;
}
.confirm_cheack span{
   font-size: var(--f28);
}

.confirm_cheack dd+dd{
   padding-top: 20px;
}

.confirm_cheack h5{
   font-size: var(--f25);
   font-weight: 700;
   color: #525252;
}
.confirm_cheack dd p{
   position: relative;
   margin-top: 5px;
   padding-left: 15px;
   font-size: var(--f18);
   color: #525252;
}
.confirm_cheack dd p::before{
   content: '';
   display: block;
   width: 5px;
   height: 5px;
   border-radius: 50%;
   background: #999999;
   position: absolute;
   top: 10px;
   left: 0;
}

.confirm_cheack u{
   display: inline-block;
   color: #8C0000;
   text-decoration: none;
}

.confirm_total{
   padding: 30px 0;
   text-align: right;
}

.confirm_total p{
   font-size: var(--f18);
   color: #525252;
}
.confirm_total s{
   font-size: var(--f35);
   font-weight: 700;
   color: #B20000;
   text-decoration: none;
   padding: 0 10px;
}
.confirm_total u{
   font-size: var(--f25);
   text-decoration: none;
}

.payment_method{
   max-width: 1100px;
   width: calc(100% - 40px);
   margin: 0 auto;
   display: flex;
   align-items: center;
   padding: 20px 0;
}
.payment_method li{
   max-width: 110px;
   width: 100%;
}
.payment_method li+li{
   padding-left: 20px;
}
.payment_method li .radio_style{
   justify-content: flex-start;
}
.payment_method input[type=radio]{
   /* display: none; */
   visibility: hidden;
   position: absolute;
   top: 0;
   left: 0;
}
.confirm_bank{
   max-width: 1100px;
   width: calc(100% - 40px);
   margin: 0 auto;
}
.confirm_bank p{
   padding-top: 10px;
}
.confirm_bank p::before{
   margin-right: 15px;
}
.confirm_button{
   display: flex;
   align-items: center;
   justify-content: space-between;
   max-width: 280px;
   margin: 0 auto;
   padding-top: 30px;
}
.confirm_button input{
   display: block;
   width: 49%;
   border: none;
   background: #202020;
   padding: 10px;
   font-family: "Noto Sans TC", serif;
   font-size: var(--f18);
   color: #FFFFFF;
   cursor: pointer;
   transition: .5s ease;
}
.confirm_button input:hover{
   background: var(--maincolor);
}
@media screen and (max-width:1024px) {}
@media screen and (max-width:768px) {
.confirm_index{padding: 80px 0;}
.confirm_cheack{flex-flow: wrap;}
.confirm_cheack li{width: 100%;}
.confirm_cheack li+li{margin-top: 30px;}
.confirm_cheack section,.confirm_cheack dl{max-width: 100%;}
}
@media screen and (max-width:600px) {
.confirm_index{padding: 50px 0;}
.payment_method,.confirm_bank{width: calc(100% - 10px);}
}
@media screen and (max-width:500px) {
.confirm_cheack li{box-shadow: none;}
.confirm_cheack section,.confirm_cheack dl{padding: 20px 10px;}
.confirm_total{border-top: 1px solid #CCCCCC;}
}
@media screen and (max-width:375px) {
.payment_method{flex-flow: wrap;}
.payment_method li{width: 100%;max-width: 100%;}
.payment_method li+li{padding: 10px 0 0;}
}


/*finish*/
.finish_index{
   padding: 100px 0;
}
.finish_all_list{
   box-shadow: 0 0 5px #DDDDDD;
}
.finish_all_list dl{
   background: var(--linar);
   display: flex;
   align-items: flex-end;
   padding: 15px 25px;
   font-size: var(--f25);
   font-weight: 500;
   color: #FFFFFF;
   text-align: center;
}
.finish_all_list span{
   font-size: var(--f28);
   line-height: 1;
   padding-right: 10px;
}
.finish_all_list dt{
   padding-left: 10px;
}
.finish_all_list ul{
   max-width: 1100px;
   margin: 0 auto;
   padding: 40px 20px;
   display: flex;
}
.finish_all_list li{
   width: calc(49% - 50px);
   padding: 20px 0;
}
.finish_all_list li > p{
   font-size: var(--f18);
   color: #525252;
}
.finish_all_list li > p+p{
   padding-top: 20px;
}
.finish_all_list s{
   font-size: var(--f35);
   color: var(--maincolor);
   text-decoration: none;
   line-height: 1;
}
.finish_all_list b{
   font-size: var(--f28);
   font-weight: normal;
   text-decoration: none;
   line-height: 1;
}
.finish_all_list ol{
   width: 1px;
   background: #525252;
   margin: 0 50px;
}
.finish_all_list section > p{
   position: relative;
   margin-top: 5px;
   padding-left: 15px;
   font-size: var(--f18);
   color: #525252;
}
.finish_all_list section > p::before{
   content: '';
   display: block;
   width: 5px;
   height: 5px;
   border-radius: 50%;
   background: #999999;
   position: absolute;
   top: 10px;
   left: 0;
}
.finish_all_list u{
   display: inline-block;
   color: #8C0000;
   text-decoration: none;
}
.finish_all_list section+section{
   padding-top: 20px;
}
.finish_all_list h5{
   font-size: var(--f25);
   font-weight: 700;
   color: #525252;
}
.finish_notice h6{
   background: var(--linar);
   padding: 10px;
   font-size: var(--f25);
   font-weight: 500;
   color: #FFFFFF;
   text-align: center;
}
.finish_edit{
   font-size: var(--f16);
   color: #525252;
   line-height: 150%;
   text-align: center;
   padding: 30px 10px;
}

.finish_index a{
   display: block;
   max-width: 145px;
   margin: 0 auto;
   border: none;
   background: #202020;
   padding: 10px;
   font-family: "Noto Sans TC", serif;
   font-size: var(--f18);
   color: #FFFFFF;
   text-align: center;
   transition: .5s ease;
}
.finish_index a:hover{
   background: var(--maincolor);
}

@media screen and (max-width:1024px) {
.finish_all_list ol{margin: 0 20px;}
}
@media screen and (max-width:768px) {
.finish_index{padding: 80px 0;}
.finish_all_list ul{flex-flow: wrap;padding: 20px;}
.finish_all_list li{width: 100%;padding: 0 10px;}
.finish_all_list ol{width: 100%;min-height: 1px;margin: 20px 0;}
}
@media screen and (max-width:600px) {
.finish_index{padding: 50px 0;}
.finish_all_list ul{padding: 20px 10px;}
}
@media screen and (max-width:450px) {
.finish_all_list dl{flex-flow: wrap;}
.finish_all_list dt{width: 100%;padding: 5px 0 0;text-align: left;}
.finish_all_list li{padding: 0;}
}
@media screen and (max-width:375px) {
}

/*album*/
.album_page .main_part{
   max-width: 100%;
   padding: 50px 0;
}

.album_index{
   position: relative;
}

.album_page .swiper {
   user-select: none;
   -webkit-user-select: none;
   -moz-user-select: none;
}

.album_page .swiper-wrapper {
   height: auto;
}

.album_page .swiper-slide {
   text-align: center;
   font-size: 18px;
   background: #fff;
   display: flex;
   justify-content: center;
   align-items: center;
   background-size: cover;
   background-position: center;
   height: auto !important;
}

.album_page .swiper-slide img {
   display: block;
   width: 100%;
   object-fit: cover;
}

.menuSwiper{
   width: 18%;
   height: auto;
   box-sizing: border-box;
   margin: 0;
   height: 100%;
   overflow: hidden;
   position: absolute;
   top: 0;
   left: 0;
}

.menuSwiper .swiper-slide {
   width: 100%;
   opacity: 0.4;
}

.menuSwiper .swiper-slide-thumb-active {
   opacity: 1;
}

.menuSwiper2 {
   width: 81%;
   margin: 0 0 0 auto;
   overflow: hidden;
}

.menuSwiper {}

.menuSwiper .swiper-wrapper {
   position: relative;
   z-index: 50;
}

.menuSwiper .swiper-slide {
    cursor: pointer;
}

.menuSwiper .swiper-button-next {
   width: 40px;
   height: 40px;
   border-radius: 150px;
   right: auto;
   top: auto;
   left: 50%;
   bottom: 10px;
   transform: translateX(-50%) rotate(90deg);
   /*  */
   display: flex;
   justify-content: center;
   align-items: center;
   /*  */
   color: white;
   background-image: unset;
   margin: 0;
   background-color: rgba(0, 0, 0, 0.6);
   z-index: 100;
}

.menuSwiper .swiper-button-prev {
   width: 40px;
   height: 40px;
   border-radius: 150px;
   margin: 0;
   left: 50%;
   transform: translateX(-50%) rotate(90deg);
   top: 10px;
   bottom: auto;
   /*  */
   display: flex;
   justify-content: center;
   align-items: center;
   /*  */
   color: white;
   background-image: unset;
   background-color: rgba(0, 0, 0, 0.6);
   z-index: 100;
}

/*  */

.album_index .swiper-button-next:after,.album_index .swiper-button-prev:after {
   font-size: 16px;
}

.album_index .swiper-button-next.swiper-button-disabled,.album_index .swiper-button-prev.swiper-button-disabled {
   opacity: 0.5;
}

/*  */


.menuSwiper2 .swiper-button-next {
   width: 40px;
   height: 40px;
   border-radius: 150px;
   /*  */
   display: flex;
   justify-content: center;
   align-items: center;
   /*  */
   color: white;
   background-image: unset;
   background-color: rgba(0, 0, 0, 0.6);
   z-index: 100;
   top: 50%;
   transform: translateY(-50%);
   margin: 0;
}

.menuSwiper2 .swiper-button-prev {
   width: 40px;
   height: 40px;
   border-radius: 150px;
   /*  */
   display: flex;
   justify-content: center;
   align-items: center;
   /*  */
   color: white;
   background-image: unset;
   background-color: rgba(0, 0, 0, 0.6);
   z-index: 100;
   top: 50%;
   transform: translateY(-50%);
   margin: 0;
}


@media (max-width:1440px) {
}
@media (max-width:768px) {
.album_index .swiper-button-next:after,.album_index .swiper-button-prev:after {
   font-size: 12px;
}
.menuSwiper2 .swiper-button-next,.menuSwiper2 .swiper-button-prev,.menuSwiper .swiper-button-prev,.menuSwiper .swiper-button-next {
   width: 30px;
   height: 30px;
}

.album_index{
   /* display: flex; */
   flex-direction: column-reverse;
   align-items: center;
}

.menuSwiper,.menuSwiper2 {
   width: 100%;
}

.menuSwiper {
   margin-top: 15px;
   position: relative;
   left: auto;
   top: auto;
}

.menuSwiper .swiper-button-prev {
   left: 10px;
   top: 50%;
   transform: translateY(-50%);
}

.menuSwiper .swiper-button-next {
   bottom: auto;
   right: 10px;
   left: auto;
   top: 50%;
   transform: translateY(-50%);
}
}


/*inquiry*/

.inquiry_form{
   max-width: 630px;
   margin: 0 auto;
   padding: 100px 0;
}

.inquiry_form h6{
   border-bottom: 1px solid #AAAAAA;
   padding-bottom: 10px;
   font-size: var(--f20);
   font-weight: 500;
   color: #525252;
}

.inquiry_form u{
   color: #FF0000;
   text-decoration: none;
}

.inquiry_form s{
   color: #FF0000;
   text-decoration: none;
}

.inquiry_form span{
   display: inline-block;
   padding-left: 10px;
   font-size: var(--f16);
}

.inquiry_form form{
   padding-bottom: 50px;
}

.inquiry_form ul{
   padding-top: 25px;
}

.inquiry_form ul:nth-last-of-type(1) li{
   display: flex;
   align-items: center;
   justify-content: space-between;
   max-width: 320px;
}
.inquiry_form ul:nth-last-of-type(1) input{
   width: calc(100% - 80px);
}

.inquiry_form h5{
   font-size: var(--f18);
   font-weight: 500;
   color: #525252;
   padding-bottom: 5px;
}

.inquiry_button{
   display: flex;
   align-items: center;
   justify-content: space-between;
   max-width: 280px;
   margin: 0 auto;
   padding-top: 30px;
}
.inquiry_button input{
   display: block;
   width: 49%;
   border: none;
   background: #202020;
   padding: 10px;
   font-family: "Noto Sans TC", serif;
   font-size: var(--f18);
   color: #FFFFFF;
   cursor: pointer;
   transition: .5s ease;
}
.inquiry_button input:hover{
   background: var(--maincolor);
}
@media screen and (max-width:1024px) {
}
@media screen and (max-width:768px) {
.inquiry_form{padding: 80px 0;}
}
@media screen and (max-width:600px) {
.inquiry_form{padding: 50px 0;}
.inquiry_form form{padding-bottom: 0;}
}
@media screen and (max-width:450px) {
}
@media screen and (max-width:375px) {
.inquiry_form span{display: block;padding: 5px 0 0;}
}

/*inquiry_result*/
.inquiry_result{
   max-width: 1000px;
   margin: 0 auto;
   padding: 100px 0;
}
.inquiry_result section{
   border: 1px solid #CCCCCC;
   padding: 50px 30px 20px;
   position: relative;
}
.inquiry_result h6{
   background: var(--linar);
   padding: 10px;
   max-width: 200px;
   width: 100%;
   position: absolute;
   top: -28px;
   left: -1px;
   font-size: var(--f25);
   font-weight: 500;
   color: #FFFFFF;
   text-align: center;
}
.inquiry_result ul{
   display: flex;
   align-items: flex-start;
   flex-flow: wrap;
   gap: 10px 20px;
}

.inquiry_result table{
   display: block;
   padding: 30px 0 50px;
}
.inquiry_result tbody{
   display: table;
   width: 100%;
   border-spacing: 0;
}
.inquiry_result tr{
   transition: .5s ease;
}
.inquiry_result tr:nth-of-type(odd){
   background: #EEEEEE;
}
.inquiry_result tr:nth-of-type(1),.inquiry_result tr:nth-of-type(1):hover{
   background: var(--linar);
}
.inquiry_result td{
   padding: 20px 10px;
   color: #202020;
   text-align: center;
}
.inquiry_result tr:nth-of-type(1) td{
   color: #FFFFFF;
}
.inquiry_result td:nth-of-type(1){
   width: 16%;
}
.inquiry_result td:nth-of-type(2){
   width: 16%;
}
.inquiry_result td:nth-of-type(3){
   width: 16%;
}
.inquiry_result td:nth-of-type(4){
   width: 16%;
}
.inquiry_result td:nth-of-type(5){
   width: 16%;
}
.inquiry_result td:nth-of-type(6){
   width: 20%;
}
.inquiry_result tr:hover td,.inquiry_result tr:hover a{
   /* color: #FFFFFF; */
}

.inquiry_result a{
   /* display: block; */
   padding: 10px 20px;
   color: #202020;
}
.inquiry_result a:hover{
   background: #202020;
   color: #FFFFFF;
}
.inquiry_result input{
   display: block;
   max-width: 130px;
   width: 100%;
   margin: 0 auto;
   border: none;
   background: #202020;
   padding: 10px;
   font-family: "Noto Sans TC", serif;
   font-size: var(--f18);
   color: #FFFFFF;
   cursor: pointer;
   transition: .5s ease;
}
.inquiry_result input:hover{
   background: var(--maincolor);
}

@media screen and (max-width:1024px) {
}
@media screen and (max-width:920px) {
.inquiry_result tbody{display: block;}
.inquiry_result tr{display: block;padding: 10px;text-align: center;}
.inquiry_result tr:nth-of-type(1){display: none;}
.inquiry_result td{display: inline-block; padding: 5px;text-align: left;}
.inquiry_result td:nth-of-type(n){width: fit-content;}
.inquiry_result td:nth-last-of-type(1){width: 100%;}
.inquiry_result td:before {
   content: attr(data-th) " : ";
   display: inline;
   text-transform: uppercase;
}
.inquiry_result td:nth-last-of-type(1)::before{
   display: none;
}
.inquiry_result a{
   display: block;
   max-width: fit-content;
   width: 100%;
   margin: 0 auto;
   background: var(--maincolor);
   text-align: center;
   color: #FFFFFF;
}
}
@media screen and (max-width:768px) {
.inquiry_result{padding: 80px 0;}
}
@media screen and (max-width:600px) {
.inquiry_result{padding: 80px 0 50px;}
.inquiry_result table{padding: 20px 0;}
.inquiry_result td{display: block;}
.inquiry_result a{max-width: 100%;}
}
@media screen and (max-width:450px) {
}
@media screen and (max-width:375px) {
}



/*inquiry_detailed*/
.inquiry_detailed{
   padding: 100px 0;
}
.inquiry_detailed h6{
   background: var(--linar);
   padding: 10px;
   font-size: var(--f25);
   font-weight: 500;
   color: #FFFFFF;
   text-align: center;
}

.inquiry_cheack{
   display: flex;
   justify-content: space-between;
}
.inquiry_cheack li{
   width: 49%;
   box-shadow: 0 0 5px #DDDDDD;
}
.inquiry_cheack section,.inquiry_cheack dl{
   max-width: 500px;
   margin: 0 auto;
   padding: 40px 20px;
}

.inquiry_cheack section p{
   font-size: var(--f18);
   font-weight: 500;
   color: #525252;
}
.inquiry_cheack section p+p{
   padding-top: 20px;
}
.inquiry_cheack section p:nth-of-type(2){
   padding-top: 10px;
}
.inquiry_cheack span{
   font-size: var(--f28);
}

.inquiry_cheack dd+dd{
   padding-top: 20px;
}

.inquiry_cheack h5{
   font-size: var(--f25);
   font-weight: 700;
   color: #525252;
}
.inquiry_cheack dd p{
   position: relative;
   margin-top: 5px;
   padding-left: 15px;
   font-size: var(--f18);
   color: #525252;
}
.inquiry_cheack dd p::before{
   content: '';
   display: block;
   width: 5px;
   height: 5px;
   border-radius: 50%;
   background: #999999;
   position: absolute;
   top: 10px;
   left: 0;
}

.inquiry_cheack u{
   display: inline-block;
   color: #8C0000;
   text-decoration: none;
}

.inquiry_total{
   padding: 30px 0;
   text-align: right;
}

.inquiry_total p{
   font-size: var(--f18);
   color: #525252;
}
.inquiry_total s{
   font-size: var(--f35);
   font-weight: 700;
   color: #B20000;
   text-decoration: none;
   padding: 0 10px;
}
.inquiry_total u{
   font-size: var(--f25);
   text-decoration: none;
}


.inquiry_button{
   display: flex;
   align-items: center;
   justify-content: space-between;
   max-width: 280px;
   margin: 0 auto;
   padding-top: 30px;
}
.inquiry_button input,.inquiry_button a{
   display: block;
   width: 49%;
   border: none;
   background: #202020;
   padding: 10px;
   font-family: "Noto Sans TC", serif;
   font-size: var(--f18);
   color: #FFFFFF;
   text-align: center;
   cursor: pointer;
   transition: .5s ease;
}
.inquiry_button input:hover,.inquiry_button a:hover{
   background: var(--maincolor);
}


/*lightbox*/

.lightbox-opened {
   background: rgba(30,30,30,0.4);
   position: fixed;
   top: 0;
   bottom: 0;
   left: 0;
   right: 0;
   text-align: center;
   display: flex;
   align-items: center;
   justify-content: center;
   width: 100%;
   height: 100%;
   z-index: 999999;
   -webkit-animation: fadebox 0.4s;
   animation: fadebox 0.4s;
}

@-webkit-keyframes fadebox {
from {opacity: 0;}
to {opacity: 1;}
}

@keyframes fadebox {
from {opacity: 0;}
to {opacity: 1;}
}

.lightbox-opened section{
   max-width: 555px;
   width: 100%;
   background: #FFFFFF;
   margin: 0 auto;
   /* padding-bottom: 50px; */
}

.yes_cancel,.no_cancel{
   display: flex;
   width: 100%;
   padding-bottom: 50px;
   min-height: 250px;
   align-items: center;
   justify-content: center;
   align-content: center;
   position: relative;
}

.yes_cancel h6{
   width: 100%;
   font-size: var(--f28);
   font-weight: 400;
}

.no_cancel{
   display: block;
   padding: 0;
}

.no_cancel h5{
   font-size: var(--f28);
   font-weight: 400;
   padding-bottom: 20px;
}

.no_cancel h4{
   font-size: var(--f20);
   font-weight: 400;
}
.no_cancel a{
   display: block;
   font-size: var(--f20);
   font-weight: 400;
   color: unset;
}

.lightbox-opened i {
   display: flex;
   align-items: center;
   justify-content: center;
   width: 35px;
   height: 35px;
   position: absolute;
   top: -17.5px;
   right: -17.5px;
   cursor: pointer;
}

.lightbox-opened i:before {
   content: "×";
   background-color: #FFFFFF;
   border: 1px solid #CCCCCC;
   color: #545454;
   font-size: var(--f25);
   font-family: sans-serif;
   line-height: 1;
   letter-spacing: 0;
   padding: 15px 20px;
   border-radius: 50%;
   transition: .5s ease;
}

.lightbox-opened i:hover::before{
   background: #545454;
   color: #FFFFFF;
}

.lightbox-opened i:before {
   padding: 8px 13px;
}

.no-scroll {
   overflow: hidden;
}

.light_button{
   display: flex;
   align-items: center;
   justify-content: space-between;
   width: 100%;
   position: absolute;
   bottom: 0;
   left: 0;
   border-top: 1px solid #CCCCCC;
}
.light_button input{
   display: block;
   width: 50%;
   border: none;
   background: none;
   padding: 10px;
   cursor: pointer;
   font-family: "Noto Sans TC", serif;
   font-size: var(--f20);
   transition: .5s ease;
}
.light_button input:nth-of-type(1){
   border-right: 1px solid #CCCCCC;
}
.light_button input:hover{
   background: var(--subcolor);
   color: #FFFFFF;
}

@media screen and (max-width:1024px) {}
@media screen and (max-width:768px) {
.inquiry_detailed{padding: 80px 0;}
.inquiry_cheack{flex-flow: wrap;}
.inquiry_cheack li{width: 100%;}
.inquiry_cheack li+li{margin-top: 30px;}
.inquiry_cheack section,.inquiry_cheack dl{max-width: 100%;}
}
@media screen and (max-width:600px) {
.inquiry_detailed{padding: 50px 0;}
.payment_method{width: calc(100% - 10px);}
}
@media screen and (max-width:500px) {
.inquiry_cheack li{box-shadow: none;}
.inquiry_cheack section,.inquiry_cheack dl{padding: 20px 10px;}
.inquiry_total{border-top: 1px solid #CCCCCC;}
}
@media screen and (max-width:375px) {
}




/*remit*/
.remit_form{
   padding: 75px 0 100px;
}
.remit_form form{
   max-width: 700px;
   margin: 0 auto;
   display: flex;
   justify-content: space-between;
   flex-flow: wrap;
}
.remit_form ul{
   width: 49%;
}
ul.remit_width{
   width: 100%;
}


.remit_form u{
   color: #FF0000;
   text-decoration: none;
}

.remit_form s{
   color: #FF0000;
   text-decoration: none;
}

.remit_form span{
   display: inline-block;
   padding-left: 10px;
   font-size: var(--f16);
}

.remit_form form{
   padding-bottom: 50px;
}

.remit_form ul{
   padding-top: 25px;
}

.remit_form ul:nth-last-of-type(1) li{
   display: flex;
   align-items: center;
   justify-content: space-between;
   max-width: 320px;
}
.remit_form ul:nth-last-of-type(1) input{
   width: calc(100% - 80px);
}

.remit_form h5{
   font-size: var(--f18);
   font-weight: 500;
   color: #525252;
   padding-bottom: 5px;
}

.remit_button{
   display: flex;
   align-items: center;
   justify-content: space-between;
   max-width: 280px;
   margin: 0 auto;
   padding-top: 30px;
}
.remit_button input,.remit_button a{
   display: block;
   width: 49%;
   border: none;
   background: #202020;
   padding: 10px;
   font-family: "Noto Sans TC", serif;
   font-size: var(--f18);
   color: #FFFFFF;
   text-align: center;
   cursor: pointer;
   transition: .5s ease;
}
.remit_button input:hover,.remit_button a:hover{
   background: var(--maincolor);
}
@media screen and (max-width:1024px) {}
@media screen and (max-width:768px) {
.remit_form{padding: 55px 0 80px;}
}
@media screen and (max-width:600px) {
.remit_form{padding: 35px 0 50px;}
.remit_form form{padding: 0;}
.remit_form ul{width: 100%;padding-top: 15px;}
}
@media screen and (max-width:500px) {
}
@media screen and (max-width:375px) {
}