﻿@charset "UTF-8";

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

トップページ

--------------------------------------------*/
#top #wrapper {
	background: none;
}

#top #content {
	margin: 0 auto;
	padding: 0 2px;
	width: 320px;
	margin-bottom: -16px;
}

#top #content #contentBody {
	padding: 0;
	background: none;
}

#top #content #contentBody #main {
	float: none;
	margin: 0 auto;
	padding: 0 10px;
	width: 300px;
	background: none;
}

#top #content #contentBody #side {
	float: none;
	position: inherit;
	top: 0;
	left: 0;
	margin: 0 auto;
	width: 300px;
}
#top #visual-sp{
	display: block;
}
#top #visual {
	margin: 11px 0 10px 10px;
 	width: 300px;
	height: auto;
	overflow: hidden;
	_zoom: 1;
	background: none;
}
#visual,
#top #visual #visual_photo,
#top #visual #visual_nav {
display: none;
}



#top #visual #smp_visual {
	position: relative;
	left: 0;
	margin-bottom: 11px;
	height: 204px;
	width: 300px;
	background: url(img_top/smp/slides_bg.png) no-repeat center bottom;
	background-size: contain;
	overflow: hidden;
}

/* visual_slide -------------------------------------------------- */
#slides {
	display: none;
	width: 300px;
	height: 312px;
	padding:0 10px;
	position: relative;
	margin-bottom:14px;
}
#slides img{
	width: 100%;
	height: auto;
}
#slides .slidesjs-previous {
	position: absolute;
	width: 36px;
	height: 34px;
	left: 2px;
	bottom: 2px;
	overflow: hidden;
}

#slides .slidesjs-next {
	position: absolute;
	width: 36px;
	height: 34px;
	right: 2px;
	bottom: 2px;
	overflow: hidden;
}

.slidesjs-pagination {
	position: absolute;
	padding-top: 12px;
	bottom: 0;
	left: 10px;
	width: 300px;
	height: 20px;
	display: inline-block;
	text-align: center;
	z-index: 100;
	background: #cfe6f0;
}

.slidesjs-pagination li {
	display: inline-block;
	width: 12px;
	margin: 0 12px;
}

.slidesjs-pagination li a {
	display: block;
	width: 12px;
	height: 0;
	padding-top: 12px;
	background-image: url(/s/img_top/slides_page.png);
	background-position: 0 0;
	background-size: 12px 24px;
	overflow: hidden;
}

.slidesjs-pagination li a.active,
.slidesjs-pagination li a:hover.active {
	background-position: 0 -12px
}

.slidesjs-pagination li a:hover {
	background-position: 0 -12px
}

.navbar {
  overflow: hidden
}
/* /visual_slide -------------------------------------------------- */


#top #visual #visual_side {
	float: none;
	width: auto;
	height: auto;
}

#top #visual #visual_side p#beginner_btn {
	margin: 0 auto;
	width: 300px;
	height: 49px;
}

#top #visual #visual_side p#beginner_btn a {
	display: block;
	width: 300px;
	height: 49px;
	background-repeat: no-repeat;
	background-position: 0 0;
	background-image: url(/s/img_top/smp/main_beginner_btn.png);
	background-size: 100%;
	overflow: hidden;
	text-indent: -9999px;
}

#top #visual #visual_side p#beginner_btn a:hover {
	background-position: 0 0;
}

#top #visual #visual_side p#check {
	display: none;
}

#top #visual #visual_side #login_area {
	margin: 10px auto 0;
	padding: 0;
	width: 300px;
	height: 51px;
	overflow: hidden;
	background: none;
}

#top #visual #visual_side #login_area h3 {
	display: none;
}

#top #visual #visual_side #login_area dl {
	display: none;
}

#top #visual #visual_side #login_area p.submit {
	display: none;
}

#top #visual #visual_side #login_area p.login_smp {
	display: block;
	margin: 0;
	width: 300px;
}

#top #visual #visual_side #login_area p.login_smp a {
	display: block;
	width: 300px;
	height: 51px;
	background-image: url(/s/img_top/smp/login_btn.png);
	background-repeat: no-repeat;
	background-position: 0 0;
	background-size: 100%;
	overflow: hidden;
	text-indent: -9999px;
}

#top #visual #visual_side #mypage_area {
	display: none;
}

#content #contentBody #product {
	width: 300px;
	height: 324px;
	margin: 0 auto 25px;
	background: none;
}

#content #contentBody #product ul {
	padding: 0;
}

#content #contentBody #product ul li {
	float: none;
	width: 300px;
	margin-right: 0;
}

#content #contentBody #product ul li a {
	display: block;
	height: 162px;
	text-indent: -9999px;
}

#content #contentBody #product ul li a:hover {
	filter: alpha(opacity=100);
	-moz-opacity: 1;
	opacity: 1;
}

#content #contentBody #product ul li#top_natural a {
	background: url(/s/img_top/natural_btn_sp.jpg) no-repeat 0 0;
	background-size: contain;
}

#content #contentBody #product ul li#top_mineral a {
	background: url(/s/img_top/mineral_btn_sp.jpg) no-repeat 0 0;
	background-size: contain;
}


#content #contentBody #main #pickup {
	margin: 0;
	clear: left;
	overflow: hidden;
	_zoom: 1;
}

