@charset "UTF-8";
@import "https://web-eshop.cdn.hinet.net/apple/css/aos.css";
@import url('https://fonts.googleapis.com/css?family=Noto+Sans+TC:400,500,700&subset=chinese-traditional');
html{font-size:20px}
body{background:#fff;font-size:1rem;font-weight:300;line-height:1.6;font-family:"PingFang TC","Noto Sans TC","SF Pro TC","SF Pro Text","Microsoft JhengHei","Helvetica Neue","Noto Sans CJK TC",Helvetica,Arial,sans-serif;color:#333;font-weight:normal}
/* 230328 */
header{max-width:1142px;margin:0 auto;font-size: .8rem;-webkit-transition:all linear .3s;-o-transition:all linear .3s;transition:all linear .3s}
.miniature{color:rgba(0,0,0,0.8)}
#event-float { right: 100px; bottom: 200px; }
#gotop { position: fixed; width: 83px; height: 83px; background: url(../images/top.png); right: 110px; bottom: 110px; cursor: pointer; z-index: 160; text-indent: -999px }
a{color:#209cff}
a:hover{color:#fade5e;text-decoration:none}
a:focus{text-decoration:none}
h1{text-align:center;padding:40px 0}
h3{font-size:1.6rem;color:#333;padding:0;margin-top:0;margin-bottom:0;text-align:center;line-height:1.4;font-weight:500}
/*.container{margin:0 auto;padding:0 50px;}*/
hr.s-margin {margin: 0.6rem 0;}
#cht_wrapper{width:100%;background-color:#f6f6f6;margin:0 auto;padding:0;overflow-x:hidden}
.kv-zone{position:relative;width:100%;background-color: #000;text-align:center;padding:0}
.content .tab{/*position:absolute;height:75px;left:0;right:0;background:#fff;border-bottom:0;*/z-index:99}
.content .tab.pager-tab-icon {box-shadow: 3px 3px 3px #333;}
.content .tab.pager-tab-icon .iconic {margin-bottom: 0.4rem; width: auto;}
.content .tab.pager-tab-icon .iconic-hover {position: absolute; top: 22px; height:48px; display: none;}
.content .tab.pager-tab-icon a:hover .iconic-hover, .content .tab.pager-tab-icon .current .iconic-hover {display: block;}
.content .tab.pager-tab-icon a:hover .iconic, .content .tab.pager-tab-icon .current .iconic {opacity: 0;}
.content .tab.pager-tab-icon .current span {color: #209cff;}
.content .tab.tab-sticky ul.tab-wrap {line-height: 2.6rem; background: #e5e5e5; box-shadow: inset 3px 3px 3px #ccc;}
.content .tab.tab-sticky ul.tab-wrap:nth-child(2) {border-top: 1px solid #ccc; box-shadow: none;}
.content .tab.center-tab .tab-wrap {background: #f5f5f5;}
.content .tab a{position:relative;color:#666;font-size:0.8rem;border-bottom:0}
.content .tab a:hover{border-bottom:0;}
.content .tab a:hover span {color: #209cff;}
/* 230328 */
.tab.pager-tab-icon a {display: flex; padding-top: 1.2rem; padding-bottom: 1rem;}
.tab.pager-tab-icon a .iconic path {fill: #f5f5f5;}
.tab.pager-tab-icon a.current .iconic path, .tab.pager-tab-icon a:hover .iconic path {fill: none;}
.tab.tab-sticky ul.tab-wrap li a.active, .tab.tab-sticky ul.tab-wrap li a.current {color: #209cff;}

#tab_1,#tab_2,#tab_3,#tab_4{display:block;position:relative;top:-60px;visibility:hidden}
.kv-banner{position:relative;/*background:url(../images/kv-web.jpg) no-repeat top center #000;background-size:cover;*/height:400px;}
.kv-topic{position:absolute;left:calc(50% - 530px);top:22%;height:50%;color:#fff;text-align:left;letter-spacing: 0.6px;font-family: 'Helvetica', 'Noto Sans TC';z-index:29}
.kv-topic-date{font-size: 22px;padding: 4px 20px;border: 1px solid #fff;display: inline-block;border-radius: 40px;letter-spacing: 3px;}
.kv-topic-head{font-size: 52px;margin-top: 32px;line-height: 1.2;font-weight: 500;}
.kv-topic-second{font-size: 25px;margin-top: 15px;line-height: 1.4;}
.kv-topic-head span, .kv-topic-second span{display: block;}
.card-text{font-size:.9rem;font-weight:300;padding:20px 0 0;text-align:justify}
section.sec-60m{background: #fff;}
.mb-40{margin-bottom:40px}
td{background-color:#fff;color:#333;padding:10px;border:1px solid #ccc;text-align:center;vertical-align:middle; line-height: 1.4;}
.res-table{border-radius:0}
.res-table .fix-col{width:192px;overflow-x:hidden;}
.res-table .scolling-col .p_table th.head,.res-table .scolling-col .p_table td.head{display: none;}
.res-table .scolling-col .p_table td.month-head {visibility: hidden;}

.res-table .scolling-col{width:100%;margin-left:-100px;overflow-x:hidden}
.p_table{width:100%;display:table!important;font-size:0.9rem;white-space:nowrap}
.p_table th{background-color:#333;color:#fff;text-align:center;line-height:2.6rem;height: 3rem;font-weight: normal;}
.p_table td {height: 58px; line-height: 1.2; padding: .2rem;}
.p_table td.first-col {background-color: #f5f5f5;}
.sec-100m.container-light-a{background: #f5f5f5;}
.sec-300m.container-dark-a{background: #fff;}
.sec-service{background: #fff;}
.container-light-a.promote-video-sec {padding-top: 2rem;}
.owl-carousel{position:relative}
.tab .tab-container{width:auto;max-width:none}
.container-content {position: relative;}
.container-fluid{padding-top:1rem}
.container-fluid h1{font-size:2.2rem;color:#333;padding:0 0 1rem;margin-top:.4rem;position:relative}
.container-light-a{position:relative;background:#fff;color:#333; margin-top: 1px;}
.container-light-a h3{color:#333;float:none}
.container-dark-a{position:relative; background-color: #fafafa;}
.container-dark-a h3{color:#333;float:none}
.container-dark-b{position:relative}
.container-dark-b h3{color:#333;float:none}
.product{position:relative}
.container-300m{padding:40px 0 20px 0;}
.container-service{padding:40px 0 20px 0; display: flex;}
.service-icon {width: 166px;}
.service-txt h3 {text-align: left;}
.service-txt .h3-note {text-align: left; font-size: 0.9rem;}
.sweet-notice{line-height:1.8;font-size:1.1rem;word-break:break-all;text-align:justify}
.sweet-notice-sec {padding-bottom: 5rem;}
.sweet-notice h1{color:#333;font-size:1.6rem;padding-top:2.6rem}
/*.sweet-notice ol{margin-top:2rem}*/
.sweet-notice li{color:#333;font-size:.9rem;margin-bottom:4px}
.sweet-notice ul {margin-left: 10px;}
.container-100m, .container-60m, .container-single{padding:40px 0}
.card.product>a{color:#333}
.card.product .card-text.content-center{text-align:center}
/*.card.product .card-img{background:#fff;margin-top:0;width:100%;height: 280px; display: flex; justify-content: center; align-items: center;}
.card.product .card-img img{margin:0 auto;width:initial;width:auto}*/
/*.card .card-action.top-left{top:-.3rem;left:2rem}*/
/*.card .card-action .badge{border-radius:0;background:#ff874d;font-size:.9rem;width:110px;height:110px;border-radius:50%;padding-top:28px;margin-top:40px;line-height:25px;box-shadow:none}*/
.card .sub-name,.card .sub-content,.card .miniature{font-size:.9rem}
.card .sub-name{margin-top:1rem}
.card .sub-content{margin-bottom: 0.4rem;}
.card .miniature{margin-bottom:.5rem;color:#999}
/*.card,.card:hover{box-shadow:none}*/
.card.product{padding-bottom:1rem}
.vip-note{text-align:center;margin-top:1rem;font-size: 0.75rem;color: #666;}
.package-label{margin:0;padding:0;font-size:.85rem}
/*.package-label>ul {margin: 0;}*/
.package-label>ul>li{text-align:justify;line-height:1.2;margin-bottom: 0.6rem;color:#333;}
/*.package-label>ul>li:before{content:'●'; font-size: 12px; margin-right: 0.4rem; margin-top: 0.2rem; transform: scale(0.7);}*/
.package-label>ul>li>.label-title{margin-right:1rem;line-height:1.2;white-space: nowrap;font-weight: 500;}
.package-label>ul>li>span{color:#333;word-break: break-word;}
.package-label>ul>li:last-child {margin-bottom: 1rem;}
.sec-300m .package-label>ul>li {color: #333;}
.sec-60m .package-label>ul>li {color: #333;}
.p_table select{padding:0 1.5rem 0 1rem;border:0}
.filter-tab .filter-container{padding-bottom:0;margin-top:0;height:3rem;box-shadow:0 0 .6rem rgba(0,0,0,0.25);-webkit-box-shadow:0 0 .6rem rgba(0,0,0,0.25)}
.filter-tab .form-textual{height:3rem}
.filter-tab .form-textual span{text-align:center;font-size:1rem!important;height:3rem!important}
.filter-tab .form-textual.month-pay,.filter-tab .form-textual.year-period{width:90rem}
.filter-tab.apply-filter.desktop-only .form-textual .sub-menu{display:flex;flex-wrap:wrap;justify-content:space-between;padding:1rem .6rem;top:3.4rem}
.filter-tab.apply-filter.desktop-only .form-textual .sub-menu li{margin-bottom:.4rem;margin-right:.3rem}
.apply-filter .sub-menu-block .sub-menu a{cursor:pointer;color:#555;font-size:.8rem;-webkit-transition:all .1s;-o-transition:all .1s;transition:all .1s;display:inline-block;border:1px solid rgba(0,0,0,0.1);-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;border-radius:50px;padding:.1rem 1rem;text-align:center;background-size:24px;min-width:5.6rem;line-height:1.8}
.apply-filter .sub-menu-block .sub-menu a:hover{background:#fff;border:1px solid #209cff;color:#209cff}
.submit-select-section{background:#efefef;display:flex;flex-direction:row;align-items:center;justify-content:space-around;flex-wrap:nowrap}
.submit-select-section .filter-submit{width:100%;line-height:3rem;text-align:center;display:inline-block}
.submit-select-section a{color:#333;display:block}
.submit-select-section a:hover{color:#999}
.filter-tab .form-textual .old-discount{position:absolute;background:#efefef;text-align:center;margin:0;font-size:1.6rem;height:60px;width:210px;line-height:60px;border-radius:.6rem}
.filter-tab .form-textual .old-discount span{background:none!important;padding:0!important;font-size:2rem!important;color:#f83!important;margin-left:12px;line-height:60px}
.modal-dialog .modal-title {text-align: center;font-size: 0.9rem;font-weight: bold;}
.modal-dialog .modal-title span {color: #209cff;}
.modal-dialog .modal-footer {text-align: center;  padding-top: 0; border: 0;}
.modal-dialog .modal-footer .button{margin: 0.4rem 0;}
.modal-dialog label {font-size: 0.9rem; margin-bottom: 0.6rem; text-align: center; display: block;}
.apply-note {display: flex; flex-direction: row;}
.apply-note .card-wrapper {display: flex; flex-direction: column; padding: 0;}
.apply-note .card {display:block; padding-bottom: 0.4rem; box-shadow: none;}
.apply-note .card-title {padding: 0;}
.apply-note .card-title {font-size: 0.8rem;}
.fixed-action-area.always-on {z-index: 299; padding-bottom: 0.5rem;}
.video-container {position: relative;}
.video-wrapper {position: relative; padding-bottom: 56.25%; /* 16:9 */ padding-top: 0px; margin-top: 120px; height: 0; }
.video-wrapper iframe {position: absolute; top: 0; bottom: 0; left: 0; right: 0; width: 96%; height: 96%; margin: 0 auto; }
.promote-video-sec h3{color:#333;}
.slick-prev {left: -25px; top: 60%; width: 2.2rem; height: 2.2rem; z-index: 299; }
.slick-next {right: -25px; top: 60%; width: 2.2rem; height: 2.2rem; z-index: 299; }
.slick-prev:before, .slick-next:before {font-size: 2.2rem; border-radius: 50%; color: #ccc; width: 2.2rem; height: 2.2rem; }
.slick-prev:before {background: url(../images/arrow-left.png) #fff no-repeat center; background-size: 20%; content: ''; display: block; background-color: rgba(255, 255, 255, 0.8); -webkit-box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.25); box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.25); }
.slick-next:before {background: url(../images/arrow-right.png) #fff no-repeat center; background-size: 20%; content: ''; display: block; background-color: rgba(255, 255, 255, 0.8); -webkit-box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.25); box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.25); }
.slick-dots {margin: 0; bottom: -15px;}
.button-apply:hover, .button-apply:focus {color: #fff;}
.func-btn.unfixed {position: absolute; width: 100%;}

@media screen and (max-width: 767px) {
section#header{z-index:999}
section#header header{background:#fff}
.tab .tab-container:after{background:linear-gradient(90deg,rgba(255, 255, 255, 0.1) 10%,rgba(215, 215, 215, 0.75) 80%);}
.content .tab{height:auto}
/* .content .tab.pager-tab-icon .tab-wrap {justify-content: space-evenly;} */
.content .tab.pager-tab-icon a {margin-right: 20px; margin-left: 20px;}
.content .tab.pager-tab-icon a .iconic {height: 48px; max-width: none;}

.content .tab.pager-tab-icon .tab-container:after {display: none;}

#tab_4{top:0}
#event-float { right: 15px; bottom: 170px; }
#gotop { bottom: 130px; right: 15px; background-size: cover; width: 48px; height: 48px }
/*.container{margin-bottom:0;padding:0}*/
.kv-banner{position:relative;height:0;padding-top:133.33%;/*background:url(../images/kv-mobile.jpg) no-repeat top center;background-size:contain*/}
.kv-topic{position:absolute;bottom:32px;left:0;right:0;top:auto;height:auto;text-align:center;z-index:29}
.kv-topic-date {font-size: 15px;padding: 4px 10px;}
.kv-topic-head {font-size: 32px;margin-top: 10px;}
.kv-topic-second {font-size: 17px;margin-top: 12px;}
td{padding:5px}
.p_table{font-size:.8rem}
.res-table .fix-col.package-table {width: 190px; z-index: 19;}
.res-table .scolling-col {overflow-x: scroll; width: calc(100% - 113px); margin-left: -75px;}
ol,ul{margin:0 24px}
h1{padding:20px 0}
h3{font-size:1.6rem;text-align:center}
h3 span{float:none; display: block;}
.row{margin-left:0;margin-right:0}
.h3-note {font-size: 0.85rem;}
/*.sec-300m.container-dark-a{background-size:cover}*/
.container-fluid{margin-top:0;padding-bottom: 4rem;}
.container-fluid h1{font-size:1.4rem;padding:0;margin-top:.2rem;line-height:1.2}
.container-300m, .container-100m, .container-60m, .container-single{padding:0}
.container-100m .card-wrapper{padding:0 .2rem}
.card .sub-name,.card .sub-content,.card .miniature{font-size:.8rem}
/*.card .card-action.top-left{top:-.5rem;left:.3rem}
.card .card-action .badge{font-size:1rem}*/
/*.card.product .card-img {padding:0}
.card.product .card-img img{padding-top:1rem}*/
.video-wrapper {margin-top: 0;}
/*section.sec-60m{background:url(../images/t-01-bg-m.png) no-repeat top;background-size:cover;margin-top:60px}*/
.sec-100m.container-light-a {padding-top: 2rem;}

.service-icon img {width: 90px;}
.container-service {display: block;}
.container-service h3 {padding-right: 0; display: inline-block;}
.container-service .service-txt {margin-top: 1rem;}
.container-service .service-txt .h3-note {text-align: justify;}

.sweet-notice{line-height:1.6;padding:0;font-size:.9rem}
/*.sweet-notice .row{padding:0;margin-bottom:0}*/
.sweet-notice ol {margin:10px 10px 20px 32px}
.sweet-notice ol li{font-size:.8rem}
.sweet-notice ul {margin-top: 10px;}
.table-responsive {border: 0; padding: 0;}
.p_table th, .p_table td{font-size:.8rem;line-height:1.2rem;padding: 0.2rem 1rem;}

.container-300m h3{font-size:1.6rem;padding:0}
.package-label {padding: 0;}
.package-label>ul>li {line-height: 1.4rem; margin-bottom: 0.8rem;text-align:left;}
.package-label>ul>li>.label-title {display: block;}
/*.package-label>ul>li>span {margin-left: 1rem; padding-right: 1rem;}*/
.package-label span{/*padding-left: 1rem;*/ display:block;}
.owl-theme .owl-nav {display: none;}
.card-wrapper {padding: .5rem .4rem;}
.old-select{margin-left:-40px;margin-right:-40px}
.filter-tab.mobile-only{z-index:99}
.filter-tab.mobile-only .form-textual .old-discount{position:relative; background: none;width:100%; text-align: left;/*height:50px;line-height:50px;margin-top: 8px;*/}
.filter-tab.mobile-only .form-textual .old-discount span{font-size:1.8rem!important;margin:0;/*display:block*/}
.filter-tab.mobile-only .form-textual span{padding-left:1rem;border:none;color:#333;cursor:pointer;background-position:right center;padding-right:calc(.3rem + 24px);background:url(https://www.cht.com.tw/home/eshop/img/form/arrow_down.svg) right 1.6rem center no-repeat;font-size:.8rem!important;height:2.6rem!important;line-height:2.6rem;white-space:nowrap}
.filter-tab.mobile-only .form-textual .form-check input[type=checkbox]{height:1.4rem}
.filter-tab.mobile-only .form-textual .form-check label{font-weight:400;font-size:.875rem;line-height:1.8}
.filter-tab.mobile-only .form-textual small{font-size:.8rem}
.filter-tab.mobile-only .form-textual .sub-menu{border:none;position:absolute;top:6rem;left:0;margin:0;padding:.4rem 1rem;width:100%;background:#fff;-webkit-box-shadow:0 .8rem 1rem rgba(0,0,0,0.1);box-shadow:0 .8rem 1rem rgba(0,0,0,0.1);-webkit-transition:all .2s;-o-transition:all .2s;transition:all .2s;z-index:12;display:block;height:0;opacity:0;-webkit-transform:scale(0.95);-ms-transform:scale(0.95);transform:scale(0.95);font-size:.875rem;display:none}
.filter-tab.apply-filter.mobile-only .form-textual .sub-menu-block{z-index:99}
.filter-tab.apply-filter.mobile-only .form-textual .sub-menu{padding:1rem .6rem}
.filter-tab.apply-filter.mobile-only .form-textual .sub-menu li{margin-bottom:.4rem;margin-right:.2rem}
.filter-tab.mobile-only .form-textual .sub-menu.one-third{width:374px}
.filter-tab.mobile-only .form-textual .sub-menu.one-forth{width:100%}
.filter-tab.mobile-only .form-textual .sub-menu li{font-size:.8rem;padding:0;border:none;list-style:none}
.filter-tab.mobile-only .form-textual .sub-menu a{display:block;padding:.5em 0;line-height:1.5;color:#333}
.filter-tab.mobile-only .form-textual .sub-menu a:hover{color:#209cff;text-decoration:none}
.filter-tab.mobile-only .form-textual:hover .sub-menu{display:flex;flex-wrap:wrap;justify-content:space-between;height:auto;opacity:1;-webkit-transform:scale(1);-ms-transform:scale(1);transform:scale(1);overflow:visible;z-index:199}
.filter-tab .filter-container{height:2.6rem;line-height:2.6rem}
.filter-tab .form-textual.month-pay,.filter-tab .form-textual.year-period{width:20rem}
.filter-tab .form-textual,.submit-select-section .filter-submit{background: none;height:2.6rem;line-height:2.6rem;font-size:.8rem;}
.filter-tab .form-textual.submit-select-section {margin-bottom: 0.6rem;}
.submit-select-section .filter-submit {text-align: right; margin-right: 1rem;}

}


@media screen and (max-width: 350px) {
.container-fluid h1{font-size:1.4rem}
}


/* 230411 begin */
@media screen and (max-width: 767px) {
    .sm_menu_outer.active .mobile_menu{margin: 0;}
}

@media screen and (max-width: 767px) {
html {font-size: 17px;}
.accordian-group .accordian-title, .accordian-group-only-one .accordian-title {font-size: .85rem; line-height: 1.5;}
section.footer .footer-label {font-size: 7vw;}
section.footer .container .accordian-group-footer {padding-left: 1.2rem; padding-right: 1.2rem;}
section.footer .h6.accordian-title {font-size: 1.2rem; border-bottom: 0; margin-top: 0;}
section#footer .footer-site-links .miniature {color: rgba(0,0,0,0.5); margin-top: 10px;}
}
/* 230411 end */