/***************************************************************************************************
*
*	includes_sp.css
*
***************************************************************************************************/

/*--------------------------------------------------------------------------------------------------
-	main navigation (SP max-width: 640px)
--------------------------------------------------------------------------------------------------*/
@media screen and (max-width: 640px) {
	body{
		overflow-x: hidden;
	}
	#contentHeader *,
	#contentFooter *{
		box-sizing:border-box;
		-webkit-box-sizing:border-box;
	}
	
	#contentHeader{
		min-width:initial;
		min-width:auto;
		width:100%;
		height:50px;
		margin:0;
		background:none;
	}
	#contentBody{
		/*border-top: solid 5px #333;*/
	}
	#contentBody.home{
		margin-top: 5px;
	}
	#navigation{
		position:relative;
		height:50px;
		background:white;
	}
	
	#navigation .inner{
		width:100%;
		margin:0;
	}
	
	#navigation #headerLogo{
		float:left;
		width:126px;
		margin:10px 0 0 10px;
	}
	
	#navigation #headerLogo img{
		display:block;
		width:100%;
		height:auto;
	}
	
	#navigation .right{
		float:none;
		position:absolute;
		width:100%;
		
	}
	#navigation .sns{
		display: none;
	}
	#toEnglish{display:none;}
	#toEnglishSP{
		display:block;
		background:#414141;
		border:2px solid #7a7a7a;
		border-radius:10px;
		overflow:hidden
	}
	#toEnglishSP{
		position:absolute;
		bottom:13px;
		right:10px;
	}
	#toEnglishSP strong,
	#toEnglishSP span{
		display:inline-block;
		width:52px;
		padding:5px;
		color:#ffffff;
		text-align:center;
		font-size:14px;
		font-weight:bold;
	}
	
	#toEnglishSP strong{
		background:#111111;
		
	}
	#toEnglishSP span{
		border-left:2px solid #7a7a7a;
	}
	#mainNavi{
		display:none;
		float:none;
		position:relative;
		top:50px;
		width:100%;
		height:auto;
		margin:0 0 0 0;
		padding:0 0 60px 0;
		background:#414141;
		border-top:4px solid #827349;
		box-shadow:0px 6px 4px rgba(0,0,0,0.4);
		overflow:hidden;
	}
	
	#mainNavi .mainList{
		display:block;
		width:100%;
		height:auto;
		background:none;
	}
	
	#mainNavi .mainList > a span{display:inline-block;padding:0 0 0 1em;}
	
	#spButton{
		display:block;
		position:absolute;
		bottom:0;
		right:10px;
		width:36px;
		height:36px;
		overflow:hidden;
		z-index:2;
	}
	
	#spButton:before{
		content: "";
		display: block;
		position: absolute;
		left: 50%;
		width: 40px;
		height: 22px;
		margin: 6px 0 0 -24px;
		background: url(../img/includes.png) no-repeat -104px 0;
		background-size: 280px auto;
	}
	
	#spButton.on{
		background:#c2a551;
		border-radius:6px 6px 0 0;
	}
	
	#spButton.on:before{
		width: 26px;
		height: 34px;
		background-position: -216px -32px;
		margin: 0 0 0 -13px;
	}
	#mainNavi #n0,
	#mainNavi #n1,
	#mainNavi #n2,
	#mainNavi #n3,
	#mainNavi #n4,
	#mainNavi #n5,
	#mainNavi #n6{width:100%;text-align:left;}
	#mainNavi #n6{display:none;}
	#mainNavi #n0{display:block;}
	#mainNavi #n1{
		border-top: 2px solid #827349;
	}
	#mainNavi #n0 > ul{
		display:table;
		width:100%;
		height:90px;
		margin:15px 0 15px 0;
	}
	#mainNavi #n0 > ul li{
		display:table-cell;
		width:33.3%;
		border-right:1px solid #ffffff;
		text-align:center;
		vertical-align:bottom;
	}
	#mainNavi #n0 > ul li:last-child{
		border-right:none;
	}
	
	#mainNavi #n0 > ul li a{
		display:block;
		width:100%;
		height:100%;
		padding:4px 0 0 0;
		color:#ffffff;
		font-size:14px;
		text-decoration:none;
	}
	
	#mainNavi #n0 > ul li a:before{
		content:"";
		display:block;
		width:34px;
		height:34px;
		margin:0 auto 20px auto;
		overflow:hidden;
		background:url(../img/includes.png) no-repeat 0 0;
		background-size:280px auto;
	}
	
	#mainNavi #n0 > ul li.n0-1 a:before{background-position:-112px bottom;}
	#mainNavi #n0 > ul li.n0-2 a:before{background-position:-148px bottom;}
	#mainNavi #n0 > ul li.n0-3 a:before{background-position:-183px bottom;}
	
	#mainNavi .mainList > a{
		display:block;
		position:relative;
		width:100%;
		height:100%;
		padding:10px;
		text-align:left;
		font-size:16px;
		font-weight:normal;
		text-decoration:none;
		color:#ffffff;
		border-bottom:2px solid #827349;
	}
	#mainNavi .mainList > a:hover{
		border-bottom:2px solid #827349;
		color:#ffffff;
		text-decoration:none;
	}
	
	#mainNavi .mainList > a:before,
	#mainNavi .mainList > a:after{
		content:"";
		display:block;
		position:absolute;
		top:50%;
		width:1px;
		height:20px;
		margin-top:-13px;
		background:no-repeat 0 0;
	}
	
	#mainNavi .mainList > a:after{
		content: "";
		top: 50%;
		right: 15px;
		width: 12px;
		height: 16px;
		margin: -8px 0 0 0;
		background: url(../img/includes.png) no-repeat -250px bottom;
		background-size: 280px auto;
		transform: rotate(90deg);
		-webkit-transform: rotate(90deg);
		-ms-transform: rotate(90deg);
	}
	
	#mainNavi #n1.mainList > a:after {
		transform:none;
		-webkit-transform:none;
		-ms-transform:none;
	}
	
	#mainNavi .mainList > a.on:before{
		top: 50%;
		right: 11px;
		width: 21px;
		height: 21px;
		margin: -10px 0 0 0;
		background-color:#333333;
		border-radius:6px;
	}

	#mainNavi .mainList > a.on:after{
		background-position:-108px bottom;
		background-size: 140px auto;
		right: 13px;
	}
	
	#mainNavi #n1 > a:before{background-image:none;left:0;}
	
	/* Žb’è */
	#hdrgnav01 #navigation .inner ul #n1 > a,
	#hdrgnav02 #navigation .inner ul #n2 > a,
	#hdrgnav04 #navigation .inner ul #n3 > a,
	#hdrgnav03 #navigation .inner ul #n4 > a,
	#hdrgnav07 #navigation .inner ul #n5 > a,
	#hdrgnav06 #navigation .inner ul #n6 > a{border-color:#827349;}
	
	/*--------------------------------------------------------------------------------------------------
	-	sub navigation (SP max-width: 640px)
	--------------------------------------------------------------------------------------------------*/
	#mainNavi .subNavi{
		overflow:hidden;
		position:static;
		top:auto;
		left:auto;
		width:100%;
		height:auto;
		background:#666666;
	}
	
	#mainNavi .subNavi .parent{
		width:100%;
		margin:0 auto;
	}
	
	#n1s,#n2s,#n3s,#n4s,#n5s,#n6s{display:none;}
	
	#mainNavi .subNavi .parent li{
		display:block;
		width:100%;
		height:auto;
		line-height:50px;
		margin:0 0 0 0;
		padding:0 0 0 1em;
		background:none;
	}
	
	#mainNavi .subNavi .parent li > a{
		display:block;
		position:relative;
		width:100%;
		padding:0 0 0 1%;
		color:#ffffff;
		font-size:14px;
		font-weight:normal;
		border-bottom:2px solid #999999;
		text-decoration:none;
	}
	
	#mainNavi .subNavi .parent li:last-child > a{border-bottom:none;}
	
	#mainNavi .subNavi .parent li > a:before {
		display:none;
	}
	
	#mainNavi .subNavi .parent > li > a:after{
		content: "";
		position:absolute;
		top: 50%;
		right: 15px;
		width: 12px;
		height: 16px;
		margin: -8px 0 0 0;
		background: url(../img/includes.png) no-repeat -250px bottom;
		background-size: 280px auto;
	}
	
	#mainNavi .subNavi .parent .child{
		display:block;
		margin:0 0 0 1em;
	}
	#mainNavi .subNavi .parent .child li{
		display:block;
		width:auto;
		margin:0 0 0 0;
		
	}
	#mainNavi .subNavi .parent .child li > a{
		font-weight:normal;
		border-bottom:2px solid #999999;
	}
	
	/* #mainNavi .subNavi .parent .child li:last-child > a{border-bottom:none;} */
	
	#mainNavi .subNavi .parent .child li > a:before{
		content:"\30fb" !important;
		display:inline-block;
		padding:0 0 0 0;
		font-size:14px;
	}
	
	#mainNavi .subNavi .parent .child li > a:after{
		content: "";
		position:absolute;
		top: 50%;
		right: 15px;
		width: 12px;
		height: 16px;
		margin: -8px 0 0 0;
		background: url(../img/includes.png) no-repeat -250px bottom;
		background-size: 280px auto;
	}
	
	#mainNavi .subNavi .parent li > a:hover,
	#mainNavi .subNavi .parent .child li > a:hover{text-decoration:none;color:#ffffff;}
	
	/*--------------------------------------------------------------------------------------------------
	-	beneathNavi(SP 640px)
	--------------------------------------------------------------------------------------------------*/
	.beneathNavi{
		position: relative;
		top: 0;
		border-bottom: none;
		background: #787878;
	}
	#mainNavi .subNavi .parent .beneathNavi li{
		padding: 0;
	}
	#mainNavi .subNavi .parent .beneathNavi a{
		font-size: 14px;
		color: #fff;
	}
	#mainNavi .subNavi .parent .child .beneathNavi li > a{
		border-width: 1px;
	}
	#mainNavi .subNavi .parent .beneathNavi .menu{
		width: 100%;
		margin: 0 0;
		padding: 0;
	}
	#mainNavi .subNavi .parent .beneathNavi .menu li{
		float:none;
		width:100%;
		line-height: 1em;
		margin: 0;
	}
	#mainNavi .subNavi .parent .beneathNavi .menu li span{
		display: table-cell;
		height: 50px;
		padding: 0 2em 0;
		vertical-align: middle;
	}
	#mainNavi .subNavi .parent .beneathNavi .menu li:first-child{
		margin: 0;
	}
	#mainNavi .subNavi .parent .beneathNavi .menu li:first-child span
	{
		font-size: 14px;
		font-weight: normal;
	}
	.h212{height: auto;}
	.h246{height: auto;}
	.h146{height: auto;}
	.beneathNavi .menu li:before{
		content: "";
		padding-right: 0;
	}
	/*--------------------------------------------------------------------------------------------------
	-	pagetop(SP max-width: 640px)
	--------------------------------------------------------------------------------------------------*/
	#pageTop{
		display:inline-block;
		overflow:hidden;
		right:4px;
		bottom:32px;left:auto;
		width:40px;
		height:40px;
	}
	
	#pageTop.bottomEnd{
		/* position:absolute;
		right:4px;bottom:32px; */
	}
	
	#pageTop a{
		display:inline-block;
		float:none;
		width:40px;
		height:40px;
	}
	#pageTop a:before{
		content:"";
		display:inline-block;
		overflow:hidden;
		width:40px;
		height:40px;
		background:url(../img/includes.png);
		background-size:280px auto;
	}
	#pageTop a img{
		display:none;
	}
	
	
	/*--------------------------------------------------------------------------------------------------
	-	breadCrumb(SP max-width: 640px)
	--------------------------------------------------------------------------------------------------*/
	#breadCrumb{
		display:block !important;
		height:auto;
		width:100% !important;
		margin: 10px 0 15px !important;
	}
	
	#breadCrumb .inner{
		width:100%;
		height:auto;
		margin:0;padding:0;
	}
	
	#breadCrumb .inner ul{
		float:none;
		padding: 4px 2% 2px 2%;
		text-align:left;
	}
	#breadCrumb .inner ul li{
		display:inline-block;
		height:auto;
		line-height:1.8;
		font-size:12px;
	}
	#breadCrumb .inner ul li:after{
		content:">";
		display:inline-block;
		padding:0 0.5em 0 1em;
		color:#7a7a7a;
	}
	#breadCrumb .inner ul li.last:after{display:none};
	#breadCrumb .inner ul li a{font-size:12px;}
	
	/*--------------------------------------------------------------------------------------------------
	-	footer (SP max-width: 640px)
	--------------------------------------------------------------------------------------------------*/
	#contentFooter{}
	#contentFooter .inner{
		width:100%;
		margin:0;padding:0;
	}
	
	#contentFooter img{
		display:block;
		position:absolute;
		height:auto;
	}
	
	#footerNavi #instagram,
	#footerNavi #fb,
	#footerNavi #yt{
		position:relative;
		display:block;
		overflow:hidden;
	}
	
	#footerNavi{
		display:table;
		width:100%;
		height:auto;
		/* padding:0 0 20px 0; */
		background:#eeeeee;
		border-top:1px solid #cccccc;
	}
	#footerNavi #instagram{
		margin:9px 19px 19px 2%;
	}	
	#footerNavi #fb{
		display:inline-block;
		float:left;
		width:30px;
		height:30px;
		margin:10px 20px 20px 0;
	}
	#footerNavi #fb img{width:290px;left:-45px;}
	
	#footerNavi #yt{
		display:inline-block;
		float:left;
		width:34px;
		height:34px;
		margin:8px 20px 20px 0;
	}
	#footerNavi #yt img{width:280px;left:-76px;}
	
	#footerNavi .footerList{
		display:block;
		clear:both;
		float:none;
		width:96%;
		height:auto;
		margin:0 auto;
	}
	
	#footerNavi .footerList li{
		display:block;
		float:left;
		width:33.3%;
		height:19px;
		line-height:19px;
		margin:0 0 10px 0;
		padding:0 0 0 0;
		text-align:left;
		vertical-align:middle;
	}
	
	#footerNavi .footerList li:before{
		content:"\003e";
		display:inline-block;
		height:19px;
		line-height:19px;
		color:#887711;
		vertical-align:top;
		font-weight:bold;
	}
	
	#footerNavi .footerList li a{
		display:inline-block;
		color:#333333;
		padding:1px 0 0 0;
		font-size:12px;
	}
	#footerNavi .footerList li a:hover{color:#887711;}
	
	#contentFooter #copyright{
		width:100%;
		height:auto;
		padding:5px;
		line-height:20px;
		background:#424242;
		color:#ffffff;
		font-size:12px;
	}
	
}