@charset 'utf-8';

/* -----------------------------------------------------------
CSS Information

File name:      mod_sp.css
Update:         2014/06/03
Style Info:     sp PC用

----------------------------------------------------------- */


/* siteTitleArea
---------------------------------------------------------------------- */
body#sp #siteTitleArea	{ display: none;}
body#sp #wrapper img	{ vertical-align:bottom;}

body#sp span.red		{ color:#ff0000; }


/*----------------------------------------------------------
	 mainArea
------------------------------------------------------------ */

#sp-mainArea {
	width:650px;
}
#sp-mainArea .browser{
	margin-bottom:16px;
}

#sp-mainArea h3{
	margin:0;
	padding:0;
	text-indent:100%;
	white-space: nowrap;
	overflow: hidden;
	width:650px;
	height:31px;
	border:none;
}

/*----------------------------------------------------------
	 .browser /  
------------------------------------------------------------ */

#sp-mainArea .browser h3{
	background:url(../image/sp/title_browser.gif) no-repeat;
}


#sp-mainArea .partsAttention{
	background: #fdf8ef;
	border:1px solid #eee0c6;
	width:648px;
}

#sp-mainArea .browser .partsAttention .title{
	margin:22px 0 22px 26px;
	width:600px;
	height:23px;
}

#sp-mainArea .partsAttention .intro p{
	margin:21px 0 27px 31px;
}

#sp-mainArea .partsAttention .intro p span{
	color:#FF0000;
}

#sp-mainArea .partsAttention .url{
	position: relative;
	height:138px;
	margin-top:-22px;
}

#sp-mainArea .partsAttention .url p{
	position: absolute;
	display: block;
	top:26px;
	left:37px;
}

#sp-mainArea .partsAttention .url .url-form{
	background:url(../image/sp/pic_url_form.gif) no-repeat;
	width:261px;
	height:33px;
	padding:6px 0 0 17px;
	left:26px;
	top:46px;
	font-size: 18px
}

#sp-mainArea .partsAttention .url .url-form a{
	text-decoration:underline;
	color:#777777;
}

#sp-mainArea .partsAttention .url .url-form a:hover{
	text-decoration: none;
}

#sp-mainArea .partsAttention .url .qr{
	left:348px;
	top:16px;
	width:253px;
	height:107px;
}

#sp-mainArea .flowchart{
	position: relative;
	height:425px;
}

#sp-mainArea .flowchart2{
	position: relative;
	height:425px;
}

#sp-mainArea .flowchart2 .pic_cap1,
#sp-mainArea .flowchart2 .pic_cap2{
	position: absolute;
	width:164px;
	left:86px;
	top:0px;
	text-align: center;
}

#sp-mainArea .partsAttention .flowchart2 .pic_cap2 {
	width: 164px;
	top: 0px;
	left: 398px;
}

#sp-mainArea .flowchart .pic_cap1,
#sp-mainArea .flowchart .pic_cap2,
#sp-mainArea .flowchart .pic_cap3{
	position: absolute;
	width:164px;
	left:26px;
	top:0px;
	text-align: center;
}

#sp-mainArea .partsAttention .flowchart2 p.img_icon1{
	position: absolute;
	top: 170px;
	left: 311px;
	}

#sp-mainArea .partsAttention .pic_cap2 {
	width: 170px;
	top: 0px;
	left: 243px;
}

#sp-mainArea .partsAttention .pic_cap3 {
	top: 0px;
	left: 466px;
}

#sp-mainArea .flowchart .pic_watering{
	margin:0 0 0 215px;
	width:391px;
	height:331px;
}


#sp-mainArea p.contentsArea {
	margin-top: 7px;	
}

#sp-mainArea p.title_mode{
	text-align:center;
	margin-top:5px;
	padding: 5px;
	color:#FFFFFF;
	font-weight:bold;
}

#sp-mainArea .flowchart .pic_cap1 p.title_mode{
	background:#92ba6e;
	width:129px;
	margin-left:13px;
}

#sp-mainArea .pic_cap1 p.title_mode{
	background:#989488;
	width:129px;
	margin-left:13px;
}

#sp-mainArea .pic_cap2 p.title_mode{
	background:#92ba6e;
	width:129px;
	margin-left:15px;
}
	
#sp-mainArea .pic_cap3 p.title_mode {	
	background:#92ba6e;
	width:129px;
	margin-left:13px;
}

#sp-mainArea .partsAttention p.img_icon1,
#sp-mainArea .partsAttention p.img_icon2{
	position: absolute;
	top: 170px;
	left: 207px;	
	}

#sp-mainArea .partsAttention p.img_icon2{
	left: 427px;	
	}

#sp-mainArea .txt_attention{
	height:151px;
	position: relative;
}

#sp-mainArea .txt_attention p{
	position: absolute;
	display: block;
	top:1px;
	left:-1px;
	width:650px;
	height:151px;
}

#sp-mainArea .sp_conditions{
	background:url(../image/sp/sp_conditions.png) no-repeat;
	width:648px;
	height:307px;
	position:relative;
	margin-top:-35px;
}

#sp-mainArea .sp_conditions .txt_conditions{
	position:absolute;
	top:53px;
	left:40px;
	letter-spacing: 1px;
}


/*----------------------------------------------------------
	 clearfix
------------------------------------------------------------ */

#sp #sp-mainArea li dl dd:after,
#sp #sp-mainArea li dl dd div.goods-outer:after,
#sp #sp-mainArea li dl dd dl:after,
#sp #sp-mainArea li dl dd:after,
#sp #sp-mainArea li dl dd div.goods-outer:after {
	content : '';
	display : block;
	clear	: both;
}

#sp #sp-mainArea li dl dd,
#sp #sp-mainArea li dl dd div.goods-outer,
#sp #sp-mainArea li dl dd dl,
#sp #petsp-mainArea li dl dd,
#sp #petsp-mainArea li dl dd div.goods-outer,
#sp #petsp-mainArea li dl dd dl {
	zoom:1;
}


/*----------------------------------------------------------
	 スマホ版紹介ページ（PC）　20220726
------------------------------------------------------------ */


.sp_Intro2022_01{background:url("../image/sp/20220726/sp_intro01.png") no-repeat;
	width:620px;
	height:474px;
	margin: 0px auto;}

.sp_Intro2022_02{background:url("../image/sp/20220726/sp_intro02.png") no-repeat;
	width:620px;
	height:570px;
	margin: 0px auto;}

.sp_Intro2022_03{background:url("../image/sp/20220726/sp_intro03.png") no-repeat;
	width:620px;
	height:468px;
	margin: 0px auto;}

.sp_Intro2022_04{
	width:537px;
	height:23px;
	margin: 50px auto;}