@charset "shift_jis";
/*==============================================
common
============================================= */



#header {
border-bottom: #ededed solid 1px;
}
.headerIn,
.footerIn {
width: 930px;
margin: 0 auto;
}
.copyRight { border-top: 1px solid #ededed; }
#footer { margin-top: 10px; }
.pageTop { border-radius: 50%; }




/*==============================================
 .noto
============================================= */
/* regular */
@font-face {
    font-family: 'noto';
    src: url(https://img1.kakaku.k-img.com/images/fonts/noto-sans/NotoSansJP-Regular.woff);
    font-weight: 400;
}
/* medium */
@font-face {
    font-family: 'noto';
    src: url(https://img1.kakaku.k-img.com/images/fonts/noto-sans/NotoSansJP-Medium.woff);
    font-weight: 500;
}
/* bold */
@font-face {
    font-family: 'noto';
    src: url(https://img1.kakaku.k-img.com/images/fonts/noto-sans/NotoSansJP-Bold.woff);
    font-weight: 700;
}


/*---- 文字　 ----*/
#mainContents .paragraph,
#mainContents .mainTitleWrap,
.productBox,
table th,table td{
font-family: "noto", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Yu Gothic", "Meiryo", "Arial", sans-serif;
font-feature-settings: "palt" 1;
letter-spacing: 0.04em;
color: #121212;}

#mainContents p {
	font-size:  132%;
	line-height: 2.2;
}

#mainContents .cap{
	font-size: 108%;
	line-height: 1.9;}


#mainContents p + p {
	margin-top: 30px;}

sup {
font-size: 60%;
vertical-align: top;
position: relative;
top: 0.3em;
}

.paragraph .marker {
background-color: #dbe6fd;
font-weight: bold;}

#matome .marker{
background-color: #b7cdf8;
}


/*==============================================
看板
============================================= */
.mainTitleWrap {
width: 100%;
position: relative;}

.mainTitleWrap:after{
display: block;
content: "";
width: 100%;
height: 549px;
background: linear-gradient(to left,  #f2f2f2 50%, transparent 50%);
position: absolute;
top: 0;}

.mainTitle {
width: 100%;
margin: 0 auto;
z-index: 1;
}

h1 {
width:1330px;
height: 549px;
text-indent: -999em;
font-size: 0;
z-index: 2;
background: url(https://img1.kakaku.k-img.com/images/article/tieup/24/04_ecovacs_y1/pc_title.png) center top no-repeat;
margin: 0 auto;
position: relative;
}


.lead {
	margin: 50px auto 0;
	width: 840px;}

.lead a:link,
.lead a:visited {
color: #3884f5;
text-decoration: underline;
}
.lead a:hover,
.lead a:active {
color: #3884f5;
text-decoration: none;
}


.contentsNavi{
width: 100%;
position: relative;
margin-top: 70px;
}

.contentsNavi:before{
display: block;
content: "";
width: 100%;
height: 240px;
background: linear-gradient(to left, transparent 30%, #f2f2f2 30%);
position: absolute;
top: 0;}

.contentsNavi .naviIn{
	width: 1330px;
	background-color: #f2f2f2;
	display: block;
	z-index: 2;
margin: 0 auto;
position: relative;}

.contentsNavi .naviIn div{
	width: 840px;
	margin: 0 auto;
	padding: 45px 0;
	height: 240px;
	box-sizing: border-box;
	display: table;
}

.contentsNavi .naviIn div p,
.contentsNavi .naviIn div ul {
	display: table-cell;
}


.contentsNavi .naviIn div p {
	text-indent: -999em;
	background: url(https://img1.kakaku.k-img.com/images/article/tieup/24/04_ecovacs_y1/inex.png) left 50% no-repeat;
	width: 95px;
}

.contentsNavi .naviIn div li {
	font-size: 16px;
}

.contentsNavi .naviIn div li a {
	background: url(https://img1.kakaku.k-img.com/images/article/tieup/24/04_ecovacs_y1/index_arrow.png) left 50% no-repeat;
padding-left: 25px;
transition: 0.1s ease-in-out;
}

.contentsNavi .naviIn div li a span{
	display: inline-block;
	width: 220px;
}

.contentsNavi .naviIn div li a:hover {
	color: #3884f5;
}

.contentsNavi .naviIn div li + li {
	margin-top: 20px;
}

/*==============================================
 バナー
============================================= */

.topbnr a{
display: block;
width: 504px;
height: 57px;
margin: 50px auto 0;
text-indent: -999em;
background:url(https://img1.kakaku.k-img.com/images/article/tieup/24/04_ecovacs_y1/top_bnr.png) left 50% no-repeat;
overflow: hidden;
transition: 0.1s ease-in-out;}

.topbnr a:hover {
	opacity: 0.7;
	filter: alpha(opacity=70);}


.innerbnr a{
display: block;
width: 840px;
height: 185px;
margin: 100px auto 0;
text-indent: -999em;
background:url(https://img1.kakaku.k-img.com/images/article/tieup/24/04_ecovacs_y1/innerbnr.png) left 50% no-repeat;
overflow: hidden;
transition: 0.1s ease-in-out;}

.innerbnr a:hover {
	opacity: 0.7;
	filter: alpha(opacity=70);}



/*==============================================
#mainContents
============================================= */
.paragraph {
margin: 80px auto 0;
padding: 50px 0 0;}

.paragraph .spAccordion{
width: 840px;
margin: 0 auto;}

.paragraph h2 {
font-size: 30px;
line-height: 1.7;
font-weight: bold;
text-align: center;
}

.paragraph h2 .icon {
	font-size: 24px;
	padding-bottom: 12px;
	border-bottom: #121212 2px solid;
}

.paragraph h2 .text {
	display: block;
	margin-top: 32px;
}

.paragraph h3 {
	font-size: 25px;
font-weight: bold;
text-align: center;
margin: 100px 0 80px;}


.paragraph .subtext {
	font-size: 18px;
	font-weight: bold;
	margin-bottom: 15px;
}

.paragraphIn {
	margin-top: 80px;
}

.interviewbox {
	display: table;
width: 890px;
margin: 80px auto 0;}

.interviewbox .name,
.interviewbox .text{
	display: table-cell;
	vertical-align: top;}

.interviewbox .name {
	text-align: center;}

.interviewbox .name .gray{
	padding: 3px 15px;
	background-color: #626469;
	color: #fff;
	font-size: 16px;
	white-space: nowrap;

}
.interviewbox .text{
	padding-left: 25px;
}


/*----　画像　----*/
.w660 {
	width: 660px;
}

.imgBox {margin:90px auto 0;}

.imgBox div {overflow: hidden;}

.imgBox .floatL,
.imgBox .floatR {width:410px;}

.imgBox .floatR .floatL,
.imgBox .floatR .floatR{
	width: 195px;
border: #e8e8e8 1px solid;
box-sizing: border-box;}

.imgBox img {width: 100%;}

.imgBox a {
font-size: 0;
display: block;
cursor: zoom-in;}

.imgBox a img{
transition: 0.2s ease-in-out;}

.imgBox a:hover img {
opacity: 0.8;
filter: alpha(opacity=80);}

.imgBox .cap a {
	font-size: 100% !important;
	display: inline-block !important;
	color: #5a7ddd;
	text-decoration: underline;}

.imgBox div + .cap,
.imgBox a + .cap{
	margin-top: 15px;}

a.floatL + .cap,
a.floatR + .cap{
	margin-top: 0;}

.imgBox + p {margin-top: 90px;}

/*----　動画 ----*/
.movBox {
width: 660px;
margin: 90px auto 0;
}
.mov {
width: 660px;
height: 371px;
background: #666;
display: table;
margin-bottom:10px;
line-height: 0;
margin-top: 15px;
}

.movTit {
background: url(https://img1.kakaku.k-img.com/images/article/tieup/24/04_ecovacs_y1/mov_icon.webp) left 50% no-repeat;
background-size: 36px;
padding-left: 45px;
font-size: 18px;
font-weight: bold;
min-height: 28px;
}

.movTxt {
display: table-cell;
line-height: 1.3;
color: #fff;
vertical-align: middle;
text-align: center;
}
.movIcon{
color: #000;
margin-bottom: 10px;
}
.movWrap {
display: block;
overflow: hidden;
}


.graybg {
background-color: #f2f2f2;
border-bottom: #fff 1px solid;}
/*==============================================
#matome
============================================= */
#matome h2 .icon{
display: none;}

#matome {
margin-top: 120px;
background: url(https://img1.kakaku.k-img.com/images/article/tieup/24/04_ecovacs_y1/matome_bg.webp) center top no-repeat;}

#matome .paragraphIn {
	margin-top: 50px;
padding-bottom: 80px;}


#matome .paragraphIn .text {
width: 500px;	
margin-left: 400px;
}

/*==============================================
.productBox
============================================= */
.productBox {
	width: 930px;
	margin: 80px auto 0;}

.productBox .item01 {
padding: 40px;
background-color: #fff;
box-sizing: border-box;}

.productBox .item01 a {
	width: 930px;
	display: table;
}

.productBox .item01 a,
.productBox .item03 a{
transition: 0.1s ease-in-out;}

.productBox .item01 a:hover,
.productBox .item03 a:hover {
	opacity: 0.7;
	filter: alpha(opacity=70);}

.productBox .item01 a .img,
.productBox .item01 a .info {
	display: table-cell;
	vertical-align: middle;
}

.productBox .item01 a .img {
	width: 400px;
	text-align: center;
}

.productBox .item01 a .catch {
	font-size: 16px;
	line-height: 1.7;
}

.productBox .item01 a .name {
	text-indent: -999em;
	background: url(https://img1.kakaku.k-img.com/images/article/tieup/24/04_ecovacs_y1/prd_name01.webp) left top no-repeat;
	background-size: 339px;
	height: 30px;
	margin-top: 15px;}


.productBox .item01 a .btn{
display: block;
width: 357px;
height: 41px;
margin-top: 20px;
text-indent: -999em;
background:url(https://img1.kakaku.k-img.com/images/article/tieup/24/04_ecovacs_y1/prd_btn.png) left 50% no-repeat;
overflow: hidden;}

.productBox .item03 {
	margin-top: 12px;
	overflow: hidden;
}

.productBox .item03 a {
float: left;
width: 302px;
display: block;
text-align: center;
padding: 30px 20px;
background-color: #fff;
box-sizing: border-box;}

.productBox .item03 a + a {
	margin-left: 12px;
}

.productBox .item03 a .catch {
	font-size: 14px;
	line-height: 1.7;
margin-top: 10px;}

.productBox .item03 a .name02,
.productBox .item03 a .name03,
.productBox .item03 a .name04{
	text-indent: -999em;
	height: 22px;
	margin-top: 10px;
}

.productBox .item03 a .name02 {
background:url(https://img1.kakaku.k-img.com/images/article/tieup/24/04_ecovacs_y1/prd_name02.webp) center 50% no-repeat;
background-size: 185px;
}
.productBox .item03 a .name03 {
background:url(https://img1.kakaku.k-img.com/images/article/tieup/24/04_ecovacs_y1/prd_name03.webp) center 50% no-repeat;
	background-size: 264px;
}
.productBox .item03 a .name04 {
background:url(https://img1.kakaku.k-img.com/images/article/tieup/24/04_ecovacs_y1/prd_name04.webp) center 50% no-repeat;
background-size: 219px;}

.productBox .item03 a .btn {
display: block;
width: 264px;
height: 41px;
margin-top: 15px;
text-indent: -999em;
background:url(https://img1.kakaku.k-img.com/images/article/tieup/24/04_ecovacs_y1/prd_btnS.png) left 50% no-repeat;
overflow: hidden;	
}


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