@charset "shift_jis";
/*==============================================
 common
============================================= */

.anchor_wrapper,
.topbnr span,
.amazon_anchor span{
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%;
}

#footer{
	margin-top: 10px;
}

img {
width: 100%;
height: auto;
}
/*==============================================
 #mainContents
============================================= */
#mainContents{
font-family:'เSVbN Medium', 'เSVbNฬ', 'Yu Gothic Medium', YuGothic, 'qMmpS ProN', 'Hiragino Kaku Gothic ProN', 'CI', Meiryo, 'lr oSVbN', 'MS PGothic', sans-serif;
font-feature-settings: "palt" 1;
letter-spacing: 0.05em;
padding-bottom: 10px;
}

#mainContents b,
#mainContents strong, 
#mainContents .bold{
font-family:'เSVbN Medium', 'เSVbNฬ', 'Yu Gothic Medium', YuGothic, 'qMmpS ProN', 'Hiragino Kaku Gothic ProN', 'CI', Meiryo, 'lr oSVbN', 'MS PGothic', sans-serif;
}

/*----- ถ -----*/
.paragraph p {
font-size: 1.4rem;
line-height: 1.8;
margin-top: 30px;
}
.paragraphIn > p:first-child {
padding-top: 20px;
margin-top: 0;
}
.paragraph .cap {
font-size: 11px;
margin-top: 0px !important;
}

span.caution{
    font-size: 11px;
    display: block;
    margin-top: 10px;
    color: #A0A0A0;
}
sup{
vertical-align:super;
font-size:9px;
}

/*----@paragraph@----*/
.paragraph {
border-top: 1px dotted#7c7b79;
transition: background-color .2s, border-top-color .2s;
}

.spAccordion {
display: none;
padding: 0 20px 30px;
}


/*----- h2 -----*/
.paragraph h2 {
display: table;
position: relative;
font-weight: bold;
padding: 22px 25px 20px 24px;
}
.paragraph h2 toggleImg {
display: table-cell;
vertical-align: middle;
width: 70px;
}
.h2_number{
    display: none;
}
.toggleImg{
    width: 120px;
}
.toggleImg img{
    width: 100%;
}

.paragraph h2 span {
color: #2c2b2a;
display: table-cell;
padding: 0 20px 0 10px;
font-size: 1.2rem;
font-weight: bold;
line-height: 1.6;
-webkit-tap-highlight-color:rgba(0,0,0,0);
letter-spacing: 0.01em;
font-feature-settings: "palt" 1;
vertical-align: middle;
}
.paragraph h2 span.sub {
color: #2c2b2a;
display: block;
font-size: 1.5rem;
text-decoration: none !important;
line-height: 1.5;
margin-bottom: 0px;
padding: 0 0 0 0;
}
.paragraph h2:after {
content: "";
display: inline-block;
position: absolute;
top: 1px;
bottom: 0;
right: 20px;/*----@ถฉ็ฬ๎๓ฬสu@----*/
width: 10px;
height: 10px;
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: 3px solid #4d6999;/*----@๎๓ฬF@----*/
border-right: 3px solid #4d6999;/*----@๎๓ฬF@----*/
}
.paragraph.active h2:after {
top: 3px;
-webkit-transform: rotate(225deg);
transform: rotate(225deg);
}


/*==============================================
 ลย
============================================= */


