@charset "shift_jis";

/*==============================================
 common
============================================= */
.pc {
display:none;
}
#header {
border-bottom: #ededed solid 1px;
}
.copyRight { border-top: 1px solid #ededed; }
.pageTop {
width: 40px;
height: 40px;
right: 10px;
background-size: 40px;
border-radius: 50%;
}
img {
width: 100%;
height: auto;
}

/*==============================================
 Šล”ย
============================================= */
h1 {
padding-top: 88%;
margin: 0 auto;
background: url(https://img1.kakaku.k-img.com/images/article/tieup/23/12_iflytek/sp_main.jpg) no-repeat center top;
background-size: 100%;
text-indent: -999em;
font-size: 0;
}
p.lead {
font-size: 1.3rem;
line-height: 1.7;
padding: 0 2.0rem 2.5rem;
}
p.lead a {
display: inline!important;
color: #187ed3!important;
text-decoration: underline;
}

sup{
font-size:0.8rem!important;
}
.notes {
font-size: 0.8rem;
line-height:1.3;
display: block;
margin-top: 1rem;
}


/*==============================================
 ƒoƒi[
============================================= */
.topbnr {
margin: 0.8rem 2.8rem 2.7rem;
}
.topbnr a {
    display: block;
    font-size: 1.2rem;
    letter-spacing: 0.06rem;
    font-weight: bold;
    color: #FFF;
    background:#187ed3 url(https://img1.kakaku.k-img.com/images/article/tieup/23/12_iflytek/arrow.png) no-repeat 97% 50%;
    background-size: 2.2rem;
    text-align: center;
    padding-right: 0.3rem;
    height: 3.8rem;
    line-height: 3.8rem;
    box-sizing: border-box;
    border-radius: 50rem;
    margin: 0 auto;
}

/*==============================================
 ƒoƒi[
============================================= */
.innerbnr a {
display:block;
background: url(https://img1.kakaku.k-img.com/images/article/tieup/23/12_iflytek/sp_bnr.jpg) no-repeat top left;
padding-top: 33.33%;
background-size: 100%;
text-indent: -999em;
font-size: 0;
}


/*==============================================
 #mainContents
============================================= */
#mainContents {
font-family:  "Arial",'ŸเƒSƒVƒbƒN Medium', 'ŸเƒSƒVƒbƒN‘ฬ', 'Yu Gothic Medium', YuGothic , "ƒqƒ‰ƒMƒmŠpƒS Pro W3" , "Hiragino Kaku Gothic Pro" , "Meiryo UI" , "ƒƒCƒŠƒI" , Meiryo , "‚l‚r ‚oƒSƒVƒbƒN" , "MS PGothic" , sans-serif;
font-feature-settings: "palt";
}

/*----- •ถŽš -----*/
.paragraph p {
font-size: 1.4rem;
line-height:1.7;
margin-bottom: 2.5rem;
letter-spacing: 0.03em;
}
.paragraphIn > p:first-child {
margin-top: 5px;
}
.paragraph .cap{
font-size: 1.1rem;
line-height:1.6;
margin-bottom: 0;
}
.paragraph  p .marker {
background:linear-gradient(transparent 70%, #C6E2F8 70%);
padding: 0px 1px 2px;
font-weight: bold;
vertical-align: 7;
}

/*----@paragraph@----*/
.paragraph {
border-top: 1px solid #ccc;
transition: background-color .2s, border-top-color .2s;
}
.paragraphIn{
padding-bottom: 2rem;
padding: 0 2.0rem 2rem;
}
#article04 {
border-bottom: 1px solid #ccc;
}
.spAccordion {
display: none;
}

/*----@h2@----*/
.paragraph h2 {
position: relative;
font-weight: bold;
padding: 2.4rem 2rem 2.4rem 5.2rem;  
background: #fff;
color: #222;
word-break: break-all;
}
.paragraph h2 span {
display: block;
font-size: 1.7rem;
line-height: 1.4;
-webkit-tap-highlight-color:rgba(0,0,0,0);
}
.paragraph h2:active {
background-color: rgba(255,255,255,0.10);
}
.paragraph h2:after {
content: "";
display: inline-block;
position: absolute;
top: 0.1rem;
bottom: 0;
left: 1.8rem;/*----@ถ‚ฉ‚็‚ฬ–๎ˆ๓‚ฬˆส’u@----*/
width: 0.9rem;
height:0.9rem;
margin: auto;
-webkit-transition: opacity .2s ease, -webkit-transform .2s ease;
transition: opacity .2s ease, -webkit-transform .2s ease;
transition: transform .2s ease, opacity .2s ease;
transition: transform .2s ease, opacity .2s ease, -webkit-transform .2s ease;
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
vertical-align: middle;
border-bottom: 0.4rem solid #ccc;/*----@–๎ˆ๓‚ฬF@----*/
border-right: 0.4rem solid #ccc;/*----@–๎ˆ๓‚ฬF@----*/
}
.paragraph.active h2:after {
top: 0.5rem;
-webkit-transform: rotate(225deg);
transform: rotate(225deg);
}
.paragraph h2 .point {
font-size: 1.2rem;
display:inline-block;
margin-bottom: 0.9rem;
border: 0.125rem solid #0892e7;
line-height:2.3rem;
height:2.4rem;
padding: 0 0.8rem 0 5.75rem;
letter-spacing: 0.08em;
box-sizing: border-box;
color: #187ed3;
}
.paragraph h2 .point b{
display: none;
}
#article04 h2 .point{
border: none;
padding: 0;
font-size: 1.5rem;
line-height: 1.0;
height: 1.6rem;
}
.paragraph h2 .point.num1{
background: url(https://img1.kakaku.k-img.com/images/article/tieup/23/12_iflytek/check1.png) no-repeat top left;
background-size: 5rem;
}
.paragraph h2 .point.num2{
background: url(https://img1.kakaku.k-img.com/images/article/tieup/23/12_iflytek/check2.png) no-repeat top left;
background-size: 5rem;
}
.paragraph h2 .point.num3{
background: url(https://img1.kakaku.k-img.com/images/article/tieup/23/12_iflytek/check3.png) no-repeat top left;
background-size: 5rem;
}
.paragraph h3 {
margin-bottom: 1.5rem;
font-size: 1.7rem;
line-height: 1.4em;
color: #0892e7;
font-weight: bold;
text-align: left;
letter-spacing: 0.03em;
}
.imgBox4 + h3,
p + h3 {
margin-top:4rem;
}
p + .titS,
p + .imgBox1,
p + .imgBox2,
p + .imgBox3,
p + .imgBox4,
p + .imgBox5 {
margin-top:3.5rem;
}
.titS {
font-size: 1.5rem;
line-height: 1.3;
font-weight: bold;
margin-bottom: 1rem;
border-left: 0.3rem solid #0892e7;
padding-left: 0.8rem;
}

/* imgBox */
.imgBox1 img,
.imgBox2 img,
.imgBox3 img,
.imgBox4 img,
.imgBox5 img,
.imgBox6 img,
.imgBox7 img,
.imgBox8 img {
width: 100%;
margin-bottom:1rem;
}
.imgBox3 a:nth-child(1)  {
width: 100%;
margin-bottom:1rem;
}
.imgBox3 a:nth-child(2)  {
width: 50%;
display: block;
margin: 0 auto;
}
.imgBox1,
.imgBox2,
.imgBox3,
.imgBox4,
.imgBox5,
.imgBox6,
.imgBox7,
.imgBox8 {
margin-bottom:3rem;
}
.imgBox4 div + div{
margin-top: 0.5rem;
}


/* matome  */
#article04 .paragraphIn{
background: url(https://img1.kakaku.k-img.com/images/article/tieup/23/12_iflytek/sp_summary_bg.jpg) no-repeat bottom center;
background-size: 100%;
padding-bottom:60vw;
}

/*----- “ฎ‰ๆ -----*/
video { 
outline: none;
display: block;
width: 100%;
height: auto;
margin-bottom: 1rem;
}
.movBox { 
margin-bottom:3rem;
}


.tbl {
width: 100%;
border: 1px solid #CBCACA;
color: #222;
margin: 0 auto 2rem;
font-size:1.2rem;
word-break: break-all;
}
.tbl th,td{
padding: 0.5rem;
border-bottom: 1px dotted #CBCACA;
}
.tbl td{
padding: 0.6rem 0.8rem;
background: #fff;
}
.tbl th{
text-align: center;
width: 34%;
background: #F3F3F3;
font-weight: bold;
}


/*==============================================
 .productBox Box
============================================= */

.productBox{
background: #F7F7F7;
padding: 3.5rem 4rem 3rem;
}
.productBox  .img{
width: 45%;
display: block;
margin: 0 auto 1.5rem;
}
.productBox  .img img{
width: 100%;
}
.productBox  .info{
width: 100%;
color: #072038;
}
.productBox  .catch{
font-size: 1.6rem;
line-height: 1.3;
margin-bottom:1.2rem;
text-align:center;
letter-spacing: 0.02em;
}
.productBox  .name span{
font-size: 1.5rem;
display:block;
}
.productBox  .name{
font-size: 2.9rem;
line-height:1.3;
margin-bottom: 1.2rem;
font-weight: bold;
text-align: left;
letter-spacing: 0.02em;
}
.productBox  a {
display: block;
}
.productBox  a .btn{
    display: block;
    font-size: 1.2rem;
    letter-spacing: 0.06rem;
    font-weight: bold;
    color: #FFF;
    background:#187ed3 url(https://img1.kakaku.k-img.com/images/article/tieup/23/12_iflytek/arrow.png) no-repeat 97% 50%;
    background-size: 2.2rem;
    text-align: center;
    padding-right: 0.6rem;
    height: 3.8rem;
    line-height: 3.8rem;
    box-sizing: border-box;
    border-radius: 50rem;
    margin: 0 auto;
}


/*==============================================
.releasedate
============================================= */
.releasedate {
font-size: 0.85rem; 
padding:0 4rem 3rem;
color: #333;
background: #F7F7F7;
border-bottom: 1px solid #fff;
text-align: center;
}