/* General Demo Style */
@import url(http://fonts.googleapis.com/css?family=Lato:300,400,700);

@font-face {
	font-family: 'codropsicons';
	src:url('../fonts/codropsicons/codropsicons.eot');
	src:url('../fonts/codropsicons/codropsicons.eot?#iefix') format('embedded-opentype'),
		url('../fonts/codropsicons/codropsicons.woff') format('woff'),
		url('../fonts/codropsicons/codropsicons.ttf') format('truetype'),
		url('../fonts/codropsicons/codropsicons.svg#codropsicons') format('svg');
	font-weight: normal;
	font-style: normal;
}

*, *:after, *:before { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
body, html { font-size: 100%; padding: 0; margin: 0; height:100%; overflow-y: hidden; line-height: 1.8;}


/* Clearfix hack by Nicolas Gallagher: http://nicolasgallagher.com/micro-clearfix-hack/ */
.clearfix:before, .clearfix:after { content: " "; display: table; }
.clearfix:after { clear: both; }
ul{list-style:none; margin:0; padding:0;}
body {
	font-family: 'Lato', Calibri, Arial, sans-serif;
	color: #333;
	background: #FFF;
}

a {text-decoration: none;}
a, a:link, a:visited {
text-decoration: underline;
outline: none;
color: #999;
}
a:hover,
a:active {
	color: #333;
}

/* Header Style */
#logo{
	position:fixed;
	left: 47px;
	top: 47px;
	z-index:2010;
	}

/* Main Content */
::-webkit-scrollbar
{
        overflow:hidden;
        width:3px;
        background:#eee;
}
::-webkit-scrollbar:horizontal
        {
                height:5px; background:#eee;overflow:hidden;z-index:3000;
        }
::-webkit-scrollbar-button:horizontal
{
       background-color:#ff0000;
}
::-webkit-scrollbar-piece,::-webkit-scrollbar-button
{
       display:none;
}
::-webkit-scrollbar-piece:start
        {
                background:#eee;
        }
::-webkit-scrollbar-thumb
{
        background:#333;
}
::-webkit-scrollbar-corner
{
        background:#333;
}
#all{display:none;
height:100%;}
#loading{
	position:absolute;
	left:50%;
	top:40%;
	margin-left:-30px;
}

div.pane{
		overflow-y:hidden;
		overflow-x: scroll;
		clear:left;
		margin: 0;
		position:relative;
		width:100%;
		height:95%;
		-webkit-overflow-scrolling: touch;
	}

.products{
width: 100%;
height: 100%;
top: 0;
left: 0;
min-height:100%;
/*min-width: 900px;*/
min-height:660px;
-webkit-backface-visibility: visible;
background-position:50% 50%;
}
.fullWin{
width: 100%;
height: 100%;
min-height:100%;
min-width: 900px;
min-height:660px;
-webkit-backface-visibility: visible;
background-position:50% 50%;
}

h1 a:hover {
	text-decoration: none;
}

.modal-text h2{
	font-size: 28px;
	line-height: 1.2;
	padding: 0;
	margin: 3px 0 0;
}
.modal-text p{
	line-height: 1.8;
	margin-bottom: 10px;
	clear: left;
}

.modal-text p.spec{line-height:1.6; font-size:11px;}

/* To Navigation Style */
#nav {
	list-style: none;
	margin-bottom: 10px;
	position: fixed;
	left: 46px;
	top: 142px;
	z-index: 2000;
}
#nav li {
margin-bottom:20px;
}
#nav li a {
text-indent:-9999px;
height: 26px;
display: block;
width: 208px;
overflow:hidden;
}
#nav li.menu-story a{background:url(../img/menu.png) 0 0 no-repeat;}
#nav li.menu-collection a{background:url(../img/menu.png) 0 -42px no-repeat;}
#nav li.menu-contact a{background:url(../img/menu.png) 0 -84px no-repeat;}
#nav li.menu-order a{background:url(../img/menu.png) 0 -126px no-repeat;}
#nav li.menu-story a:hover{background:url(../img/menu.png) -213px 0 no-repeat;}
#nav li.menu-collection a:hover{background:url(../img/menu.png) -213px -42px no-repeat;}
#nav li.menu-contact a:hover{background:url(../img/menu.png) -213px -84px no-repeat;}
#nav li.menu-order a:hover{background:url(../img/menu.png) -213px -126px no-repeat;}