#top #content #contentBody #main #pickup h2 {
	margin-bottom: 0;
	padding: 0;
	width: 300px;
	height: 25px;
	overflow: hidden;
	text-indent: -9999px;
	background: url(/s/img_top/pickup_h2_sp.png) no-repeat 0 0;
	background-size: 100%;
}

#top #content #contentBody #main #pickup ul.banner {
	height: inherit;
	width: 300px;
	margin: 0 0 15px;
	overflow: inherit;
}

#top #content #contentBody #main #pickup ul.banner li {
	float: none;
	width: 300px;
	height: 87px;
	margin-right: 0;
	margin-bottom: 10px;
	text-indent: -9999px;
	background-position: 0 0;
	background-repeat: no-repeat;
	background-color: #FFF;
	background-size: contain;
	overflow: hidden;
}

#top #content #contentBody #main #pickup ul.banner li#bnn_syokai a {
	background-image: url(/s/img_top/bnn_syokai_sp.jpg);
}

#top #content #contentBody #main #pickup ul.banner li#bnn_factory a {
	background-image: url(/s/img_top/bnn_factory_sp.jpg);
}

#top #content #contentBody #main #pickup ul.banner li#bnn_server_guide_movie a {
	background-image: url(/s/img_top/bnn_server_guide_movie_sp.png);
}

#top #content #contentBody #main #pickup ul.banner li#bnn_mile a {
	background-image: url(/s/img_top/bnn_mile_sp.jpg);
}

#top #content #contentBody #main #pickup ul.banner li a {
	display: block;
	width: 300px;
	height: 87px;
	text-indent: -9999px;
	background-position: 0 0;
	background-repeat: no-repeat;
	background-size: contain;
	overflow: hidden;
}

#top #content #contentBody #main #pickup ul.banner li a:hover {
	filter: alpha(opacity=100);
	-moz-opacity:1;
	opacity:1;
}

#top #content #contentBody #main #pickup #news h3 {
	margin-bottom:0;
	padding: 0;
	width: 300px;
	height: 25px;
	overflow: hidden;
	text-indent: -9999px;
	background: url(/s/img_top/news_h2_sp.png) no-repeat 0 0;
	background-size: 100%;
	border-bottom:2px solid #3cbbef;
}

#top #content #contentBody #main #pickup h3 a.list {
	position: absolute;
	top: 3px;
	left: 246px;
	display: block;
	width: 48px;
	height: 17px;
	background-position: 0 0;
	background-repeat: no-repeat;
	background-image: url(/s/img_top/pickup_list_btn_sp.png);
	background-size: 100%;
	text-indent: -9999px;
	overflow: hidden;
}

#top #content #contentBody #main #pickup h3 a.list:hover {
	background-position: 0 0;
}

#top #content #contentBody #main #pickup dl {
	padding: 10px 0 9px;
	border-bottom:1px solid #80d2f4;
	overflow: hidden;
	background: none;
	box-sizing: border-box;
}

#top #content #contentBody #main #pickup dl dt {
	float: left;
	padding-left: 5px;
	width: 80px;
	font-size: 90%;
	line-height: 1.5;
	text-align: left;
	color: #333;
}

#top #content #contentBody #main #pickup dl dd {
	float: left;
	width: 215px;
	font-size: 100%;
	line-height: 1.36;
}

#top #content #contentBody #main #pickup dl dd a {
	 color: #333;
}

#top #content #contentBody #main #pickup dl dd a:hover { color: #158fd6;}

#top #content #contentBody #main #pickup #news {
	float: left;
	margin-bottom: 15px;
	margin-right: 10px;
	width: 355px;
}

#top #content #contentBody #side #side_bnn {
	margin-bottom: 12px;
}

#top #content #contentBody #side #side_bnn ul li {
	margin-bottom: 10px;
	background: #FFF;
}

#top #content #contentBody #side #side_bnn ul li:last-child {
	margin-bottom: 0;
}

#top #content #contentBody #side #side_bnn ul li a {
	display: block;
	text-indent: -9999px;
	overflow: hidden;
	background-size: contain;
}

#top #content #contentBody #side #side_bnn ul li a:hover {
	filter: alpha(opacity=100);
	-moz-opacity:1;
	opacity:1;
}

#top #content #contentBody #side #side_bnn ul li#bnn_setupguide a {
	width: 300px;
	height: 85px;
	background-image: url(/s/img_top/smp/bnn_setupguide_sp.jpg)
}

#top #content #contentBody #side #side_bnn ul li#bnn_monde a {
	width: 300px;
	height: 85px;
	background-image: url(/s/img_top/smp/bnn_monde.jpg)
}

#top #content #contentBody #side #side_bnn ul li#bnn_lifter a {
	width: 300px;
	height: 85px;
	background-image: url(/s/img_top/smp/bnn_lifter.jpg)
}

#top #content #contentBody #side #side_bnn ul li#bnn_radioactivity a {
	width: 300px;
	height: 85px;
	background-image: url(/s/img_top/smp/bnn_radioactivity.jpg)
}

#top #content #contentBody #side #side_bnn ul li#bnn_oteire a {
	width: 300px;
	height: 85px;
	background-image: url(/s/img_top/smp/bnn_oteire.jpg);
}

#top #content #contentBody #side #side_bnn ul li#bnn_selfmaintenance a {
	width: 300px;
	height: 85px;
	background-image: url(/s/img_top/smp/bnn_selfmaintenance.jpg);
}

#top #content #contentBody #side #mobile_site {
	display: none;
}

#top #content #contentFooter {
	margin-top: 15px;
	display: block;
}
