@charset "utf-8";
/*Background_setting*/
@import url(https://fonts.googleapis.com/earlyaccess/notosanstc.css);
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+TC:wght@200;300;400;500;600;700;900&display=swap');
*{ margin:0; padding:0; line-height:160%; font-family:'Noto Sans TC',sans-serif; font-size:16px; font-weight:300; box-sizing:border-box; color:#333;}
*:focus { outline: none;}
::selection{ background-color:#005bac; color:#ecbc76;}
a{ text-decoration:none;}
img{ max-width:100%;}

/*header*/
header{ position:fixed; top:0; left:0; right:0; display:block; z-index:10; transition:background-color .4s; background-color: rgba(0,105,172,1); }
header .logo{ display:block; position:absolute; top:25px; left:100px; width: 180px; font-size: 0; }
header .menu_mobile_btn{ display:none;}
header .menu_box{ text-align:right; }
header .menu_box .mb01{ height:124px; padding-right:70px; display:flex; align-items: center; justify-content: flex-end; }
header .menu_box .mb01 .link{ line-height:56px; height:56px; background-color:#fff; color:#0069ac; width:136px; margin:5px 0 5px 23px; display:inline-block; border-radius:50px; font-weight:700; text-align:center; font-size:18px; }
header .menu_box .mb01 .link.hold{ background-color: #b5b5b6; color: #fff; }
header .menu_box .mb02{ background-color:rgba(255,255,255,1); transition: background-color .4s; display:flex; justify-content: space-around; }
header .menu_box .mb02 .link{ line-height:84px; height:84px; color:#333; padding:0 20px; font-size:22px; color:#0069ac; font-weight:700; flex:1; text-align: center; }
header .menu_box .mb02 .link.hold{ background-color: #b5b5b6; color: #fff; }
header.fixed_top{ background-color:rgba(0,105,172,1);}
header.fixed_top .menu_box .mb02{ background-color:rgba(255,255,255,1);}

/*content*/
.wrapper{ background-color:#fff; position:relative; /*min-height:100vh;*/ z-index:5; }
.content_box{ max-width:1700px; margin:auto; padding:0 30px;}
.content_box h3{ font-size:24px; font-weight:700; font-family:'Noto Serif TC'; padding-bottom:10px; text-decoration:none; position:relative; text-align:center;}
.content_box h3::after{ content:""; display:none; width:100px; margin:auto; position:absolute; bottom:12px; left:0; right:0; height:10px; border-radius:5px; background-color:rgba(5,95,175,.3);}
.content_box h3.sty01{ color: #be8a43; font-size: 36px; font-weight: 700; display: flex; justify-content:flex-start; align-items: baseline; text-align: left; padding-bottom: 20px; }
.content_box h3.sty01 .radius{ width: 24px; height: 24px; background-color: #be8a43; border-radius: 50%; margin-right: 15px; }
.content_box h3.sty01.padBtm{ padding-bottom: 0; }
.content_box p{ font-size:22px; color:#333; line-height:2;}
.content_box p span{ color: inherit; font-size: inherit; font-weight: inherit; }
.content_box .more_btn{ line-height:42px; height:42px; border-radius:5px; text-align:center; display:inline-block; color:#fff; padding:0 10px; font-size:22px; background:#be8a43; border:0; cursor:pointer;}
.content_box .more_btn .fa{ color:#fff;}
.content_box .more_btn.red{ background:#ea5541;}
.content_box .more_btn.main{ background: #be8a43; }
.content_box .more_btn.tag_disable{ transition:all 0.5s; color:#999; background:#ffffff; border:1px solid #ccc; }
.content_box .more_btn.tag_disable:hover{ color:#fff; background-color:#005bac;  border:1px solid #fff; }
.content_box .btn_style{ color:#fff; padding:0 50px; font-size:20px; background-color:#be8a43; border-radius:100px; line-height: 70px; height: 70px; }
.content_box .cancel_style{ background-color:#777; font-size:25px; border-radius: 100px; }
.content_box .btnMargin{ margin: 0 10px; }
.right_btn{ position:fixed; right:30px; bottom:70px; width:62px; z-index:10;}
.right_btn .link{ width:62px; height:62px; border-radius:20px; display:block; margin-top:15px; transform:translateY(0px); transition:.3s; box-shadow: 0 0 10px 0px rgba(0,0,0,0.2); }
.right_btn .chooseBtn{ display:none; width:102px; height:102px; background-image:url(../image/layout/choose_btn_pc.png); background-repeat:no-repeat; background-position:center; border-radius:0; animation:buybtn 1s 0.5s 1 forwards,buybtnMove 1.5s 1.5s infinite ease-out; opacity: 0; border-radius:50px; position: fixed; right: 50%; bottom:50%; margin-right: -835px; }
@keyframes buybtn{
	0%{ opacity: 0; transform: translateY(-20px); }
	100%{ opacity: 1; transform: translateY(0px); }
}
@keyframes buybtnMove{
	0%{ transform: translateY(0px); }
	50%{ transform: translateY(-5px); }
	100%{ transform: translateY(0px); }
}
@media screen and ( max-width: 1700px){
	.right_btn .chooseBtn{
		margin-right:auto;
		right:10px;
	}
}

table{ width:100%; border:1px solid #ccc; border-collapse:collapse;}
table th{ background-color:#055faf; color:#fff; padding:10px; text-align:left;}
table td{ color:#333; padding:10px; background-color:#fff;}
table tr:nth-child(even) td:not(.table-condensed td){ background-color:#f5f5f5;}
select{ font-size:22px; min-width:60px; border:1px solid #ccc; line-height:35px; height:35px; color:#333; padding:0 35px 0 10px; appearance:none; -moz-appearance:none; -webkit-appearance:none; border-radius:5px; -moz-border-radius:5px; -webkit-border-radius:5px; background:url(../image/layout/select_arrow.png) no-repeat center right #fff; cursor:pointer;}
textarea{ width:100%; border:1px solid #777; color:#333; padding:5px 10px; appearance:none; -moz-appearance:none; -webkit-appearance:none; border-radius:5px; -moz-border-radius:5px; -webkit-border-radius:5px; resize:none;}


/*footer*/
footer{ background-color:#333; padding:50px 120px; position:relative; }
footer .content_box{ display:flex; justify-content:space-between; align-items: flex-start; padding:0; max-width:1700px; }
footer .logobox{ padding:0 0 15px 0; border-bottom:1px solid #fff; margin-bottom:15px; }
footer .logobox .logo{ font-size:0; display:block; width: 172px; }
footer .info_box .word{ color:#fff; font-size:20px; padding-bottom:10px; font-weight: 500; }
footer .info_box .word .space{ display:inline-block; padding:0 7px; color:#9f9d9c; font-size:inherit; font-weight:inherit; }
footer .info_box .word .link{ color:#fff; font-size:20px;}
footer .info_box .word.menu_box{ display:grid; grid-template-columns:1fr 1fr; grid-template-rows:1fr 1fr 1fr 1fr 1fr; grid-gap:0 90px; padding:0; }
footer .info_box .word.menu_box .link{ display:block; min-width:145px; border-bottom:1px solid #fff; margin-bottom:30px; font-size:20px; padding-bottom:5px; }
footer .info_box .word.menu_box .link:nth-child(1){ grid-column:1/2; grid-row:1/2; }
footer .info_box .word.menu_box .link:nth-child(2){ grid-column:1/2; grid-row:2/3; }
footer .info_box .word.menu_box .link:nth-child(3){ grid-column:1/2; grid-row:3/4; }
footer .info_box .word.menu_box .link:nth-child(4){ grid-column:1/2; grid-row:4/5; }
footer .info_box .word.menu_box .link:nth-child(5){ grid-column:2/3; grid-row:1/2; }
footer .info_box .word.menu_box .link:nth-child(6){ grid-column:2/3; grid-row:2/3; }
footer .info_box .word.menu_box .link:nth-child(7){ grid-column:2/3; grid-row:3/4; }
footer .info_box .word.menu_box .link:nth-child(8){ grid-column:2/3; grid-row:4/5; }
footer .info_box .word.menu_box .link:nth-child(9){ grid-column:2/3; grid-row:5/6; }
footer .info_box .word.gray{ color:#898989; }

/* .footer_link_effect Source is from -> Copyright (c) 2023 by kazemi (https://codepen.io/kazemi/pen/aGXbMm) */
.footer_link_effect{ font-size: inherit; }
.footer_link_effect a{ position: relative; display: inline-block; color: rgba(137, 137, 137, 1); font-size: inherit; text-decoration: none; }
.footer_link_effect a:hover { color:#fff; -webkit-mask-image: linear-gradient(-75deg, rgba(0, 0, 0, .2) 30%, #000 50%, rgba(0, 0, 0, .2) 70%); -webkit-mask-size: 200%; animation: shine 2s infinite; transition: 0.35s; }
@-webkit-keyframes shine { from { -webkit-mask-position: 150%; } to { -webkit-mask-position: -50%; } }

/* Loading Now */
.loading{ display: none; z-index: 999; position: fixed; top: 0; bottom: 0; left: 0; right: 0; background-color: rgba(0,0,0,.3); }
.loading svg{ position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); height: 100px; width: 100px; }
.loading svg path, .loading svg rect{ fill: #055FAF; }

/*top按鈕*/
.topWebBtn{ width:62px; height:62px; border-radius:20px; background-color:#0069ac; color:#fff; transition: .3s; box-shadow: 0 0 10px 0px rgba(0,0,0,0.2); position: fixed; right: 110px; bottom:70px; display:flex; align-items: center; justify-content: center; font-size:1.125rem; font-weight:900; z-index:10; border: 4px solid #fff; }

/*HOVER*/
@media screen and ( min-width: 1100px) {
.right_btn .link:hover{ transform:translateY(-7px); transition:.3s;}
}

/*電腦特別尺寸*/
@media screen and ( max-width: 1500px) and ( min-width: 1100px) {
footer .info_box .word.menu_box{ grid-gap: 0 40px; }
footer .info_box .word.menu_box .link{ min-width: 95px; }

.footer_link_effect{ display:block; }
}


/*PAD*/
@media screen and ( max-width: 1099px) and ( min-width: 768px) {
/*header*/
header{ display: flex; justify-content: flex-end; }
header .logo{ width:117px; height:51px; margin:auto; left:0; right:0; margin:auto; top:0; bottom:0; }
header .menu_mobile_btn{ display:block; width:65px; height:65px; cursor:pointer; border-radius:5px; z-index:2; display: flex; flex-direction: column; justify-content: center; }
header .menu_mobile_btn p{ border-top:2px solid #fff; width:28px; margin:3px auto; }
header .menu_box{ display:none; transition:right 0.5s; width:100%; height:auto; position:absolute; top:65px; right:0; background-color:#fff; z-index:1}
header .menu_box .mb01{ display:block; padding:0; height:auto; border-bottom:5px solid #efefef; }
header .menu_box .mb01 .link{ display:block; text-align:left; margin:0; border-radius:0; line-height:50px; height:50px; width:100%; font-size:16px; border-bottom:2px solid #efefef; padding:0 30px; }
header .menu_box .mb02{ flex-direction: column; }
header .menu_box .mb02 .link{ display:block; text-align:left; font-size:16px; line-height:50px; height:50px; border-bottom:2px solid #efefef; padding:0 30px; }
header.fixed_top .menu_mobile_btn p{ border-top:2px solid #fff; background-color:rgba(0,0,0,.2);}

header.menu_show .menu_box{ display:block; }

/*footer*/
footer{ padding:30px;}
footer .content_box{ flex-direction: column; }
footer .info_box{ width:100%; }
footer .info_box:nth-child(1){ order:2; }
footer .info_box:nth-child(2){ order:1; }
footer .info_box .word.menu_box{ grid-template-columns:1fr 1fr 1fr; grid-template-rows:initial; margin-bottom:40px; }
footer .info_box .word.menu_box .link:nth-child(1){ grid-column:initial; grid-row:initial; }
footer .info_box .word.menu_box .link:nth-child(2){ grid-column:initial; grid-row:initial; }
footer .info_box .word.menu_box .link:nth-child(3){ grid-column:initial; grid-row:initial; }
footer .info_box .word.menu_box .link:nth-child(4){ grid-column:initial; grid-row:initial; }
footer .info_box .word.menu_box .link:nth-child(5){ grid-column:initial; grid-row:initial; }
footer .info_box .word.menu_box .link:nth-child(6){ grid-column:initial; grid-row:initial; }
footer .info_box .word.menu_box .link:nth-child(7){ grid-column:initial; grid-row:initial; }
footer .info_box .word.menu_box .link:nth-child(8){ grid-column:initial; grid-row:initial; }
footer .info_box .word.menu_box .link:nth-child(9){ grid-column:initial; grid-row:initial; }
footer .logo{ padding-right:30px; }
footer .info_box .word{ font-size:14px;}
footer .info_box .word .link{ font-size:14px;}
}


/*MOBILE*/
@media screen and ( max-width: 767px) {
/*header*/
header{ display: flex; justify-content: flex-end; }
header .logo{ width:117px; height:40px; margin:auto; left:0; right:0; margin:auto; top:0; bottom:0; }
header .menu_mobile_btn{ display:block; width:65px; height:65px; cursor:pointer; border-radius:5px; z-index:2; display: flex; flex-direction: column; justify-content: center; }
header .menu_mobile_btn p{ border-top:2px solid #fff; width:28px; margin:3px auto; }
header .menu_box{ transition:unset; display:none; max-height:calc(100vh - 75px); position:absolute; top:65px; left:0px; right: 0px; background-color:#fff; z-index:1}
header .menu_box .mb01{ display:block; padding:0; height:auto; border-bottom:5px solid #efefef; }
header .menu_box .mb01 .link{ display:block; text-align:left; margin:0; line-height:50px; height:50px; font-size:16px; border-bottom:1px solid #efefef; padding:0 15px; width:100%; border-radius:0; }
header .menu_box .mb02{ flex-direction: column; }
header .menu_box .mb02 .link{ display:block; text-align:left; margin:0; line-height:50px; height:50px; font-size:16px; border-bottom:1px solid #efefef; padding:0 15px; }
header.fixed_top .menu_mobile_btn p{ border-top:2px solid #fff;}
header.fixed_top .menu_mobile_btn.open p{ border-top:2px solid #fff;}

/*content*/
.content_box h3.sty01{ font-size: 20px; }
.content_box h3.sty01 .radius{ width: 15px; height: 15px; margin-right: 10px; }
.content_box p{ font-size: 16px; }
.content_box .more_btn{ width:100%; text-align:center; margin-bottom:10px; padding:0 10px; font-size:16px;}
.content_box .btnMargin{ margin: 0 0 10px 0; }

.right_btn{ text-align:right; font-size:0; width:35px; right:10px; }
.right_btn .link{ width:35px; height:35px; border-radius: 10px; display:inline-block; margin-top:10px; background-size:100%; }
.right_btn .chooseBtn{ background-image:url(../image/layout/choose_btn.png); width:56px; height:56px; background-size:100%; border-radius:50%; -webkit-border-radius:50%; -moz-border-radius:50%; margin-bottom: -23px; }

.content_box .btn_style{ line-height:50px; height:50px; font-size:14px; width:auto; }

select{ font-size: 16px; }

/*footer*/
footer{ padding:30px;}
footer .content_box{ flex-direction: column; }
footer .info_box{ width:100%; }
footer .info_box:nth-child(1){ order:2; }
footer .info_box:nth-child(2){ order:1; }
footer .info_box .word.menu_box{ grid-template-columns:1fr 1fr 1fr; grid-template-rows:initial; margin-bottom:40px; grid-gap: 0 20px; }
footer .info_box .word.menu_box .link{ min-width:auto; font-size:13px; margin-bottom:15px; }
footer .info_box .word.menu_box .link:nth-child(1){ grid-column:initial; grid-row:initial; }
footer .info_box .word.menu_box .link:nth-child(2){ grid-column:initial; grid-row:initial; }
footer .info_box .word.menu_box .link:nth-child(3){ grid-column:initial; grid-row:initial; }
footer .info_box .word.menu_box .link:nth-child(4){ grid-column:initial; grid-row:initial; }
footer .info_box .word.menu_box .link:nth-child(5){ grid-column:initial; grid-row:initial; }
footer .info_box .word.menu_box .link:nth-child(6){ grid-column:initial; grid-row:initial; }
footer .info_box .word.menu_box .link:nth-child(7){ grid-column:initial; grid-row:initial; }
footer .info_box .word.menu_box .link:nth-child(8){ grid-column:initial; grid-row:initial; }
footer .info_box .word.menu_box .link:nth-child(9){ grid-column:initial; grid-row:initial; }

footer .info_box .word .sp{ display:none; }

footer .logo{ display:block; padding-bottom:0px;}
footer .logobox .logo{ width: 118px; }
footer .info_box{ text-align:left;}
footer .info_box .word{ font-size:14px; line-height:2;}
footer .info_box .word .link{ font-size:14px; line-height:2;}
footer .info_box .word .sp_tel{ display:block; font-size:22px; }
footer .info_box .word.gray{ font-size:12px; text-align:center; }
.footer_link_effect a{ display:block; }

/*top按鈕*/
.topWebBtn{ width: 35px; height: 35px; border-radius:10px; font-size:0.75rem; border-width:2px; bottom: 205px; right:10px; }

}

/* Layout Banner Slider */
.BannerSlider{ position: relative; }
.BannerSlider .titleTopBox{ position: absolute; top: 0; z-index: 1; }
.BannerSlider .Slider{ width: 100%; height: 100%; }
.BannerSlider .Slider .Item{ width: 100%; height: 100%; display: block; }
.BannerSlider .Slider .slick-list,
.BannerSlider .Slider .slick-list .slick-track,
.BannerSlider .Slider .slick-list .slick-track .slick-slide,
.BannerSlider .Slider .slick-list .slick-track .slick-slide>div{ width: 100%; height: 100% !important; }
.BannerSlider .Slider .slick-list .slick-track .slick-slide>div{ padding: 0; font-size: 0; }

.BannerSlider .BannerMenu{ position:absolute; z-index:10; bottom:10px; left:0; right: 0; margin:auto; text-align:center; }
.BannerSlider .BannerMenu .point{ width:18px; height:18px; background:#fff; border-radius:50px; margin:0 10px; border: 1px solid #ccc; display:inline-block; transition:.2s;}
.BannerSlider .BannerMenu .point.focus{ background-color:#055faf; transition:.2s;}

.BannerSlider .BannerMenu{ bottom: 0; transform: translateY(calc(100% + 14px)); }

.BannerSlider .Slider .Item .ImagesPC,
.BannerSlider .Slider .Item .ImagesSP{ width: 100%; height: 100%; background-position: bottom center; background: no-repeat top center; background-size: cover; position: relative; font-size: 0; }

@media screen and ( min-width: 768px){
	.BannerSlider .Slider .Item .ImagesSP{ display: none; }
}
@media screen and ( max-width: 767px){
	.BannerSlider .Slider{ position: absolute; top: 0; bottom: 0; left: 0; right: 0; }
	.BannerSlider .Slider .Item .ImagesPC{ display: none; }

	.BannerSlider .BannerMenu{ bottom: 0; }
	.BannerSlider .BannerMenu .point{ width:10px; height:10px; margin:0 5px; }
}