#subNavi{
	margin:0;
	padding:0;
	width:56px;
	position:absolute;
	right: 100px;
	top: 133px;
	z-index: 1000;
	}
#subNavi li{
	margin: 7px 0;
	}
#subNavi li a{
	background:url(../img/submenu.png) no-repeat;
	display:block;
	height:15px;
	text-indent:-9999px;
}
#subNavi li.subPopo a{background-position:0 0;}
#subNavi li.subPopo a:hover{background-position:-56px 0;}
#subNavi li.subMyu a{background-position:0 -20px;}
#subNavi li.subMyu a:hover{background-position:-56px -20px;}
#subNavi li.subQui a{background-position:0 -40px;}
#subNavi li.subQui a:hover{background-position:-56px -40px;}
#subNavi li.subKiki a{background-position:0 -60px;}
#subNavi li.subKiki a:hover{background-position:-56px -60px;}
#subNavi li.subGuu a{background-position:0 -80px;}
#subNavi li.subGuu a:hover{background-position:-56px -80px;}
#subNavi li.subMalloon a{background-position:0 -100px;}
#subNavi li.subMalloon a:hover{background-position:-56px -100px;}
#subNavi li.subPalloon a{background-position:0 -120px;}
#subNavi li.subPalloon a:hover{background-position:-56px -120px;}
#subNavi li.subBosco a{background-position:0 -140px;}
#subNavi li.subBosco a:hover{background-position:-56px -140px;}
#subNavi li.subForesco a{background-position:0 -160px;}
#subNavi li.subForesco a:hover{background-position:-56px -160px;}

.next{
	width: 100%;
	height: 70%;
	display: block;
	bottom: 0;
	position: absolute;
	z-index: 100;
	text-indent:-9999px;
	}
.next:hover{
	cursor:url(../img/down.png),pointer;
	}
.next.last:hover{
	cursor:url(../img/up.png),pointer;
	}

.close{position:absolute; top:50px; right:50px; z-index:2000;}
.md-close:hover{cursor:pointer;}

/*modal*/

.modal-text {
width: 319px;
padding: 20px 20px 10px;
background:rgba(255,255,255,0.7);
font-size:12px;
margin-bottom: 5px;
}
.num{
	text-align: right;
	font-size: 14px;
	color: #000;
}
.modal-content {
width:319px;
z-index: 200;
}
.contArea{
	position: absolute;
	bottom: 30px;
	left: 30px;
	z-index: 200;
}
.img_navi li{margin:0 5px 0 0; float:left; width:76px; height:76px; overflow:hidden;}
.img_navi li:last-child {margin:0;}

/*PAGES*/
#modal-story,#modal-collection,#modal-contact,#modal-order,#modal-privacy,#modal-guideline{
	z-index:1900;
	}
#modal-story .modal-text{
	background: none;
	top: 12%;
	left: 0;
	width: 100%;
	padding-left: 35%;
	padding-right: 200px;
	max-width: 1400px;
	position: absolute;
	z-index: 1200;
	}
#modal-story .modal-text h2{
	display:none;
	}
#modal-story .modal-text .storyText{margin-bottom:40px;}
#modal-story .modal-text .spec{
	text-align:right;
}
#modal-collection .modal-text.collection-text.show{opacity:1;}
#modal-collection .modal-text.collection-text{opacity:0; min-height:340px; position: fixed; bottom: 106px;}
#modal-collection .modal-text.collection-text img{float:left;}
#modal-collection .modal-text.collection-text h2{
	font-size: 14px;
	line-height: 1.6;
	height: 90px;
	padding: 0 0 0 10px;
	vertical-align: bottom;
	display: table-cell;
	}
#modal-collection .modal-text.collection-text h2 span{font-size:12px;}
#modal-contact .modal-text{
bottom: 10px;
position: absolute;
width: 680px;
top: 14%;
left: 30%;
z-index:2000;
}
#modal-contact .modal-text h2{display:none;}
#modal-contact input,#modal-contact textarea{margin-bottom: 10px;}
#modal-contact textarea{width: 300px;}
#modal-contact #mailform {float: left; width: 50%;}
#modal-contact address{
	font-style:normal;
	letter-spacing:0.1ex;
	line-height:1.8;
	float:right;
	width:200px;
	}
