@charset "shift_jis";
/*==============================================
common
============================================= */
.forSP {
display: none !important;
}
#header {
border-bottom: #ededed solid 1px;
}
.headerIn{
width: 890px;
margin: 0 auto;
}
.footerIn {
width: 930px;
margin: 0 auto;
}
.copyRight { border-top: 1px solid #ededed; }
#footer { margin-top: 10px; }
.pageTop { border-radius: 50%; }


#mainContents {
font-family: '游ゴシック Medium', '游ゴシック体', 'Yu Gothic Medium', YuGothic, 'ヒラギノ角ゴ ProN', 'Hiragino Kaku Gothic ProN', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
font-feature-settings: "palt"1;
letter-spacing: 0.05em;
}
em {
font-style: normal;
}
img {
display: block;
width: 100%;
}


/*==============================================
看板
============================================= */
.mainTitleWrap {
position: relative;
}
.mainTitleWrap:before {
display: block;
content: "";
width: 100%;
height: 352px;
background: linear-gradient(to left, transparent 60%, #f0f0f0 60%);
position: absolute;
top: 0;
}
.mainTitle {
width: 100%;
height: 422px;
background: url(https://img1.kakaku.k-img.com/images/article/tieup/23/10_huawei/titlebg.gif) center top no-repeat;
padding: 35px 0 0;
box-sizing: border-box;
z-index: 1;
position: relative;
}
h1 {
background: url(https://img1.kakaku.k-img.com/images/article/tieup/23/10_huawei/maintitle.png) center 0 no-repeat;
height: 370px;
text-indent: -999em;
font-size: 0;
z-index: 2;
margin: 0 auto;
position: relative;
}
.lead {
width: 890px;
margin: 40px auto 0;
}
.lead p {
font-size: 16px;
line-height: 2;
}
.lead a:link,
.lead a:visited {
color: #d0021a;
text-decoration: underline;
}
.lead a:hover,
.lead a:active {
color: #ff001e;
}


/*==============================================
メニュー
============================================= */
.contentsNavi {
width: 100%;
background: linear-gradient(to right, #fff 50%, #1e1e1e 50%);
margin: 55px auto 0;
position: relative;
}
.contentsNavi:before {
content: "";
display: block;
width: 100%;
height: 200px;
background: url(https://img1.kakaku.k-img.com/images/article/tieup/23/10_huawei/menubg.png) no-repeat center center;
position: absolute;
}
.contentsNavi ul {
width: 890px;
height: 200px;
background: url(https://img1.kakaku.k-img.com/images/article/tieup/23/10_huawei/icon_index.png) no-repeat 0 center;
margin: auto;
padding: 35px 0 0 80px;
box-sizing: border-box;
position: relative;
index: 1;
box-sizing: border-box;
}
.contentsNavi li {
margin: 14px auto;
}
.contentsNavi li:before {
content: "";
display: inline-block;
width: 18px;
height: 12px;
background: url(https://img1.kakaku.k-img.com/images/article/tieup/23/10_huawei/arrow.png) no-repeat 0 0;
margin-right: 12px;
}
.contentsNavi li a {
font-size: 16px;
color: #fff;
transition: all ease .3s;
}
.contentsNavi li a em {
display: inline-block;
width: 100px;
}
.contentsNavi li a:hover {
opacity: .6;
}


/*==============================================
バナー
============================================= */
.topbnr a {
display: block;
width: 588px;
height: 68px;
background: #d0021a;
border-radius: 68px;
font-size: 14px;
color: #fff;
line-height: 1.4;
text-align: center;
margin: 40px auto 0;
padding: 17px 0 0;
box-sizing: border-box;
position: relative;
transition: all ease .3s;
}
.topbnr a:after {
content: "▼";
display: block;
font-size: 13px;
transform: rotate(-90deg);
position: absolute;
top: 50%;
right: 15px;
margin-top: -8px;
}
.topbnr a:hover {
background: #ff001e;
}

.innerbnr {
width: 100%;
height: 200px;
background: linear-gradient(to left, #1e1e1e 50%, #f0f0f0 50%);
margin: 110px auto 0;
}
.innerbnr a {
display: block;
width: 890px;
height: 200px;
background: url(https://img1.kakaku.k-img.com/images/article/tieup/23/10_huawei/innerbnr.jpg) no-repeat 0 0;
margin: auto;
position: relative;
}
.innerbnr a dt {
display: none;
}
.innerbnr a dd {
width: 145px;
height: 120px;
background: #d0021a;
border-radius: 10px;
font-size: 17px;
color: #fff;
line-height: 1.6;
text-align:justify;
padding: 22px 26px 0;
box-sizing: border-box;
position: absolute;
top: 50%;
right: 0;
margin-top: -60px;
transition: all ease .3s;
}
.innerbnr a dd:after {
content: "▼";
display: inline-block;
font-size: 13px;
transform: rotate(-90deg);
position: absolute;
margin: 2px 0 0 8px;
}
.innerbnr a:hover dd {
background: #ff001e;
}


/*==============================================
#mainContents
============================================= */
.paragraph {
padding: 95px 0 0;
}
.paragraphIn {
width: 890px;
margin: 0 auto;
}
.paragraph h2 {
font-size: 28px;
font-weight: bold;
line-height: 1.7;
text-align: center;
margin: 0 auto 80px;
}
.paragraph h2 em {
display: block;
width: 130px;
height: 46px;
background: #1e1e1e;
font-size: 23px;
font-weight: normal;
color: #fff;
line-height: 48px;
margin: 0 auto 25px;
}
.paragraph h2 sup {
font-size: .4em;
margin: 0 -2px 0 0;
}
.paragraphIn p {
font-size: 17px;
line-height: 1.8;
margin-top: 30px;
}
.paragraphIn p em {
display: inline;
background: #dfdfdf;
font-weight: bold;
}


/*----　画像 ----*/
.imgBox {
width: 890px;
margin: 80px auto;
overflow: hidden;
}
.imgBox div {
overflow: hidden;
}
.imgBox a {
display: block;
}
.imgBox a:hover img {
cursor: zoom-in;
}
.imgBox h3 {
font-size: 22px;
font-weight: bold;
border-left: 11px solid #1e1e1e;
padding: 8px 0 6px 12px;
margin-bottom: 20px;
}
.imgBox strong {
display: block;
font-size: 17px;
margin-bottom: 10px;
}
.imgBox .cap {
font-size: 14px;
margin-top: -2px;
}
.imgBox div + .cap,
.imgBox div + div {
margin-top: 20px;
}

.box1 a {
width: 550px;
float: left;
}
.box1 .cap {
width: 320px;
float: right;
}

.box2 a {
width: 435px;
float: left;
}
.box2 a:nth-of-type(2) {
width: 435px;
float: right;
}
.box2 div .cap {
width: 435px;
float: right;
}

.box3 a {
width:290px;
float: left;
margin-right: 10px;
}
.box3 a:last-child {
float: right;
margin: 0;
}

.box4 div {
text-align: center;
}
.box4 div a {
display: inline-block;
margin: 0 8px;
}
.box4 a img {
width: auto;
height: 366px;
}
.box4 a:nth-of-type(2) img {
border: 1px solid #d6d1d1;
box-sizing: border-box;
}

.box5 {
width: 440px;
}
.box5 div {
margin: 0;
}
.box5 a {
width: 210px;
float: left;
}
.box5 a img {
border: 1px solid #d6d1d1;
box-sizing: border-box;
}
.box5 .cap {
width: 210px;
float: right;
}


/*----　動画 ----*/
video { 
outline: none;
}
.movBox {
width: 700px;
margin: 100px auto 0;
}
.movBox .mov {
width: 700px;
height: 394px;
margin-bottom:10px;
}


/*==============================================
.productBox
============================================= */
.productBox {
background: #ebebeb;
margin: 110px auto 0;
padding: 70px 0 90px;
}
.productBox h2 {
width: 444px;
height: 33px;
background: url(https://img1.kakaku.k-img.com/images/article/tieup/23/10_huawei/prd_title.png) center 0 no-repeat;
text-indent: -999em;
font-size: 0;
margin: 0 auto;
}
.productBox h3 {
width: 182px;
height: 44px;
background: #1e1e1e;
font-size: 22px;
color: #fff;
text-align: center;
line-height: 46px;
margin: 55px auto 0;
}
.productBox .wrap {
width: 930px;
margin: auto;
}
.productBox ul {
display: flex;
flex-flow: row wrap;
justify-content: space-between;
margin: 30px auto 0;
}
.productBox li {
width: 296px;
background: #fff;
text-align: center;
padding: 20px 18px 30px;
box-sizing: border-box;
}
.productBox li dt {
font-size: 16px;
font-weight: bold;
margin: 15px auto 0;
}
.productBox li dd {
width: 100%;
height: 50px;
background: #d0021a;
border-radius: 50px;
font-size: 14px;
color: #fff;
line-height: 52px;
margin: 15px auto 0;
box-sizing: border-box;
position: relative;
transition: all ease .3s;
}
.productBox li dd:after {
content: "▼";
display: inline;
font-size: 11px;
transform: rotate(-90deg);
position: absolute;
margin: 0 0 0 5px;
}
.productBox li:hover dd {
background: #ff001e;
}

.productBox .note {
font-size: 12px;
margin: 70px auto 0;
}


/*==============================================
.releasedate
============================================= */
.releasedate {
font-size: 11px; 
color: #333;
width: 930px; 
margin: 100px auto 0; 
text-align: right;
}