@charset "utf-8";

/* Global Styles */
a:hover {
	color: rgba(255,255,255,1.00);
}

/* --------------------------
	default style.
----------------------------- */

/* --------------------------
	大外の枠
----------------------------- */

/* Whole page content */
#mainWrapper {
	width: 80%; max-width: 1000px;
	padding-left: 10%;
	padding-right: 10%;
}

#container {
	clear:both;
	font-family: "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
	font-size: 11px;
	display:block;
	margin:auto;
	padding:0;
	width:888px;
	background-color: #FFFFFF;
	}

/* Media query for tablets */
@media screen and (max-width : 3000px ){
	#mainWrapper nav {
		display: none;
	}
	#mainWrapper .snapwidget-widget{
	display: inherit;
	width: 100%;
	}
	#mainWrapper .snapwidget-widget2{
	display: none;
	}
	#mainWrapper .snapwidget-widget3{
	display: none;
	}
	#mainWrapper .smest{
	display: none;
	}
}
/* Media query for tablets */
@media screen and (max-width : 700px ){
	#mainWrapper nav {
		display: none;
	}
	#mainWrapper .snapwidget-widget{
	display: none;
	width: 100%;
	}
	#mainWrapper .snapwidget-widget2{
	display: inherit;
	}	
	#mainWrapper .snapwidget-widget3{
	display: none;
	}
	#mainWrapper .smest{
	display: none;
	text-align: center;
	font-size: 14px;
	}
}
/*media query for small screen devices */
@media screen and (max-width:480px) {
	#content .sidebar {
		display: none;
	}
	#mainWrapper header {
		display: none;
	}
	#mainWrapper nav {
		display:inherit;
	}

	#mainWrapper .snapwidget-widget{
	display: none;
	}
	#mainWrapper .snapwidget-widget2{
	display: none;
	}
	#mainWrapper .snapwidget-widget3{
		display: inherit;
	width: 100%;
	}
	#mainWrapper .smest{
	display: inherit;
	}	
    nav{
     width: 100%;
     height: 50px;
     position: relative;
     background: #F6F6F6;
    }
    .drawer{
     display: flex;
     flex-direction: row;
     align-items: center;
     justify-content: space-between;
     position: relative;
     height: 70px;
     padding: 0 1em;
    }
    .navbar_toggle{
     z-index:9999;
    }
    .navbar_toggle_icon {
     position: relative;
     display: block;
     height: 2px;
     width: 30px;
     background: #5c6b80;
     -webkit-transition: ease .5s;
     transition: ease .5s;
    }
    .navbar_toggle_icon:nth-child(1) {
     top: 0;
    }
    .navbar_toggle_icon:nth-child(2) {
     margin: 8px 0;
    }
    .navbar_toggle_icon:nth-child(3) {
     top: 0;
    }
    /*OPEN時の動き*/
    .navbar_toggle.open .navbar_toggle_icon:nth-child(1) {
     top: 10px;
     -webkit-transform: rotate(45deg);
     transform: rotate(45deg);
    }
    .navbar_toggle.open .navbar_toggle_icon:nth-child(2) {
     -webkit-transform: translateY(-50%);
     transform: translateY(-50%);
     opacity: 0;
    }
    .navbar_toggle.open .navbar_toggle_icon:nth-child(3) {
     top: -10px;
     -webkit-transform: rotate(-45deg);
     transform: rotate(-45deg);
    }	

    .menu{
     -webkit-transform: translateX(-100%);
     transform: translateX(-140%);
     -webkit-transition:ease .5s;
     transition:ease .5s;
     z-index:1000;
	background:#FFFFFF;
    }
    .menu ul li{
     padding: 1em;
     border-bottom: 1px solid #CCC;
    }
    .menu ul li a img{
		width: 250px;
	}
    /*OPEN時の動き*/
    .menu.open {
     -webkit-transform:translateX(0);
     transform:translateX(0);
     overflow-y: auto;
     -webkit-overflow-scrolling: touch;
    }	
	#mainContent table tr td iframe .snapwidget-widget{
	width: 100%;
	height: 50px;
	font-size: 9px;
	text-align: center;
	}
	#mainContent #content {
		clear: both;
		overflow: auto;
		padding-top: 29px;
		z-index: 100000;
	}	
}

/* --------------------------
	メインエリア
----------------------------- */


#content {
	clear: both;
	overflow: auto;
	padding-top: 15px;
}

/* --------------------------
	上部ヘッダエリア（主に画像）
----------------------------- */

/*header*/
header {
	font-family: 'Montserrat', sans-serif;
	color: rgba(146,146,146,1.00);
	font-size: 16px;
	font-style: normal;
	font-weight: 400;
}
header p img {
	width: 100%;
}


/* Offer text banner*/
#offer {
	font-family: 'Montserrat', sans-serif;
	clear: both;
	background-color: rgba(246,246,246,1.00);
	color: rgba(146,146,146,1.00);
	padding-left: 2%;
	padding-right: 2%;
	padding-top: 6px;
	padding-bottom: 2px;
	margin-top: 5px;
}
#offer img {
	width: 100%;
}