address #tIcon{padding-bottom:10px;}
#modal-contact input[type="text"] {
width: 300px;
}

#modal-privacy .modal-text h2{display:none;}
#modal-privacy .modal-text{
bottom: 10px;
position: absolute;
width: 680px;
top: 14%;
height: 70%;
overflow-y: auto;
left: 30%;
}

#modal-guideline .modal-text h2{font-size:14px;}
#modal-guideline .modal-text{
bottom: 10px;
position: absolute;
width: 680px;
top: 14%;
height: 70%;
overflow-y: auto;
left: 30%;
overflow-x:hidden;
}
#modal-guideline table{margin:1em 0;}
#modal-guideline table th{
text-align: left;
width: 120px;
}
#modal-guideline table caption{text-align:left; padding:5px;}

/*order*/
#modal-order .modal-text h2{display:none;}
#modal-order .modal-text{
bottom: 10px;
position: absolute;
/*width: 1084px;*/
width:76%;
top: 14%;
height: 80%;
right:0;
padding:0;
}
#modal-order .modal-text p{margin:0;}
#modal-order .modal-text p.spec{
margin-bottom: 24px;
font-size: 85%;
line-height:14px;
}
#modal-order select{
	border: 1px solid #999;
	-webkit-appearance: button;
	-moz-appearance: button;
	appearance: button;
	width: 34px;
	text-align: center;
	border-radius: 0px;
	padding:0 0 0 3px;
	background: #fff;
	height: 16px;
	background:url(../img/pulldown.gif) right top no-repeat;
	line-height:14px;
}
#modal-order div.item select.wideSelect{width:60px;}
#modal-order div.item select.fullwideSelect{width:100%; font-size:9px;}
div.item {
float: left;
width: 260px;
position: relative;
margin: 0 10px 20px 0;
}
div.items{clear:both;}
div.items.setContent{width:80%}
div.items.setContent div.item{margin-bottom:10px;}
div.item .productImg {
width: 140px;
float: left;
margin:8px;
}

div.item .productTxt form{
position: absolute;
bottom: 0;
padding: 0;
margin: 0;
height: 60px;
}
div.item .cartButton {
margin: 8px 0 0;
display: block;
}
div.item .productImg img{
	width:140px;
}
div.item.last {
/*margin: 0 0px 20px 0;*/
}
div.item.set{width:800px; margin-bottom:0; padding-bottom: 10px;}
div.item.set .productImg{width:430px;}
div.item.set .productImg img{ width:100%;}
div.item .productImg.setContentImg img{border:1px solid #eee;}
div.item.set .productTxt form .spec { margin: 0 0 1em;}
.gift-caution{clear:both; line-height:18px; margin:0 0 10px; padding:20px;}
.gift-caution li{color:#999;list-style:none; font-size:9px; background:url(../img/order/square.gif) top left no-repeat; padding-left:16px;}
.gift-caution li.last{margin:0;}*/
/*
div.item.set .productTxt.a{left:420px;}
div.item.set .productTxt.b{left:550px;}
div.item.set .productTxt.c{left:680px;}
div.item.set .gift-caution{line-height:1.6; margin: 0 0 10px; padding: 190px 14px 0 416px;}
div.item.set .gift-caution li{color:#999;list-style:none; font-size:9px; background:url(../img/order/square.gif) top left no-repeat; padding-left:16px;}
div.item.set .gift-caution li.last{margin:0;}*/
.info{margin-bottom:30px; padding:0 30px;}


/*

2014.8.18 幅調整

 */
#modal-order .modal-text {
bottom: 10px;
position:absolute;
width: 88%;
top: 14%;
height: 80%;
right: 0;
overflow-y: scroll;
overflow-x: hidden;
padding: 0;
padding: 0 0 0 200px;
margin:0;
}
div .items *,div .items *:after,div .items *:before{
	box-sizing:content-box;
}


div.item {
float: left;
width: 160px;
position: relative;
margin: 0 20px 20px 0;
/* background: #f6f6f6; */
padding: 20px;
}

div.item .productImg {
float: none;
margin: 0 0 5px;
}
div.item .productTxt {
position:relative;
width: 140px;
line-height: 22px;
z-index: 5;
font-size: 85%;
margin: 0;
padding: 0 5px;
float: left;
}
#modal-order .modal-text p.spec {
margin-bottom:0;
font-size: 85%;
line-height: 14px;
height: 7.6em;
white-space:nowrap;
}
div.item .productTxt form {
position:relative;
padding: 0;
margin: 0;
}
div.item.set .gift-caution {
line-height: 1.6;
margin: 0 0 10px;
padding: 12px 0;
clear: both;
}


