@charset "UTF-8";

/* 寬頻申請流程改版 */
.tab-steps-broadband-order .card-progress {background: #fff; width: 50%; margin: 0 auto; border-bottom: 0;}
.tab-steps-broadband-order .card-progress .cht-progress-bar {top: 20px;}
.tab-steps-broadband-order .card-progress .cht-progress-wrapper .cht-progress-content .progress-unit .progress-dot {width: 1.6rem; height: 1.6rem; font-family: arial; font-size: 0.8rem; color: #fff; margin-bottom: 0.4rem; line-height: 1.6rem;}

.container-broadband-order.without-padding {padding: 0 0 2rem 0;}
.container-broadband-order section {padding: 0;}
.container-broadband-order .card, .container-broadband-order .card:hover {-webkit-box-shadow: 0rem 0rem 0.6rem rgba(0, 0, 0, 0.25); box-shadow: 0rem 0rem 0.6rem rgba(0, 0, 0, 0.25);}
.container-broadband-order .card .show-item {margin: 0 auto; padding: 1.6rem;}
.container-broadband-order .tab {border-bottom: 0;}
.container-broadband-order .tab .tab-wrap {line-height: 2.2rem;}
.container-broadband-order .tab .tab-wrap a {padding: 0 1.2rem;}
.container-broadband-order .tab .tab-wrap a.current {color: #209cff;}
.container-broadband-order .tab .tab-container {width: 100%;}
.container-broadband-order .in-page-tab-content .in-page-tab {padding-top: 2rem; font-size: 0.75rem; width: 750px;}
.container-broadband-order article .form-textual label {margin-bottom: 0.4rem;}
.container-broadband-order input, .container-broadband-order select {padding: 0.5rem !important; width: 100%;}
.container-broadband-order .form-textual .description {margin-top: 0.5rem; margin-bottom: 0; font-size: 0.75rem;}
.container-broadband-order input#ValidateCode {width: 100%;}
.container-broadband-order input.disabled {border: none; color: #666;}
.container-broadband-order label[data-cht-radio] i.data-symbol, .container-broadband-order label[data-cht-radio] input:checked~i.data-symbol, .container-broadband-order label[data-cht-checkbox] i.data-symbol, .container-broadband-order label[data-cht-checkbox] input:checked~i.data-symbol {background-size: contain;}
.container-broadband-order .button {min-width: 164px; box-shadow: none;}
.container-broadband-order .button-gray {background: #fff; color: #666; border: 1px solid #ccc;}

.container-broadband-order .compare-bar-chart .chart-unit {padding: 1rem 0;}
.container-broadband-order .compare-bar-chart .h4 {font-size: 0.9rem;}
.container-broadband-order .card.is-big-card .speed-table {padding: 0 2rem 2rem 2rem;}
.container-broadband-order .card.is-big-card .speed-table-list {position: relative; padding-top: 0.8rem; border-bottom: 1px solid #e5e5e5;}
.container-broadband-order .card.is-big-card .speed-table-note {padding-top: 0.6rem;}
.container-broadband-order .card.is-big-card .speed-table-list .h4 {font-size: 0.9rem;  font-weight: normal;}
.container-broadband-order .speed-th {background: #f5f5f5; padding-top: .4rem; padding-right: 0;}
.container-broadband-order .speed-th .is-subtilte {margin: 0 auto 0.4rem auto;}
.container-broadband-order #speedBlock .card.is-big-card .card-text {position: relative;}
.container-broadband-order .just-center {justify-content: center;}
.container-broadband-order .is-big-card .is-stubborn .neko.is-1, .container-broadband-order .is-big-card .is-stubborn .neko.is-2, .container-broadband-order .is-big-card .is-stubborn .neko.is-3 {align-self: inherit;}
.container-broadband-order .speed-tag {/*position: absolute; top: 34px; left: 415px; */line-height: 0.8;}
.container-broadband-order .speed-tag>span {font-size: 0.6rem; border-radius: 2px; padding: 0rem 0.4rem; line-height: 1.6; color: #fff; white-space: nowrap; display: inline-block;}
.container-broadband-order .speed-tag-orange {background: #ff874d; border: 1px solid #ff874d;}
.container-broadband-order .speed-tag-blue {background: #209cff; border: 1px solid #209cff;}
.container-broadband-order .speed-tag span.speed-tag-white {color: #666; border: 1px solid #ccc;}

.container-broadband-order .speed-pkg-title {font-size: 1.6rem; margin-top: 0.6rem; font-weight: normal; font-family: arial,'Microsoft JhengHei';}
.container-broadband-order .speed-pkg-title span {font-size: 0.8rem;}
.container-broadband-order .card-list .card-wrapper {padding: .5rem .8rem 1.5rem .8rem;}
.container-broadband-order .card-list .card .card-img {min-height: 86px;}
.container-broadband-order .card-list .card ul {line-height: 1.6rem;}
.container-broadband-order .card-list .card-img + .card-text > .content-center {margin-top: 0;}
.container-broadband-order .card-list .h3 {font-size: 1.6rem; font-weight: normal; font-family: arial,'Microsoft JhengHei';}
.container-broadband-order .card-list .h3 span {font-size: 0.8rem;}
.container-broadband-order .card-list .button {padding: 0.4rem;}

.container-broadband-order .card.is-big-card.accordian-group {margin-bottom: 1.6rem; font-size: 0.85rem; overflow: visible;}
.container-broadband-order .card.is-big-card.accordian-group article>label {font-weight: bold;}
.container-broadband-order .card.is-big-card.accordian-group ul {list-style: none; margin-left: 0; left: 0;}
.container-broadband-order .card.is-big-card.accordian-group ul li {padding-bottom: 0.6rem;}
.container-broadband-order .accordian-group.alt.active .accordian-title {background: url(https://www.cht.com.tw/home/eshop/img/plus-outline.svg) left 0 center no-repeat; background-size: 1rem; padding-left: 36px; color: #333;}
.container-broadband-order .accordian-group.alt .accordian-title {background: url(https://www.cht.com.tw/home/eshop/img/minus-outline.svg) left 0 center no-repeat; background-size: 1rem;padding-left: 36px; color: #209cff;}

.container-broadband-order .vas-apply-mod-note {font-size: 0.7rem; padding-left: 32px;}
.container-broadband-order .card.is-big-card.accordian-group .button {padding: 0.4rem 2rem; min-width: unset; min-width: auto;}
.container-broadband-order .icon-help-solid {background-image: url(../images/icon-info.svg); height: 24px; width: 24px; display: inline-block; background-size: cover; }
.container-broadband-order .filter-tab {width: 100%;}
.container-broadband-order .filter-tab .filter-container {box-shadow: none; border-bottom: 1px solid #eee; border-radius: 0; }
.container-broadband-order .card.is-big-card .nekos .neko.is-3 {align-items: center;}
.container-broadband-order .filter-tab.desktop-only .form-textual .sub-menu {top: 2.4rem; -webkit-box-shadow: 0rem 0rem 0.6rem rgba(0, 0, 0, 0.25); box-shadow: 0rem 0rem 0.6rem rgba(0, 0, 0, 0.25); border-radius: 12px;}
.container-broadband-order .filter-tab.desktop-only .form-textual .sub-menu li {border-bottom: 1px solid #eee; padding-bottom: 0;}
.container-broadband-order .filter-tab.desktop-only .form-textual .sub-menu li:last-child {border-bottom: 0;}
.container-broadband-order .filter-tab.desktop-only .form-textual .sub-menu li span {background: none; padding: 0.4rem 0;}
.container-broadband-order .filter-tab.desktop-only .form-textual .sub-menu a {padding: 0.2rem 0;}

.container-broadband-order .fill-birth {width: 98%; white-space: nowrap;}
.container-broadband-order .fill-contact label {font-size: 0.8rem; margin-right: 1rem;}
.container-broadband-order .fill-contact-add label {margin-right: 1rem; line-height: 2.6;}
.container-broadband-order .fill-contact-add label.other-add {width: 100%;}
.container-broadband-order .fill-contact-add .nekos {line-height: 1.6;}
.container-broadband-order .fill-contact-add .form-textual input[type=text] {background: #f5f5f5; width: calc(100% - 30px); color: #ccc; border-color: #e5e5e5; white-space: nowrap; pointer-events: none;}
.container-broadband-order .fill-contact-add .form-textual input[type=radio]:checked~.other-add {background: #fff; color: #666; border-color: #ccc; pointer-events: all;}

.container-broadband-order .card.is-big-card .is-2 .h4 {color: #999;}
.container-broadband-order .card.is-big-card .is-2 .h4 strong {color: #333;}
.container-broadband-order .card.is-big-card .is-light {font-weight: normal !important; line-height: 1.2;}
.container-broadband-order .card.is-big-card .card-text {padding: 1.6rem 2rem 1.6rem 2rem;}
.container-broadband-order .broadband-order-info  .form-group {margin-bottom: 0.6rem;}
.container-broadband-order .broadband-order-info .card.is-big-card .nekos .neko {border-bottom: 1px solid rgba(0, 0, 0, 0.1);}
.container-broadband-order .broadband-order-info .card.is-big-card .nekos .neko .h4 {font-size: 0.8rem; margin-bottom: 0.6rem;}

section.footer-v2 {padding: 1rem 0;}
section.footer-v2 .official-links {margin-top: 0;}
section.footer-v2 .nekos {justify-content: space-between; align-items: center;}
section.footer-v2 .official-links a {margin-left: -1rem;}
section.footer-v2 .official-links a img {height: 32px;}
section.footer-v2 .miniature {margin: 0;}

@media screen and (max-width: 767px) {
	.tab-steps-broadband-order .card-progress {background: #fff; width: 100%; margin: 0 auto; border-bottom: 0;}
    .tab-steps-broadband-order .card-progress .cht-progress-wrapper {position: relative; padding: 1rem;}
    .tab-steps-broadband-order .card-progress .cht-progress-wrapper .cht-progress-content {position: relative; z-index: 2; display: -webkit-box; display: -ms-flexbox; display: flex; width: 100%; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; flex-direction: row; }
    .tab-steps-broadband-order .card-progress .cht-progress-bar {position: relative; top: 16px; background: #D6D6D6; height: 2px; display: -webkit-box; display: -ms-flexbox; display: flex; width: calc( 100% - 85px); margin: 0 auto; }
    .tab-steps-broadband-order .card-progress .cht-progress-bar .cht-progress-bar-unit {height: 3px; display: block; -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1;}
    .tab-steps-broadband-order .card-progress .cht-progress-bar .cht-progress-bar-unit.blue {background: #209cff;}
    .tab-steps-broadband-order .card-progress .cht-progress-wrapper .cht-progress-content .progress-unit {width: 100px; text-align: center;}
    .tab-steps-broadband-order .card-progress .cht-progress-wrapper .cht-progress-content .progress-unit .progress-name {display: block;}
    .tab-steps-broadband-order .card-progress .cht-progress-wrapper .cht-progress-content .progress-unit .progress-time {display: none;}
    .tab-steps-broadband-order .card-progress .cht-progress-wrapper .cht-progress-content .progress-unit .progress-dot {width: 1.8rem; height: 1.8rem; color: #fff; margin-bottom: 0.4rem;}

    .container-broadband-order .speed-tag {display: none;}
    .container-broadband-order .card.is-big-card .card-text {padding: 1.2rem 1rem;}
    .container-broadband-order .card .show-item {padding: 1rem; width: 100%;}
    .container-broadband-order .in-page-tab-content .in-page-tab {width: 100%;}
    .container-broadband-order .captchavalidation .nekos {display: flex;}
    .container-broadband-order .captchavalidation .nekos .is-5 {margin-left: 1rem;}
    .container-broadband-order .vas-apply-buy select {border: 0; border-bottom: 1px solid #eee; padding: 0 !important; font-size: 0.8rem; height: 2.2rem; width: 95%; border-radius: 0; margin-bottom: 0.4rem; }
    .container-broadband-order .filter-tab .filter-container {border: 0;}

    .container-broadband-order .fill-birth .is-4 {width: 33%; }

    .container-broadband-order .broadband-order-info .card.is-big-card .nekos {border-bottom: 1px solid rgba(0, 0, 0, 0.1);}
    .container-broadband-order .broadband-order-info .card.is-big-card .nekos .neko {border: 0;}
}