.inlineBlockSpacing {
     letter-spacing: -0.31em; /* Webkit: collapse white-space between units */
    *letter-spacing: normal; /* reset IE < 8 */
    *word-spacing: -0.43em; /* IE < 8: collapse white-space between units */
    text-rendering: optimizespeed; /* Webkit: fixes text-rendering: optimizeLegibility */
    
}


#mtkContainer,
#mtkContainer * { box-sizing: border-box; }


.pageMenu { position: sticky; top:0; left: 0; padding: 5px 0; height: 50px;  width: 100%; text-align: center; z-index: 100;
	background: rgba(203,29,29,0.8);overflow: hidden;overflow-y: hidden; overflow-x:auto;-webkit-overflow-scrolling: touch;overflow-scrolling: touch; }
.pageMenu ul { position:relative; width: 100%; z-index: 10; padding: 0px; white-space:nowrap; width:auto; border-radius: 0; }
.pageMenu li { display: inline-block; padding: 0 10px; font:18px/40px "arial","微軟正黑體"; color: #fff; cursor: pointer; transition: .5s; }
.pageMenu li img { vertical-align: top; }
.pageMenu li:hover { background:#000; }

header.header { position: relative; margin-top: -49px; width: 100%; height: 622px; background:url(../images/header-bg-a.jpg) top center no-repeat; }
header.header .cloud { position: absolute; left: 0; bottom: -3px; width: 100%; overflow: hidden;}
header.header .cloud .cloudAni {animation: creatBallOn4 10s alternate infinite;;-webkit-animation: creatBallOn4 10s alternate infinite;; }
@keyframes creatBallOn4 {
  0%{  transform: translateX(0);}
  100%{  transform: translateX(-50px);}
}
@-webkit-keyframes creatBallOn4 {
  0%{  transform: translateX(0);}
  100%{  transform: translateX(-50px);}
}

.mHeader { display: none; }



.contentBase { margin: 0 auto; width: 95%; max-width: 1400px; }

h1 { font-size: 0; display: none; opacity: 0; }
h2 { padding: 20px 0 30px 0; text-align: center; }
h2 img { width: 220px; }


.group-type-ph { letter-spacing: -0.31em; *letter-spacing: normal;*word-spacing: -0.43em;text-rendering: optimizespeed;  }
.ph { display: inline-block; margin-bottom: 30px; padding-right: 35px; width: 50%; letter-spacing: normal; }
.ph .ph-img { display: inline-block; width: 50%; float: left; overflow: hidden;}
.ph .ph-img img { width: 100%; transition: .5s; }
.ph .ph-title,
.ph .ph-detail,
.ph .ph-feature { display: inline-block; padding-left: 10px; width: 50%; float: right; vertical-align: top; }

.ph .ph-title { font:18px/1.4 "arial","微軟正黑體"; color: #b01d23; }
.ph .ph-detail,
.ph .ph-feature { font:15px/1.4 "arial","微軟正黑體"; color: #000;}
.ph a { text-decoration: none; }
.ph em.price { display: block; text-align: right; clear: both; transform: translateY(-24px); font: bold 16px/28px "arial","微軟正黑體"; color: #b01d23;  }
.ph em.price span {font: bold 22px/28px "arial","微軟正黑體";}
.ph em.price i{font-style: normal;}
.ph .ph-img:hover img { transform: scale(1.05); }




.pinkBg { padding: 50px 0; width: 100%; background: #eee7e7 ; overflow: hidden;}

.contentBase .carrier {  position: relative; width:100%; margin: 0; padding: 40px 0; height: auto; text-align: center;  }
.contentBase .carrier .box-head ,
.intro-anchors { display: none; }
.contentBase .carrier ul { position: relative; margin: 0 auto 0px auto; width: 100%;  }
.contentBase .carrier ul li { position: relative; width: 100%; margin: 20px 0 0px 0; padding: 0 20px; text-align: left; letter-spacing: 0; transition: .5s; }
.contentBase .carrier ul li a {font:14px/28px "arial","微軟正黑體"; color: #000; text-decoration: none; }
.contentBase .carrier ul li a strong {font: 22px/28px "arial","微軟正黑體"; display: block;color: #b01d23; }
.contentBase .carrier ul li em { position: absolute;bottom: 0; right: 30px;font: bold 16px/28px "arial","微軟正黑體"; color: #b01d23; }
.contentBase .carrier ul li em span {font: bold 22px/28px "arial","微軟正黑體";}
.contentBase .carrier h4 { display: inline-block; margin: 0; padding: 0 30px 15px 30px; ; font: 32px/32px "arial","微軟正黑體"; text-align: center; letter-spacing: 1px; border-bottom: 1px solid #b01d23; }
.carrier h4 span { padding: 5px; color: #fff; border-radius: 99em; background:#b01d23; }

.contentBase .carrier:nth-child(odd) { background:#b01d23;  }
.contentBase .carrier:nth-child(odd) h4 { font: 32px/32px "arial","微軟正黑體"; text-align: center; color: #fff; letter-spacing: 1px; border-bottom: 1px solid #fff; }
.carrier:nth-child(odd) h4 span { padding: 5px; color: #b01d23; border-radius: 99em; background:#fff; }
.contentBase .carrier:nth-child(odd) ul li a { color: #fff;  }
.contentBase .carrier:nth-child(odd) ul li a strong { display: block;color: #fff; }
.contentBase .carrier:nth-child(odd)::after { content: ""; position: absolute; top:0; right: -100%; width: 100%; height: 100%; background:#b01d23; }
.contentBase .carrier:nth-child(odd) ul li em { color: #fff; }

.contentBase .carrier:nth-child(4n+1)::after { content: ""; position: absolute; top:0; left: -100%; width: 100%; height: 100%; background:#b01d23; }

.contentBase .carrier ul li:hover { transform: translateY(-10px); }



/*#b,#c { display: none; }*/


.change{display: none;}
.change.on{display: block;}


@media only screen and (max-width: 768px) {
header.header { height: auto; background:none; }
header.header .cloud { display: none; }
.mHeader { display: block;  width: 100%;}



}

@media only screen and (max-width: 500px) {



.ph { display: inline-block; margin-bottom: 10%; padding-right: 0; width: 100%;  }
.ph .ph-detail,
.ph .ph-feature { font:14px/1.4 "arial","微軟正黑體"; color: #000;}
.ph em.price { transform: translateY(0); }

.contentBase .carrier ul li { padding-bottom: 10%;}

}


.more {text-align: center; padding-bottom: 80px;}
.more a{display: inline-block;
    background: #b01d23;
    color: white;
    padding: 10px 30px;
    border-radius: 5em;
    font-size: 20px;
    transition: 0.2s;
    }
.more a:hover{filter: brightness(1.2);}