.story{background: url(../img/story.jpg) bottom center no-repeat; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;}
.collection1{background: url(../img/collection1.jpg) bottom center no-repeat; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;}
.collection2{background: url(../img/collection2.jpg) bottom center no-repeat; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;}
.collection3{background: url(../img/collection3.jpg) bottom center no-repeat; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;}
.popo1{background: url(../img/popo1.jpg) bottom center no-repeat; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;}
.popo2{background: url(../img/popo2.jpg) bottom center no-repeat; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;}
.popo3{background: url(../img/popo3.jpg) bottom center no-repeat; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;}
.popo4{background: url(../img/popo4.jpg) bottom center no-repeat; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;}
.kiki1{background: url(../img/kiki1.jpg) bottom center no-repeat; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;}
.kiki2{background: url(../img/kiki2.jpg) bottom center no-repeat; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;}
.kiki3{background: url(../img/kiki3.jpg) bottom center no-repeat; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;}
.myu1{background: url(../img/myu1.jpg) bottom center no-repeat; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;}
.myu2{background: url(../img/myu2.jpg) bottom center no-repeat; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;}
.myu3{background: url(../img/myu3.jpg) bottom center no-repeat; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;}
.qui1{background: url(../img/qui1.jpg) bottom center no-repeat; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;}
.qui2{background: url(../img/qui2.jpg) bottom center no-repeat; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;}
.qui3{background: url(../img/qui3.jpg) bottom center no-repeat; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;}
.malloon1{background: url(../img/malloon1.jpg) bottom center no-repeat; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;}
.malloon2{background: url(../img/malloon2.jpg) bottom center no-repeat; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;}
.malloon3{background: url(../img/malloon3.jpg) bottom center no-repeat; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;}
.malloon4{background: url(../img/malloon4.jpg) bottom center no-repeat; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;}
.palloon1{background: url(../img/palloon1.jpg) bottom center no-repeat; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;}
.palloon2{background: url(../img/palloon2.jpg) bottom center no-repeat; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;}
.palloon3{background: url(../img/palloon3.jpg) bottom center no-repeat; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;}
.bosco1{background: url(../img/bosco1.jpg) bottom center no-repeat; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;}
.bosco2{background: url(../img/bosco2.jpg) bottom center no-repeat; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;}
.bosco3{background: url(../img/bosco3.jpg) bottom center no-repeat; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;}
.foresco1{background: url(../img/foresco1.jpg) bottom center no-repeat; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;}
.foresco2{background: url(../img/foresco2.jpg) bottom center no-repeat; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;}
.foresco3{background: url(../img/foresco3.jpg) bottom center no-repeat; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;}
.foresco4{background: url(../img/foresco4.jpg) bottom center no-repeat; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;}
.guu1{background: url(../img/guu1.jpg) bottom center no-repeat; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;}
.guu2{background: url(../img/guu2.jpg) bottom center no-repeat; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;}
.guu3{background: url(../img/guu3.jpg) bottom center no-repeat; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;}
.guu4{background: url(../img/guu4.jpg) bottom center no-repeat; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;}


@media screen and (max-height: 800px) {
	#nav,.icon,.contArea{ -webkit-transform:scale(0.8);}
	#nav{top:120px; left:26px;}
	#subNavi{top:133px;}
	#container{min-height: 560px;}
	.contArea{bottom:0; left:0;}
	#modal-collection .modal-text.collection-text{bottom:76px;}
	#modal-collection .contArea{bottom:30px; left:0;}
}