/* --------------------------
	左部ナビゲーション
----------------------------- */

/* Sidebar */
#content .sidebar {
	font-family: 'Montserrat', sans-serif;
	color: rgba(146,146,146,1.00);
	float: left;
	width: 20%;
	padding-left: 3%;
	padding-right: 3%;
	text-align: center;
	background-color: rgba(246,246,246,1.00);
	padding-top: 10px;
	padding-bottom: 10px;
	height: auto;
}

/*menubar's properties for menus in sidebar */
#content .sidebar #menubar {
	text-align: left;
	color: rgba(146,146,146,1.00);
	position: relative;
	left: 0%;
}

/*Links in sidebar */
.sidebar #menubar .menu ul li a {
	color: rgba(146,146,146,1.00);
	text-decoration: none;
}
.sidebar #menubar .menu ul li a:hover {
	color: rgba(107,97,97,1.00);
	text-decoration: none;
}
.sidebar #menubar .menu ul li a img {
	width: 100%;
}


/* Menu headings in sidebar */
#menubar .menu {
	padding-top: 15px;
}
#menubar .menu h2 {
	text-align: center;
	font-size: 14px;
}
#menubar .menu p {
	text-align: center;
	font-size: 14px;
}

/*Links under menus in sidebar */
#menubar .menu ul li a {
	font-size: 16px;
}
/* Menus in sidebar */
.sidebar #menubar .menu {
	margin-bottom: 0px;
}
/*menu elements */
.menu ul li {
	list-style-type: none;
	font-size: x-large;
	position: relative;
	left: -35px;
	right: auto;
	padding-top: 0px;
	width: 120%;
}

.block {
	width:100%;
	margin-left:auto;
	margin-right:auto;
	padding:10px 0 0 0;
	}
.box {
	width:100%;
	height:50px;
	color:#333333;
	padding:0px 0px 5px 0px;
	display:block;
	float:left;
	}
.box a {
	color:#333333;
	text-decoration:none;
	}
.box p {
	color:#333333;
	}
.box img{
	border:none;
	width:100%;
	height:auto;
	}
.flrclr {
	clear:both;
	font-size:1px;
	line-height:1px;
	text-decoration:nont;
	border:none;
	}


/* --------------------------
	メインコンテンツエリア
----------------------------- */

/* main content of the site */
#content .mainContent {
	float: left;
	width: 70%;
	text-align: center;
	padding-left: 4%;
}
#mainContent {
	float:right;
	margin: 10px 0 15px 3px;
	width: 696px;
	border: 1px #bd904a solid;
	padding-left:auto;
	padding-right:auto;
	text-align:center;
	} 
#content .mainContent img {
	width: 100%;
}

/* --------------------------
	newsエリア
----------------------------- */
#content .whatsnew {
	float: left;
	width: 70%;
	padding-left: 4%;
}
#mainWrapper .whatsnew2 {
	display: none;
}
@media screen and (max-width : 700px ){
#mainWrapper .whatsnew2 {
	display: none;
}
#content .whatsnew {
	float: left;
	width: 90%;
	padding-left: 4%;
}
}
.whatsnew h2{
	font-family: "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
	font-size: 20px;
	line-height:1.3em;
	display:block;
	padding:20px 0px 15px 0px;
	margin:0;
	text-align: center
	}
.whatsnew h3{
	font-family: "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
	font-size: 14px;
	text-decoration: underline;
	line-height:1.3em;
	display:block;
	padding:20px 0px 5px 15px;
	margin:0;
	text-align: left
	}
.whatsnew p{
	font-family: "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
	font-size: 12px;
	line-height:1.3em;
	text-align:left;
	padding:0px 0px 0px 15px;
	}
@media screen and (max-width : 480px ){
#mainWrapper .whatsnew {
	display: none;
}
#mainWrapper .whatsnew2 {
	display: inherit;
}
.whatsnew2 h2{
	font-family: "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
	font-size: 16px;
	line-height:1.3em;
	display:block;
	padding:20px 0px 15px 15px;
	margin:0;
	text-align: left;
	}
.whatsnew2 h3{
	font-family: "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
	font-size: 12px;
	text-decoration: underline;
	line-height:1.3em;
	display:block;
	padding:20px 0px 5px 15px;
	margin:0;
	text-align: left;
	}
.whatsnew2 p{
	font-family: "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
	font-size: 12px;
	line-height:1.3em;
	text-align:left;
	padding:0px 0px 0px 15px;
	}
}
/* --------------------------
	下部フッターエリア
----------------------------- */

/* footer */
#mainWrapper footer {
	clear: both;
	overflow: auto;
	background-color: #F6F6F6;
	font-family: source-sans-pro, sans-serif;
	font-style: normal;
	line-height: 1.0;
	padding: 5px 5px 5px 5px;
	text-align: center;
}