h1 {
padding-top: 105%;
margin: 0 auto;
background: url(https://img1.kakaku.k-img.com/images/article/tieup/24/11_ecovacs/hero_sp.webp) no-repeat center top;
background-size: 100%;
text-indent: -999em;
font-size: 0;
}

p.lead {
    padding: 1.5rem 2.0rem 1.0rem;
    font-size: 1.4rem;
    line-height: 1.8;
}



/*==============================================
 oi[
============================================= */

/*----topbnr----*/
.topbnr a,
.productBox .btn,
.prdBox_subline .btn,
.lineup_bnr a{
    display: block;    
    margin: 0 auto;
    background: #4d6a9d url(https://img1.kakaku.k-img.com/images/article/tieup/24/11_ecovacs/icon_arrow.png) no-repeat;
    background-size: 1.5rem;
    background-position: right 1.3rem center;
    color: #FFF;
    font-size: 1.2rem;
    font-weight: bold;
    
    text-align: center;
    border-radius: 50px;
    margin-top: 1.5rem;
}
.topbnr a{
    width: 86%;
    padding: 1.0rem 0;
}
.productBox .btn,
.prdBox_subline .btn{
    width: 90%;
    font-size: 1.0rem;
    padding: 1.2rem 0;
}

.lineup_bnr a{
    width: 100%;
    font-size: 1.2rem;
    padding: 0.9rem 0;
    margin-top: 1.0rem;
}

/*----amazon_anchor----*/
.amazon_anchor a{
    display: block;
    width: 86%;
    margin: 20px auto 30px;
    background: url(https://img1.kakaku.k-img.com/images/article/tieup/24/11_ecovacs/icon_arrow_amazon_anchor.png) no-repeat;
    background-size: 1.2rem;
    background-position: left 15px center;
    border: solid #fb7600;
    border-width: 2px;
    color: #fb7600;
    font-size: 1.2rem;
    font-weight: bold;
    padding: 0.7rem;
    text-align: center;
    box-sizing: border-box;
    border-radius: 2px;
}

/*----innerbnr----*/

.innerbnr{
    width: 100%;
    margin: 20px auto 0;
    border: dotted #868483;
    border-width: 1px;
    padding: 1.1rem;
    box-sizing: border-box;
}

.innerbnr a{
    display: block;
    width: 100%;
}

.innerbnr a .item{
    overflow: hidden;
    zoom:0;
}

.innerbnr a .item .img{
    width: 25%;
    float: left;
}
.innerbnr a .item .img img{
    width: 100%;
}
dl.info{
    background: url(https://img1.kakaku.k-img.com/images/article/tieup/24/11_ecovacs/icon_kakaku.png) no-repeat top left;
    background-size: 60px;
    width: 70%;
    float: right;
    padding-top: 18px;
    margin: 0;
}
dl.info dt.catch{
    font-size: 1.0rem;
}
dl.info dd.name{
    font-size: 1.2rem;
    line-height: 1.4;
    font-weight: bold;
    margin-top: 2px;
}
dl.info dd.name span{
    font-size: 1.3rem;
    font-weight: bold;
    display: block;
}
dl.info dd.btn{
    width: 100%;
    margin: 5px auto 0;
    background: #4d6a9d url(https://img1.kakaku.k-img.com/images/article/tieup/24/11_ecovacs/icon_arrow.png) no-repeat;
    background-size: 12px;
    background-position: right 8px center;
    color: #FFF;
    font-size: 0.85rem;
    font-weight: bold;
    padding: 0.8rem 0;
    text-align: center;
    border-radius: 50px;
}

/*==============================================
.imgBox
============================================= */

.imgBox{
    padding: 0px;
    margin-top: 20px;
    width: 90%;
    margin: 0 auto 25px;
}

p + .imgBox,
.movBox + .imgBox{
    margin-top: 25px;
}
.inbox,
.inbox02,
.imgMobile{
    overflow: hidden;
    zoom: 1;
}



.imgBox .floatL, .imgBox .floatR,
.floatL.w_pic07,.floatR.w_mov03{
    position: relative;
}


.imgBox img{
    width: 100%;
	font-size: 0;
    margin-bottom: 10px;
}
.imgBox .floatL img, .imgBox .floatR img{
    width: 100%;
	font-size: 0;
}





#mainContents p.cap {
    line-height: 1.6;
    font-size: 1.1rem;
    padding: 0px;
}
.imgBox .sp_w48,
.imgMobile .floatL,
.imgMobile .floatR{
    width: 48.5% !important;
}




/* LvV@ฉoต */

p.captit01,
.movTit{
    background-image: url(https://img1.kakaku.k-img.com/images/article/tieup/24/11_ecovacs/icon_caption.png);
    background-repeat: no-repeat;
    background-position: center top;
    background-size: 28px;
    padding-top: 1.1rem;
    line-height: 1.4;
    font-size: 1.3rem;
    font-weight: bold;
    margin-bottom: 8px;
    text-align: center;
}

/*----- ฎๆ -----*/
.movBox,
.movBox03{ 
width: 90%;
margin: 25px auto 0;
}
.movIcon span {
background: #333;
padding: 4px 7px 3px;
color: #fff;
line-height: 140%;
font-size: 13px;
display: inline-block;
margin-bottom: 5px;
}
.movBox .mov video{
display: block;
width: 100%;
height: auto;
margin-bottom: 10px;
}

.floatR.w_mov03 .movBox_03 .mov video{
    width: 100%;
	font-size: 0;
    height: auto;
}

.mov .movTxt,
.floatR.w_mov03 .movBox_03 .mov .movTxt{
font-size: 13px;
line-height: 1.5;
}
.movWrap {
display: table;
table-layout: fixed;
width: 100%;
margin-bottom: 10px;
}


/*==============================================
 .lineupBox
============================================= */
.lineupBox{
    width: 100%;
    background:#f8f7f6 url(https://img1.kakaku.k-img.com/images/article/tieup/24/11_ecovacs/icon_lineup.png) center top no-repeat;
    padding: 2.8rem 1.5rem 2.5rem;
    box-sizing: border-box;
    margin: 20px 0 0 0;
}
.lineupBox:nth-of-type(1){
    margin-top: 25px;
}

.lineupBox ul{
    width: 100%;
    text-align: center;
    margin: 0 auto;
}
.lineupBox li.tit{
    font-size: 1.45rem;
    font-weight: bold;
    line-height: 1.4;
    color: #4d6999;
    text-align: center;
    margin-bottom: 8px;
}
.lineupBox li.name{
    font-size: 1.1rem;
    font-weight: bold;
    text-align: center;
    margin-top: 1.0rem;
}
.lineupBox li.img{
    width: 80%;
    margin: 0px auto 0px;
}
.lineupBox li.img img{
    width: 100%;
}
.lineupBox ul + p{
    margin-top: 0px!important;
    font-size: 1.2rem!important;
}

p.link_name{
    text-align: center;
    position: relative;
    font-size: 1.4rem;
    font-weight: bold;
    letter-spacing: 0;
    line-height: 1.6;
    margin-top: 10px;
    margin-bottom: 0px;
    
}

p.link_name span:before{
    content: '';
  display: inline-block;
  width: 84px;
  height: 12px;
  background-image: url(https://img1.kakaku.k-img.com/images/article/tieup/24/11_ecovacs/icon_kakaku.png);
  background-size: contain;
    background-repeat: no-repeat;
    background-position: right 10px center;
    vertical-align: 0px;
}

/*==============================================
 .productBox
============================================= */
.sp_grayBg{
    background-color: #f5f3f1;
    padding: 1.8rem;
    box-sizing: border-box;
    border: dotted #606060;
    border-width: 1px 0 0 0;
}



.productBoxIn{
    width: 100%;
    margin: 25px auto 0;
    background-color: #FFF;
    padding: 1.5rem 1.5rem 2.6rem;
    box-sizing: border-box;
}

p.prd_tit{
    text-align: center;
    position: relative;
    font-size: 1.2rem;
    font-weight: bold;
    margin: 5px auto 20px;
    
}

p.prd_tit span:before{
    content: '';
  display: inline-block;
  width: 84px;
  height: 13px;
  background-image: url(https://img1.kakaku.k-img.com/images/article/tieup/24/11_ecovacs/icon_kakaku.png);
  background-size: contain;
    background-repeat: no-repeat;
    background-position: right 6px center;
}

/*prdBox_main*/
.prdBox_main{
    width: 100%;
    display: block;
    margin: 0px auto 0;
    padding:0 0 45px 0;
    background-color: #FFF;
    box-sizing: border-box;
    border: dotted #7c7b79;
    border-width: 0 0 1px 0;
}

.prdBox_main .img{
    width: 80%;
    margin: 0 auto;
}
.prdBox_main .img img{
    width: 100%;
}
.prdBox_main ul.info{
    width: 100%;
    text-align: center;
}
.prdBox_main ul.info li.subTxT{
    font-size: 1.0rem;
    margin-bottom: 10px;
}
.prdBox_main ul.info li.name{
    font-size: 1.6rem;
    font-weight: bold;
    margin-bottom: 20px;
}


/* prdBox_subline */
.prdBox_subline{
    width: 100%;

}
.prdBox_subline a{
    width: 100%;
    display: block;
    margin: 0px auto 0;
    background-color: #FFF;
    padding:28px 0 0 0;
    box-sizing: border-box;
}
.prdBox_subline .img{
    width: 80%;
    margin: 0 auto;
}
.prdBox_subline .img img{
    width: 100%;
}
.prdBox_subline ul.info{
    width: 100%;
    text-align: center;
}
.prdBox_subline ul.info li.subTxT{
    font-size: 1.0rem;
    margin-bottom: 10px;
    letter-spacing: 0;
}
.prdBox_subline ul.info li.name{
    font-size: 1.6rem;
    font-weight: bold;
    margin-bottom: 20px;
    letter-spacing: 0;
}
.prdBox_subline ul.info li.btn{
}


/*==============================================
amazonBox
============================================= */
.amazonBox {
    padding: 1.5rem;
    background-color: #FFF;
    margin-top: 0px;

}

/*----- Title & p -----*/
.amazonTitle {
background: #fb7600;
padding: 15px 0 10px;
}

.amazonTitle h4 {
font-size: 1.35rem;
line-height: 1.5;
font-weight: bold;
text-align: center;
color: #fff;
}

.amazonSubTitle {
border-left: #fb7600 3px solid;
border-right: #fb7600 3px solid;
border-bottom: #fb7600 3px solid;
text-align: center;
margin-bottom: 5px;
padding: 10px;
}

.amazonSubTitle strong {
font-size: 1.2rem;}

.amazonTitleS {
font-size: 1.2rem;
background-color: #f2f2f2;
padding: 8px;
text-align: center;
margin-top: 20px;
}


p.amazonTxt {
font-size: 1.2rem;
line-height: 1.5;
text-align: center;
margin-top: 8px;
}

p.amazonTxtS {
font-size: 0.8rem;
text-align: right;
padding-top: 8px;
}

/*----- saleinfo -----*/

.infoBox + .infoBox {
border-top: #333 dotted 1px; }

.infoBox {
margin: 0;
padding: 14px 0;
}
.itemName {
display: block;
font-size: 1.45rem;
font-weight: bold;
text-align: center;
margin-bottom: 5px;
}
.spTxt {
display: block;
text-align: center;
font-size: 1.1rem;
}
.arrowBox {
background:url(https://img1.kakaku.k-img.com/images/article/tieup/24/10_ecovacs/sp_amazon_arrow.png) center center no-repeat;
background-size: 20px;
display: block;
padding: 10px 0;
}
.spTxt02 {
color: #cc0000;
display: block;
text-align: center;
font-size: 1.25rem;
}
.itemPrice02 {
font-weight: bold;
}
.itemPrice02 em {
font-size: 1.55rem;
font-style: normal;
}
.sale {
background: #cc0000;
color: #fff;
display: inline-block;
font-size: 1.2rem;
padding: 3px 5px;
position: relative;
top: -2px;
}
.sale span {
display: inline-block;
font-size: 0.95rem;
margin-left: 1px;
}

/*----- Coupon -----*/

.amazonCoupon {
display: table;
width: 100%;
background-size: 100%;
box-sizing: border-box;
margin: 15px 0 0;
}

.percentTxt,
.codeTxt {
padding: 5px;
text-align: center;
box-sizing: border-box;
display: table-cell;
vertical-align: middle;}

.percentTxt {
width: 45%;
color: #fff;
background-color: #b70000;
border-right:#fff 2px dotted;
height: 100%;
box-sizing: border-box;
font-size: 2.2rem;
position: relative;
}
strong.codeTxt {
width: 100%;
background-color: #d80000;
display: inline-block;
text-align: center;
font-size: 1.55rem;
line-height: 1.2;
color: #fff;
}
span.codeTxtS {
font-size: 1rem !important;
}


/*==============================================
.releasedate
============================================= */
.releasedate {
    background-color: #f5f3f1;
	font-size: 0.85rem; 
	padding: 0 25px 20px;
	color: #333;}