body {
    font: 13px/1.231 Arial, Helvetica, sans-serif;
	*font-size:small;
	*font:x-small;
	margin:0;
	padding:0;
	overflow:hidden;
}

#container{
	width:2552px;
	overflow-x: scroll;
	overflow-y:hidden;
	padding: 0;
	margin:0;
	height: 100%;
	position:relative;
	/*min-height: 700px;
	background:url(../img/bg_position.jpg) 0 0 no-repeat;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	*/
}
div.section {
	width: 440px;
	padding: 20px;
	height: 720px;
	float: left;
	margin-right: 2px;
}
/*icons*/

.icon{
	position:absolute;
	z-index:1000;
}
.icon:hover{
	z-index:2000;
}
.icon a{position:absolute;
	display:block;
	width: 100px;
	height: 100px;
	}
.icon-popo1{
	top: 33%;
	left: 10%;
	width: 208px;
	height: 212px;
	background:url(../img/icon_popo1.png) top left no-repeat;
	text-indent:-9999px;
	display:block;
	}
	.icon-popo1 a{
	bottom: -22px;
	right: -18px;
	}
.icon-kiki1{
	bottom: 15%;
	right: 36%;
	width:171px;
	height:151px;	
	background:url(../img/icon_kiki1.png) top left no-repeat;
	text-indent:-9999px;
	display:block;
	}
	.icon-kiki1 a{
	bottom: -26px;
	right: -20px;
	}
.icon-myu1{
	top: 20%;
	right: 13%;
	width:394px;
	height:189px;
	background:url(../img/icon_myu1.png) top left no-repeat;
	text-indent:-9999px;
	display:block;
	}
	.icon-myu1 a{
	top: 118px;
	right: -11px;
	}
.icon-qui1{
	bottom: 26%;
	left: 40%;
	width: 167px;
	height: 140px;
	background:url(../img/icon_qui1.png) top left no-repeat;
	text-indent:-9999px;
	display:block;
	}
	.icon-qui1 a{
	top: 67px;
	right: 33px;
	}
.icon-malloon1{
	top: 13%;
	left: 28%;
	width: 368px;
	height: 312px;
	background:url(../img/icon_malloon1.png) top left no-repeat;
	text-indent:-9999px;
	display:block;
	}
	.icon-malloon1 a{
	top: 229px;
	left: 136px;
	}
.icon-palloon1{
	top: 26%;
	left: 52%;
	width: 147px;
	height: 204px;
	background:url(../img/icon_palloon1.png) top left no-repeat;
	text-indent:-9999px;
	display:block;
	}
	.icon-palloon1 a{
	top: 125px;
	left: -3px;
	}
.icon-bosco1{
	bottom: 16%;
	left: 22%;
	width: 196px;
	height: 163px;
	background:url(../img/icon_bosco1.png) top left no-repeat;
	text-indent:-9999px;
	display:block;
	}
	.icon-bosco1 a{
	top: 74px;
	left: 108px;
	}
.icon-foresco1{
	bottom: 14%;
	right: 4%;
	width: 282px;
	height: 195px;
	background:url(../img/icon_foresco1.png) top left no-repeat;
	text-indent:-9999px;
	display:block;
	}
	.icon-foresco1 a{
	bottom: -22px;
	right: 14px;
	}
.icon-guu1{
	bottom: 25%;
	right: 25%;
	width: 173px;
	height: 120px;
	background:url(../img/icon_guu1.png) top left no-repeat;
	text-indent:-9999px;
	display:block;
	}
	.icon-guu1 a{
	top: 51px;
	right: 2px
	}

		
.up{z-index:2000;}
.hov{background-position:bottom left;}

.bg-container{
	width: 100%;
	height: 100%;
	position: fixed;
	top: 0;
	left: 0;
	opacity:0;
	-webkit-transition: all 0.3s cubic-bezier(0.0, 0.0, 0.58, 1.0) ;
	-moz-transition: all 0.3s cubic-bezier(0.0, 0.0, 0.58, 1.0) ;
	transition: all 0.3s cubic-bezier(0.0, 0.0, 0.58, 1.0) ;
	z-index: 900;
	}