.fblock {
	width:100%;
	margin-left:auto;
	margin-right:auto;
	padding:0 0 0 0;
	}
.fbox {
	width:33%;
	height:auto;
	color:#333333;
	padding:0px 0px 0px 0px;
	display:block;
	float:left;
	}
.fbox a {
	color:cornflowerblue;
	text-decoration:underline;
	}
.fbox p {
	color:#333333;
	padding:0px 0px 0px 0px;
	height: auto;
	}
.fbox img{
	border:none;
	width:60%;
	height: auto;
	}
.fflrclr {
	clear:both;
	font-size:1px;
	line-height:1px;
	text-decoration:nont;
	border:none;
	}
@media screen and (max-width : 700px ){
.fblock {
	width:100%;
	margin-left:auto;
	margin-right:auto;
	padding:0 0 0 0;
	}
.fbox {
	width:100%;
	height:auto;
	color:#F6F6F6;
	padding:0px 0px 0px 0px;
	display:block;
	float:left;
	}
.fbox a {
	color:#333333;
	text-decoration:none;
	}
.fbox p {
	color:#333333;
	padding:0px 0px 0px 0px;
	height: auto;
	}
.fbox img{
	border:none;
	width:50%;
	height:auto;
	}
.fflrclr {
	clear:both;
	font-size:1px;
	line-height:1px;
	text-decoration:nont;
	border:none;
	}
}
/* --------------------------
	フロートクリアパーツ
----------------------------- */

/* Media query for tablets */
@media screen and (max-width : 700px ){
/* search field in sidebar */
#content .sidebar #search {
	display: none;
}
/* sidebar */
#content .sidebar {
	float: none;
	width: 100%;
	height: auto;
	overflow: auto;
	margin-top: 20px;
	padding-left: 5%;
	padding-top: 10px;
}
/* horizontal separators in sidebar */
#content .sidebar hr {
	display: none;
}
/*The sidebar and maincontent of page */
#content {
	position: relative;
	top: -22px;
	width: 100%;
	overflow: hidden;
}
/*menu headings in sidebar */
#menubar .menu h2 {
	padding-left: 30px;
	display: inline;
	font-size: medium;
	padding-right: 6%;
}
/* Menu headings in sidebar */
#menubar .menu {
	padding-left: 30px;
	padding-top: 5px;
}
#menubar .menu p {
	text-align: center;
	font-size: 14px;
}	
	
/* Unordered List of links */
#menubar .menu ul {
	display: inline;
	line-height: 3;
}
/*list elements */
#menubar .menu ul li {
	display: inline;
	font-size: medium;
	padding-left: 0%;
	padding-right: 20%;
}
.sidebar #menubar .menu ul li a img {
	width: 50%;
}
/*The link to be hidden in tablet view */
.sidebar #menubar .menu ul .notimp {
	display: none;
}
/* menus in sidebar */
.sidebar #menubar .menu {
	width: 100%;
	text-align: center;
	position: relative;
	top: 5px;
}
.block {
	width:100%;
	margin-left:auto;
	margin-right:auto;
	padding:20px 0 10px 10px;
	}
.box {
	width:37%;
	height:70px;
	color:#333333;
	padding:0px 0px 0px 50px;
	display:block;
	float:left;
	}
.box a {
	color:#333333;
	text-decoration:none;
	}
.box p {
	color:#333333;
	}
.box img{
	border:none;
	width:100%;
	height:auto;
	}
.flrclr {
	clear:both;
	font-size:1px;
	line-height:1px;
	text-decoration:nont;
	border:none;
	}
	
	
/*menubar in sidebar */
#content .sidebar #menubar {
	position: relative;
	left: -10%;
	overflow: hidden;
	width: 95%;
	padding-top: 0px;
}
/* offer banners content */
#mainWrapper #offer p {
	font-size: small;
}
/* main content region of page */
#mainWrapper #content .mainContent {
	overflow: hidden;
	width: 95%;
	margin-top: 40px;
}
/* Prices of products in catalog view */
.productRow .productInfo .price {
	font-size: 19px;
}
/* Content holders in catalog view */
.productRow .productInfo .productContent {
	font-size: 16px;
}
/* Buy buttons in catalog view */
.productRow .productInfo .buyButton {
	font-size: 15px;
}
/* Container for links in footer */
#mainWrapper footer .footerlinks {
	float: none;
	width: 100%;
	position: relative;
	top: 17px;
	clear: both;
	text-align: center;
	left: 0%;
	padding-bottom: 19px;
}

/* Links in footer */
.footerlinks p a {
	padding-top: 0px;
	padding-bottom: 0px;
	display: inline;
	padding-right: 35px;
}

/* Links in header */
header #headerLinks a {
	padding-left: 0px;
	padding-right: 30px;
}
/* Offer- Text banner */
#mainWrapper #offer {
	padding-left: 2%;
	padding-right: 2%;
}
/* Paragraphs in footer */
footer .footerlinks p {
	display: inline;
}
}