.bg-popo{background: url(../img/popo0.jpg) 50% 50% no-repeat; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;}
.bg-kiki{background: url(../img/kiki0.jpg) 50% 50% no-repeat; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;}
.bg-myu{background: url(../img/myu0.jpg) 50% 50% no-repeat; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;}
.bg-qui{background: url(../img/qui0.jpg) 50% 50% no-repeat; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;}
.bg-malloon{background: url(../img/malloon0.jpg) 50% 50% no-repeat; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;}
.bg-palloon{background: url(../img/palloon0.jpg) 50% 50% no-repeat; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;}
.bg-bosco{background: url(../img/bosco0.jpg) 50% 50% no-repeat; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;}
.bg-foresco{background: url(../img/foresco0.jpg) 50% 50% no-repeat; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;}
.bg-guu{background: url(../img/guu0.jpg) 50% 50% no-repeat; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;}
	
.bg-show{
	opacity:1;
	z-index:1500;
	-webkit-transition: all 0.3s cubic-bezier(0.0, 0.0, 0.58, 1.0) ;
	-moz-transition: all 0.3s cubic-bezier(0.0, 0.0, 0.58, 1.0) ;
	transition: all 0.3s cubic-bezier(0.0, 0.0, 0.58, 1.0) ;
	}
#footer{
	position:absolute;
	bottom:0;
	left:0;
	line-height:20px;
	color:#999;
	display:block;
	width:100%;
	font-size:11px;
	padding:5px 30px;
	z-index:1900;
	}
#footer a{
	text-decoration:none;
	padding-left:20px;
	}
	
.clearfix:after,.item:after,div.item .productTxt form:after{
    content:""; 
    display: block; 
    clear: both; 
}
.clearfix, .item, div.item .productTxt form {display: inline-table;}
	/* スマートフォン (縦向き、横向き両対応) ----------- */
@media only screen and (min-device-width : 320px) and (max-device-width : 480px) {
.products,.fullWin{
min-height:100%;
min-width: 320px;
min-height:480px;
}
#nav {
position: fixed;
top: 50px;
left: 30px;
-webkit-transform:scale(0.8);}
#logo {
position: fixed;
left: 30px;
top: 0;
z-index: 2010;
}
#modal-order .modal-text {
bottom: 10px;
position: absolute;
width: 100%;
right: 0;
overflow-y: scroll;
overflow-x: auto;
padding: 0;
padding: 110px 0 0 0;
margin: 0;
}
div.item.set .productTxt{
	margin-bottom:20px;}
}

/* スマートフォン (縦向き) ----------- */
@media only screen and (max-width : 320px) {

	
}
/* iPads (縦向き、横向き両対応) ----------- */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) {
}
/* iPads (横向き) ----------- */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape) {
}
/* iPads (縦向き) ----------- */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait) {
}
/* デスクトップとノートPC ----------- */
@media only screen and (max-width : 1160px) {
div.item {
margin-right:10px;
}
#modal-order .modal-text {width:90%;}
}
/* デスクトップとノートPC ----------- */
@media only screen and (min-width : 1224px) {
}
/* デスクトップとノートPC ----------- */
@media only screen and (min-width : 1260px) {
	
}
/* 大きなディスプレイ ----------- */
@media only screen and (min-width : 1824px) {
	#modal-order .modal-text{}
}
/* iPhone 4および解像度密度の高いデバイス ----------- */
@media only screen and (-webkit-min-device-pixel-ratio : 1.5), only screen and (min-device-pixel-ratio : 1.5) {
}
/* スマートフォン (横向き) ----------- */
@media only screen and (max-width : 400px) {
#nav {
top: 50px;
left: 30px;
}
#logo {
position: fixed;
left: 30px;
top: 0;
z-index: 2010;
}
#modal-order .modal-text {
bottom: 10px;
position: absolute;
width: 100%;
right: 0;
overflow-y: scroll;
overflow-x: hidden;
padding: 0;
padding: 110px 0 0 0;
margin: 0;
}
div.item.set{
	width:400px;} 
div.item.set .productImg {
width: 360px;
overflow: hidden;
}
div.item.set .productTxt{
	margin-bottom:20px;}
}