@charset "utf-8";
/* CSS Document */

body{
	margin:0;
	padding:0;
	font-family: "游ゴシック", "Yu Gothic","ＭＳ ゴシック", "MS Gothic", "Osaka－等幅", "Osaka-mono", "monospace", sans-serif;
	font-weight:500;
}

ul,li{
	list-style:none;
	padding:0;
}

a{
	text-decoration: none;
	coursor:pointer;
}

a:visited{
	color:#333;
}

a:hover{
	opacity:0.8;
}

.show{
	dispaly:block;
}

.scroll_in{
    opacity: 1;
    transform: translate(0, 0);	
}

.brand_logo{
	margin:10px auto;
	text-align:center;
}

.m20{
	margin:20px auto !important;
}

.mb20{
	margin:0 auto 20px !important;
}

.m30{
	margin:30px auto 30px !important;	
}

.mb30{
	margin:0 auto 30px !important;
}

.m40{
	margin:40px auto 40px !important;	
}

.m50{
	margin:50px auto 50px !important;	
}

.brand_all{
	margin:0 auto 150px !important;
	background:#1f9cb5;
	color:#fff !important;
	border:1px solid #1f9cb5 !important;
	border-radius:10px;
}

.brand_all a{
	color:#fff !important;
}

@media screen and (min-width: 961px) {

	#sp{
		display:none;	
	}
	
	#drawerNav{
		display:none;	
	}

	a:hover{
		opacity:0.8;
	}
	
	#sideMenu{
		position:fixed;
		top:250px;
		right:0;
		width:80px;
		margin:0 auto;
		padding:20px 10px;
		background:#fff;
		z-index: 1000;
		display:none;
	}
	
	#sideMenu div{
		margin:0 auto;
		text-align:center;
	}
	
	#sideMenu ul li{
		width:60px;
		height:40px;
		margin:0 auto 10px;
	}
	
	#sideMenu ul li:nth-child(1){
		background:#212849;
	}
	
	#sideMenu ul li:nth-child(2){
		background:#b6a681;
	}
	
	#sideMenu ul li:nth-child(3){
		background:#ffffff;
		box-sizing:border-box;
		border:1px solid #919191;
	}

	#sideMenu ul li:nth-child(4){
		background:#ba222a;
	}
	
	#sideMenu ul li:nth-child(5){
		background:#5d744c;
	}
	
	#sideMenu ul li:nth-child(6){
		background:#797979;
	}
	
	#sideMenu ul li:nth-child(7){
		background:#522d75;
	}
	
	#sideMenu ul li:nth-child(8){
		background:#222222;
	}

	#sideMenu ul li a{
		width:100%;
		height:100%;
		display:block;
		coursor:pointer;
	}
	
	#container{
		width:100%;
		margin:0 auto;
		position:relative;
		z-index:999;
	}

	#saleHead{
		width:100%;
		margin:0 auto;
		padding:20px 0 10px;
		text-align:center;
		/*
		border-bottom:2px solid #ccc;
		box-shadow:1px 1px 4px 4px rgba(0, 0, 0, 0.2);
		*/
	}

	#wrap{
		width:100%;
		margin:0 auto 40px;
	}

	#main_visual{
		width:100%;
		margin:0px auto 0;
		text-align:center;
		background:#fdffec;
	}
	
	#main_visual div{
		margin:0 auto;
		padding:80px 0 60px;
		text-align:center;
	}

	#header_txt{
		width:100%;
		margin:100px auto;
		text-align: center;
		font-size:17px;
		line-height:2.5em;
		letter-spacing:0.1em;
	}
	
	#palette{
		width:600px;
		margin:50px auto;
	}
	
	#palette .palette_title{
		margin:0 auto;
		text-align:center;
	}
	
	#palette .palette_title h3{
		margin:0 auto;
		font-size:40px;
		font-family: "ROBOTO","游ゴシック", "Yu Gothic","ＭＳ ゴシック", "MS Gothic", "Osaka－等幅", "Osaka-mono", "monospace";
		font-style:italic;
		letter-spacing:0.05em;
	}
	
	#palette .palette_title hr{
		width:370px;
		height:2px;
		background:#000;
		border:0;
	}
	
	#palette ul{
		width:530px;
		margin:50px auto 0;
		overflow:hidden;
		display:flex;
		flex-wrap: wrap;
		justify-content: space-between;
		align-items: center;
		align-content:space-between;
	}
	
	#palette ul li{
		margin:0 2.5% 30px;
	}
	
	#palette ul li a{
		color:#1d1d1d;
	}
	
	#palette ul li:hover{
		opacity:0.8;
	}
	
	#palette ul li .color_name{
		margin:10px auto 0;
		font-size:18px;
		font-weight:bold;
		text-align:center;
		font-family: "ROBOTO","游ゴシック", "Yu Gothic","ＭＳ ゴシック", "MS Gothic", "Osaka－等幅", "Osaka-mono", "monospace" , sans-serif;
		/*font-family:-apple-system, BlinkMacSystemFont, "ROBOTO" , san-serif;*/
		font-style:italic;
	}
	
	.white{
		height:104px;
		width:104px;
		background:#ffffff;
	    box-sizing: border-box;
    	border: solid 1px #919191;
	}
	
	.khaki{
		height:104px;
		width:104px;
		background:#5d744c;
	}
	
	.purple{
		height:104px;
		width:104px;
		background:#522d75;
	}
	
	.beige{
		height:104px;
		width:104px;
		background:#b6a681;
	}
	
	.gray{
		height:104px;
		width:104px;
		background:#797979;
	}
	
	.navy{
		height:104px;
		width:104px;
		background:#212849;
	}
	
	.red{
		height:104px;
		width:104px;
		background:#ba222a;
	}
	
	.black{
		height:104px;
		width:104px;
		background:#222222;
	}
	
	#color_body{
		width:100%;
		margin:0 auto;
	}
	
	#color_body .color_wrap{
		width:930px;
		margin:0 auto;
		background:#fff;
	}
	
	#color_body #white{
		width:100%;
		background:#f6f6f6;
		margin:0 auto;
		padding:80px 0;
	}
	
	#color_body #khaki{
		width:100%;
		background:#5d744c;
		margin:0 auto;
		padding:80px 0;
	}
	
	#color_body #purple{
		width:100%;
		background:#522d75;
		margin:0 auto;
		padding:80px 0;
	}
	
	#color_body #beige{
		width:100%;
		background:#b6a681;
		margin:0 auto;
		padding:80px 0;
	}
	
	#color_body #gray{
		width:100%;
		background:#797979;
		margin:0 auto;
		padding:80px 0;
	}
	
	#color_body #navy{
		width:100%;
		background:#212849;
		margin:0 auto;
		padding:80px 0;
	}
	
	#color_body #red{
		width:100%;
		background:#ba222a;
		margin:0 auto;
		padding:80px 0;
	}
	
	#color_body #black{
		width:100%;
		background:#222222;
		margin:0 auto;
		padding:80px 0;
	}
	
	.color_title{
		margin:0 auto;
		padding:80px 0 0;
		text-align:center;
	}
	
	.color_text{
		width:70%;
		margin:40px auto 0;
		font-size:17px;
		line-height:1.7em;
	}
	
	.color_item{
		width:90%;
		margin:0px auto 0;
		padding:70px 0;
		clear:both;
	}
	.color_item ul{
		width:100%;
		margin:0 auto;
		overflow:hidden;
	/*
		display:flex;
		flex-wrap: wrap;
		justify-content: space-between;
		align-content:space-between;
	*/
	}
/*
	.color_item ul::after{
		content:"";
		display: block;
		width:30%;
	}
*/
	.color_item ul li{
		float:left;
		width:30.3%;
		height:auto;
		margin:2% 1.5% 0;
	}
	
	.color_item ul li img{
		width:100%;
	}

	.more_item{
		width:275px;
		height:25px;
		padding:1em 0;
		margin:60px auto 0;
		position: relative;
		font-size:14px;
		font-weight:bold;
		text-align:center;
		/*border:1px solid #333;*/
	}
	
	#white .more_item{
		border:1px solid #919191;
		background:#919191;
		color:#fff;
	}
	
	#white .more_item:hover{
		border:1px solid #919191;
		background:#fff;
		color:#919191;
	}
	
	#white .more_item a:hover{
		color:#503830;
	}
	
	#khaki .more_item{
		border:1px solid #5d744c;
		background:#5d744c;
		color:#fff;
	}
	
	#khaki .more_item:hover{
		border:1px solid #5d744c;
		background:#fff;
		color:#fff;
	}
	
	#khaki .more_item a:hover{
		color:#5d744c;
	}
	
	#purple .more_item{
		border:1px solid #522d75;
		background:#522d75;
		color:#fff;
	}
	
	#purple .more_item:hover{
		border:1px solid #522d75;
		background:#fff;
		color:#522d75;
	}
	
	#purple .more_item a:hover{
		color:#522d75;
	}
	
	#beige .more_item{
		border:1px solid #b6a681;
		background:#b6a681;
		color:#fff;
	}
	
	#beige .more_item:hover{
		border:1px solid #b6a681;
		background:#fff;
		color:#b6a681;
	}
	
	#beige .more_item a:hover{
		color:#b6a681;
	}
	
	#gray .more_item{
		border:1px solid #797979;
		background:#797979;
		color:#fff;
	}
	
	#gray .more_item:hover{
		border:1px solid #797979;
		background:#fff;
		color:#797979;
	}
	
	#gray .more_item a:hover{
		color:#797979;
	}
	
	#navy .more_item{
		border:1px solid #212849;
		background:#212849;
		color:#fff;
	}
	
	#navy .more_item:hover{
		border:1px solid #212849;
		background:#fff;
		color:#212849;
	}
	
	#navy .more_item a:hover{
		color:#212849;
	}
		
	#red .more_item{
		border:1px solid #ba222a;
		background:#ba222a;
		color:#fff;
	}
	
	#red .more_item:hover{
		border:1px solid #ba222a;
		background:#fff;
		color:#ba222a;
	}
	
	#red .more_item a:hover{
		color:#ba222a;
	}
		
	#black .more_item{
		border:1px solid #222222;
		background:#222222;
		color:#fff;
	}
	
	#black .more_item:hover{
		border:1px solid #222222;
		background:#fff;
		color:#222222;
	}
	
	#black .more_item a:hover{
		color:#222222;
	}
	
	.more_item a{
		display: block;
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		padding:1.2em 0;
		color:#fff;
	}
	
	.more_item a:hover{
		color:#fff;
		opacity:1;
	}
	
	.sp_footer{
		display:none;
	}
	
	#footerFrame{
		height: 440px;
		width: 100%;
		margin: 0px auto;
		border-top-style: none;
		border-right-style: none;
		border-bottom-style: none;
		border-left-style: none;
		padding-top: 1px;
	}
}
@media only screen and (min-width: 641px) and (max-width: 960px) {
/*
	#sideMenu{
		display:none;
	}
	
	a:hover{
		opacity:0.8;
	}
	
	#container{
		width:100%;
		margin:0 auto;
	}

	#saleHead{
		width:100%;
		margin:0 auto;
		padding:10px 0 0 0;
		text-align:center;

	}

	#wrap{
		margin:0 auto 40px;
	}

	#main_visual{
		width:100%;
		margin:0px auto 0;
		background:#f4f4f4;
	}

	#main_visual h2{
		margin:60px auto;
		font-size:18px;
		letter-spacing:0.3em;
		text-align:center;
	}
	
	#main_visual div{
		margin:0 auto;
		padding:40px 0 30px;
		text-align:center;
	}
	
	#main_visual div img{
		width:80%;
		margin:0 auto;
	}

	#main_visual p{
		margin:90px auto 0;
		font-size: 80px;
		font-family: 'Roboto', sans-serif;
		font-weight:900;
		font-style:italic;
		text-align:center;
		line-height:1.3em;
		letter-spacing:0.05em;
		color:#272727;
	}

	#main_visual span{
		margin:60px auto 0;
		display:block;
		font-family: "游ゴシック", "Yu Gothic";
		font-size:1em;
		text-align:center;
		line-height:1.5em;
		font-weight:500;
	}
	
	#main_text{
		width:95%;
		margin:80px auto;
	}


	.more_item{
		width:275px;
		height:25px;
		padding:1em 0;
		margin:0 auto;
		position: relative;
		font-size:12px;
		font-weight:bold;
		text-align:center;
		border:1px solid #333;
	}
	
	.more_item a{
		display: block;
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		padding:1em 0;
		color:#333;
	}
	
	.more_item:hover{
		opacity:0.8;
	}
	
	.pc_footer{
		display:none;
	}
	
	#footerFrame{
		height: 200px;
		width: 100%;
		margin: 0px auto;
		border-top-style: none;
		border-right-style: none;
		border-bottom-style: none;
		border-left-style: none;
		padding-top: 1px;
	}
*/

	body{
		margin:0;
		padding:0;
		font-family: "游ゴシック", "Yu Gothic","ＭＳ ゴシック", "MS Gothic", "Osaka－等幅", "Osaka-mono", "monospace", sans-serif;
		font-weight:500;
	}

	#sideMenu{
		display:none;
	}
	
	.brand_logo{
		width:40%;
		margin:0 auto;
	}
	
	.brand_logo img{
		width:100%;
	}
	
	body{
		margin:0 auto;
	}
	
	img{
		max-width:100%;
	}
	
	#container{
		width:100%;
		margin:0 auto;
	}
	
	#wrapper{
		margin:0 auto 40px;
	}

	#saleHead{
		width:100%;
		margin:0 auto;
		padding:10px 0 5px;
		text-align:center;
		/*
		border-bottom:1px solid #ccc;
		box-shadow:1px 1px 6px 1px rgba(0, 0, 0, 0.2);
		*/
	}
	
	#saleHead img{
		width:50%;
	}
	
	#wrap{
		margin:0 auto 40px;
	}

	#main_visual{
		width:100%;
		margin:0px auto 0;
		background:#fdffec;
	}

	#main_visual h2{
		margin:60px auto;
		font-size:18px;
		letter-spacing:0.3em;
		text-align:center;
	}
	
	#main_visual div{
		margin:0 auto;
		padding:40px 0 30px;
		text-align:center;
	}
	
	#main_visual div img{
		width:80%;
	}

	#main_visual p{
		margin:60px auto 0;
		/*font-size:16px;*/
		font-size: 50px;
		font-family: 'Roboto', sans-serif;
		font-weight:900;
		font-style:italic;
		text-align:center;
		line-height:1.3em;
		letter-spacing:0.05em;
		color:#272727;
	}

	#main_visual span{
		width:90%;
		margin:40px auto 0;
		display:block;
		font-family: "游ゴシック", "Yu Gothic";
		font-size:1em;
		text-align:center;
		line-height:1.5em;
		font-weight:500;
	}
	
	#header_txt{
		width:90%;
		margin:50px auto;
		text-align: center;
		font-size:18px;
		line-height:2em;
		letter-spacing:0.1em;
	}
	
	#palette{
		width:90%;
		margin:50px auto;
	}
	
	#palette .palette_title{
		margin:0 auto;
		text-align:center;
	}
	
	#palette .palette_title h3{
		margin:0 auto;
		font-size:30px;
		font-family: "ROBOTO","游ゴシック", "Yu Gothic","ＭＳ ゴシック", "MS Gothic", "Osaka－等幅", "Osaka-mono", "monospace";
		font-style:italic;
		letter-spacing:0.05em;
	}
	
	#palette .palette_title hr{
		width:80%;
		height:2px;
		background:#000;
		border:0;
	}
	
	#palette ul{
		width:100%;
		margin:50px auto 0;
		overflow:hidden;
		display:flex;
		flex-wrap: wrap;
		justify-content: space-between;
		align-items: center;
		align-content:space-between;
	}
	
	#palette ul li{
		width:23%;
		margin:0 1% 30px;
	}
	
	#palette ul li a{
		color:#1d1d1d;
	}
	
	#palette ul li:hover{
		opacity:0.8;
	}
	
	#palette ul li .color_name{
		margin:10px auto 0;
		font-size:18px;
		font-weight:bold;
		text-align:center;
		font-family: "ROBOTO","游ゴシック", "Yu Gothic","ＭＳ ゴシック", "MS Gothic", "Osaka－等幅", "Osaka-mono", "monospace" , sans-serif;
		font-style:italic;
	}
	
	.white{
		min-height:70px;
		width:100%;
		background:#ffffff;
	    box-sizing: border-box;
    	border: solid 1px #919191;
	}
	
	.khaki{
		height:70px;
		width:100%;
		background:#5d744c;
	}
	
	.purple{
		height:70px;
		width:100%;
		background:#522d75;
	}
	
	.beige{
		height:70px;
		width:100%;
		background:#b6a681;
	}
	
	.gray{
		height:70px;
		width:100%;
		background:#797979;
	}
	
	.navy{
		height:70px;
		width:100%;
		background:#212849;
	}
	
	.red{
		height:70px;
		width:100%;
		background:#ba222a;
	}
	
	.black{
		height:70px;
		width:100%;
		background:#222222;
	}
	
	#color_body{
		width:100%;
		margin:0 auto;
	}
	
	#color_body .color_wrap{
		width:90%;
		margin:0 auto;
		background:#fff;
	}
	
	#color_body #brown{
		width:100%;
		background:#503830;
		margin:0 auto;
		padding:20px 0;
	}
	
	#color_body #khaki{
		width:100%;
		background:#5d744c;
		margin:0 auto;
		padding:20px 0;
	}
	
	#color_body #purple{
		width:100%;
		background:#522d75;
		margin:0 auto;
		padding:20px 0;
	}
	
	#color_body #beige{
		width:100%;
		background:#b6a681;
		margin:0 auto;
		padding:20px 0;
	}
	
	#color_body #gray{
		width:100%;
		background:#797979;
		margin:0 auto;
		padding:20px 0;
	}
	
	#color_body #navy{
		width:100%;
		background:#212849;
		margin:0 auto;
		padding:20px 0;
	}
	
	#color_body #red{
		width:100%;
		background:#ba222a;
		margin:0 auto;
		padding:20px 0;
	}
	
	#color_body #black{
		width:100%;
		background:#222222;
		margin:0 auto;
		padding:20px 0;
	}
	
	.color_title{
		width:50%;
		margin:0 auto;
		padding:60px 0 0;
		text-align:center;
	}
	
	.color_text{
		width:85%;
		margin:20px auto 0;
		font-size:18px;
		line-height:1.7em;
	}
	
	.color_item{
		width:90%;
		margin:0px auto 0;
		padding:40px 0;
	}
	.color_item ul{
		display:flex;
		flex-wrap: wrap;
		justify-content: space-between;
		align-items:stretch;
		align-content:space-between;	
	}
	
	.color_item ul::after{
		content:"";
		display: block;
	    width: 45%;
    	margin: 3% auto 0;
	}
	
	.color_item ul li{
		width:45%;
		height:auto;
		margin:3% auto 0;
	}
	
	.color_item ul li img{
		width:100%;
	}

	.more_item{
		width:80%;
		height:25px;
		padding:1em 0 0.5em;
		margin:30px auto;
		position: relative;
		font-size:16px;
		font-weight:bold;
		letter-spacing: 0.1em;
		text-align:center;
		border:none;
	}
	
	.more_item a{
		display: block;
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		padding:0.7em 0;
		color:#fff;
	}

	#brown .more_item{
		border:1px solid #503830;
		background:#503830;
		color:#fff;
	}
	
	#khaki .more_item{
		border:1px solid #5d744c;
		background:#5d744c;
		color:#fff;
	}
	
	#purple .more_item{
		border:1px solid #522d75;
		background:#522d75;
		color:#fff;
	}
	
	#beige .more_item{
		border:1px solid #b6a681;
		background:#b6a681;
		color:#fff;
	}
	
	#gray .more_item{
		border:1px solid #797979;
		background:#797979;
		color:#fff;
	}
	
	#navy .more_item{
		border:1px solid #212849;
		background:#212849;
		color:#fff;
	}
		
	#red .more_item{
		border:1px solid #ba222a;
		background:#ba222a;
		color:#fff;
	}
		
	#black .more_item{
		border:1px solid #222222;
		background:#222222;
		color:#fff;
	}

	
	.pc_footer{
		display:none;
	}
	
	footer{
		height:170px;
	}
	
	footer #footerFrame {
		height: 220px;
		width: 100%;
		border-top-style: none;
		border-right-style: none;
		border-bottom-style: none;
		border-left-style: none;
		overflow: hidden;
	}
	
/* ドロワーボタン */
p#drawerBtn{
    position: fixed;
    right: 5px;
    bottom: 50px;
    /*background: #555;*/
    padding: 0px;
    width: 80px;
    height: 70px;
}
	
/* ドロワーメニュー */
#drawerMenu{
    position:fixed;
    right:-2000px;
	/*background-color:#1e1e1e;*/
	background-color: #fff;
	font-size:16px !important;
	z-index:10001;
	width:100%;
	padding-top: 5%;
	height:100%;
	overflow-y: scroll;
	-webkit-overflow-scrolling: touch !important;
}
#drawerMenu p#drawerTi {
	padding: 10px 0 0;
	font-size: 20px;
}
#drawerMenu p {
	font-size: 17px;
	font-weight: bold;
	color: #333;
	text-align: center;
}
/*
#drawerMenu ul{
	margin:0 auto;
	width:98%;
	padding: 0;
	display:flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: center;
	align-content:space-between;
}
#drawerMenu li{
	width:22%;
	margin:0 1%;
}
#drawerMenu ul li img {
	width:100%;
}*/

	#drawerMenu #palette_sp{
		width:90%;
		margin:50px auto 0;
	}
	
	#drawerMenu #palette_sp .palette_title{
		margin:0 auto;
		text-align:center;
	}
	
	#drawerMenu #palette_sp .palette_title h3{
		margin:0 auto;
		font-size:30px;
		font-family: "ROBOTO","游ゴシック", "Yu Gothic","ＭＳ ゴシック", "MS Gothic", "Osaka－等幅", "Osaka-mono", "monospace";
		font-style:italic;
		letter-spacing:0.05em;
	}
	
	#drawerMenu #palette_sp .palette_title hr{
		width:80%;
		height:2px;
		background:#000;
		border:0;
	}
	
	#drawerMenu #palette_sp ul{
		width:100%;
		margin:50px auto 0;
		overflow:hidden;
		display:flex;
		flex-wrap: wrap;
		justify-content: space-between;
		align-items: center;
		align-content:space-between;
	}
	
	#drawerMenu #palette_sp ul li{
		width:23%;
		margin:0 1% 30px;
	}
	
	#drawerMenu #palette_sp ul li a{
		color:#1d1d1d;
	}
	
	#drawerMenu #palette_sp ul li:hover{
		opacity:0.8;
	}

	
	#drawerMenu #palette_sp ul li .color_name{
		margin:10px auto 0;
		font-size:18px;
		font-weight:bold;
		text-align:center;
		font-family: "ROBOTO","游ゴシック", "Yu Gothic","ＭＳ ゴシック", "MS Gothic", "Osaka－等幅", "Osaka-mono", "monospace" , sans-serif;
		font-style:italic;
	}


/* 閉じるボタン */
.closeBtn{
	width:50%;
	padding:5px ;
	border: 1px #333 solid;
	border-radius: 2px;
	color:#FFF;
	margin:20px auto 60px;
	text-align:center;
	max-width:260px;
	line-height:30px;
}
.closeBtn span{
	font-size:17px;
	font-weight:bold;
	margin-right:5px;
}
	
}

@media screen and (max-width: 640px) {

	body{
		margin:0;
		padding:0;
		font-family: "游ゴシック", "Yu Gothic","ＭＳ ゴシック", "MS Gothic", "Osaka－等幅", "Osaka-mono", "monospace", sans-serif;
		font-weight:500;
	}

	#sideMenu{
		display:none;
	}
	
	.brand_logo{
		width:40%;
		margin:0 auto;
	}
	
	.brand_logo img{
		width:100%;
	}
	
	body{
		margin:0 auto;
	}
	
	img{
		max-width:100%;
	}
	
	#container{
		width:100%;
		margin:0 auto;
	}
	
	#wrapper{
		margin:0 auto 40px;
	}

	#saleHead{
		width:100%;
		margin:0 auto;
		padding:10px 0 5px;
		text-align:center;
		/*
		border-bottom:1px solid #ccc;
		box-shadow:1px 1px 6px 1px rgba(0, 0, 0, 0.2);
		*/
	}
	
	#saleHead img{
		width:50%;
	}
	
	#wrap{
		margin:0 auto 40px;
	}

	#main_visual{
		width:100%;
		margin:0px auto 0;
		background:#fdffec;
	}

	#main_visual h2{
		margin:60px auto;
		font-size:18px;
		letter-spacing:0.3em;
		text-align:center;
	}
	
	#main_visual div{
		margin:0 auto;
		padding:40px 0 30px;
		text-align:center;
	}
	
	#main_visual div img{
		width:80%;
	}

	#main_visual p{
		margin:60px auto 0;
		/*font-size:16px;*/
		font-size: 50px;
		font-family: 'Roboto', sans-serif;
		font-weight:900;
		font-style:italic;
		text-align:center;
		line-height:1.3em;
		letter-spacing:0.05em;
		color:#272727;
	}

	#main_visual span{
		width:90%;
		margin:40px auto 0;
		display:block;
		font-family: "游ゴシック", "Yu Gothic";
		font-size:1em;
		text-align:center;
		line-height:1.5em;
		font-weight:500;
	}
	
	#header_txt{
		width:90%;
		margin:50px auto;
		text-align: left;
		font-size:15px;
		line-height:2em;
		letter-spacing:0.1em;
	}
	
	#palette{
		width:90%;
		margin:50px auto;
	}
	
	#palette .palette_title{
		margin:0 auto;
		text-align:center;
	}
	
	#palette .palette_title h3{
		margin:0 auto;
		font-size:30px;
		font-family: "ROBOTO","游ゴシック", "Yu Gothic","ＭＳ ゴシック", "MS Gothic", "Osaka－等幅", "Osaka-mono", "monospace";
		font-style:italic;
		letter-spacing:0.05em;
	}
	
	#palette .palette_title hr{
		width:80%;
		height:2px;
		background:#000;
		border:0;
	}
	
	#palette ul{
		width:100%;
		margin:50px auto 0;
		overflow:hidden;
		display:flex;
		flex-wrap: wrap;
		justify-content: space-between;
		align-items: center;
		align-content:space-between;
	}
	
	#palette ul li{
		width:23%;
		margin:0 1% 30px;
	}
	
	#palette ul li a{
		color:#1d1d1d;
	}
	
	#palette ul li:hover{
		opacity:0.8;
	}
	
	#palette ul li .color_name{
		margin:10px auto 0;
		font-size:18px;
		font-weight:bold;
		text-align:center;
		font-family: "ROBOTO","游ゴシック", "Yu Gothic","ＭＳ ゴシック", "MS Gothic", "Osaka－等幅", "Osaka-mono", "monospace" , sans-serif;
		font-style:italic;
	}
	
	.white{
		min-height:70px;
		width:100%;
	    box-sizing: border-box;
    	border: solid 1px #919191;
	}
	
	.khaki{
		height:70px;
		width:100%;
		background:#5d744c;
	}
	
	.purple{
		height:70px;
		width:100%;
		background:#522d75;
	}
	
	.beige{
		height:70px;
		width:100%;
		background:#b6a681;
	}
	
	.gray{
		height:70px;
		width:100%;
		background:#797979;
	}
	
	.navy{
		height:70px;
		width:100%;
		background:#212849;
	}
	
	.red{
		height:70px;
		width:100%;
		background:#ba222a;
	}
	
	.black{
		height:70px;
		width:100%;
		background:#222222;
	}
	
	#color_body{
		width:100%;
		margin:0 auto;
	}
	
	#color_body .color_wrap{
		width:90%;
		margin:0 auto;
		background:#fff;
	}
	
	#color_body #white{
		width:100%;
		background:#f6f6f6;
		margin:0 auto;
		padding:20px 0;
	}
	
	#color_body #khaki{
		width:100%;
		background:#5d744c;
		margin:0 auto;
		padding:20px 0;
	}
	
	#color_body #purple{
		width:100%;
		background:#522d75;
		margin:0 auto;
		padding:20px 0;
	}
	
	#color_body #beige{
		width:100%;
		background:#b6a681;
		margin:0 auto;
		padding:20px 0;
	}
	
	#color_body #gray{
		width:100%;
		background:#797979;
		margin:0 auto;
		padding:20px 0;
	}
	
	#color_body #navy{
		width:100%;
		background:#212849;
		margin:0 auto;
		padding:20px 0;
	}
	
	#color_body #red{
		width:100%;
		background:#ba222a;
		margin:0 auto;
		padding:20px 0;
	}
	
	#color_body #black{
		width:100%;
		background:#222222;
		margin:0 auto;
		padding:20px 0;
	}
	
	.color_title{
		width:85%;
		margin:0 auto;
		padding:60px 0 0;
		text-align:center;
	}
	
	.color_text{
		width:85%;
		margin:20px auto 0;
		font-size:15px;
		line-height:1.7em;
	}
	
	.color_item{
		width:90%;
		margin:0px auto 0;
		padding:40px 0;
	}
	.color_item ul{
		display:flex;
		flex-wrap: wrap;
		justify-content: space-between;
		align-items:stretch;
		align-content:space-between;	
	}
	
	.color_item ul::after{
		content:"";
		display: block;
	    width: 45%;
    	margin: 3% auto 0;
	}
	
	.color_item ul li{
		width:45%;
		height:auto;
		margin:3% auto 0;
	}
	
	.color_item ul li img{
		width:100%;
	}

	.more_item{
		width:80%;
		height:25px;
		padding:1em 0 0.5em;
		margin:30px auto;
		position: relative;
		font-size:12px;
		font-weight:bold;
		letter-spacing: 0.1em;
		text-align:center;
		border:none;
	}
	
	.more_item a{
		display: block;
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		padding:1em 0;
		color:#fff;
	}

	#white .more_item{
		border:1px solid #919191;
		background:#919191;
		color:#fff;
	}
	
	#khaki .more_item{
		border:1px solid #5d744c;
		background:#5d744c;
		color:#fff;
	}
	
	#purple .more_item{
		border:1px solid #522d75;
		background:#522d75;
		color:#fff;
	}
	
	#beige .more_item{
		border:1px solid #b6a681;
		background:#b6a681;
		color:#fff;
	}
	
	#gray .more_item{
		border:1px solid #797979;
		background:#797979;
		color:#fff;
	}
	
	#navy .more_item{
		border:1px solid #212849;
		background:#212849;
		color:#fff;
	}
		
	#red .more_item{
		border:1px solid #ba222a;
		background:#ba222a;
		color:#fff;
	}
		
	#black .more_item{
		border:1px solid #222222;
		background:#222222;
		color:#fff;
	}

	
	.pc_footer{
		display:none;
	}
	
	footer{
		height:170px;
	}
	
	footer #footerFrame {
		height: 220px;
		width: 100%;
		border-top-style: none;
		border-right-style: none;
		border-bottom-style: none;
		border-left-style: none;
		overflow: hidden;
	}
	
/* ドロワーボタン */
p#drawerBtn{
    position: fixed;
    right: 5px;
    bottom: 50px;
    /*background: #555;*/
    padding: 0px;
    width: 50px;
    height: 50px;
}
	
/* ドロワーメニュー */
#drawerMenu{
    position:fixed;
    right:-2000px;
	/*background-color:#1e1e1e;*/
	background-color: #fff;
	font-size:16px !important;
	z-index:10001;
	width:100%;
	padding-top: 5%;
	height:100%;
	overflow-y: scroll;
	-webkit-overflow-scrolling: touch !important;
}
#drawerMenu p#drawerTi {
	padding: 10px 0 0;
	font-size: 20px;
}
#drawerMenu p {
	font-size: 17px;
	font-weight: bold;
	color: #333;
	text-align: center;
}
/*
#drawerMenu ul{
	margin:0 auto;
	width:98%;
	padding: 0;
	display:flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: center;
	align-content:space-between;
}
#drawerMenu li{
	width:22%;
	margin:0 1%;
}
#drawerMenu ul li img {
	width:100%;
}*/

	#drawerMenu #palette_sp{
		width:90%;
		margin:50px auto 0;
	}
	
	#drawerMenu #palette_sp .palette_title{
		margin:0 auto;
		text-align:center;
	}
	
	#drawerMenu #palette_sp .palette_title h3{
		margin:0 auto;
		font-size:30px;
		font-family: "ROBOTO","游ゴシック", "Yu Gothic","ＭＳ ゴシック", "MS Gothic", "Osaka－等幅", "Osaka-mono", "monospace";
		font-style:italic;
		letter-spacing:0.05em;
	}
	
	#drawerMenu #palette_sp .palette_title hr{
		width:80%;
		height:2px;
		background:#000;
		border:0;
	}
	
	#drawerMenu #palette_sp ul{
		width:100%;
		margin:50px auto 0;
		overflow:hidden;
		display:flex;
		flex-wrap: wrap;
		justify-content: space-between;
		align-items: center;
		align-content:space-between;
	}
	
	#drawerMenu #palette_sp ul li{
		width:23%;
		margin:0 1% 30px;
	}
	
	#drawerMenu #palette_sp ul li a{
		color:#1d1d1d;
	}
	
	#drawerMenu #palette_sp ul li:hover{
		opacity:0.8;
	}
	
	#drawerMenu #palette_sp ul li .color_name{
		margin:10px auto 0;
		font-size:18px;
		font-weight:bold;
		text-align:center;
		font-family: "ROBOTO","游ゴシック", "Yu Gothic","ＭＳ ゴシック", "MS Gothic", "Osaka－等幅", "Osaka-mono", "monospace" , sans-serif;
		font-style:italic;
	}


/* 閉じるボタン */
.closeBtn{
	width:50%;
	padding:5px ;
	border: 1px #333 solid;
	border-radius: 2px;
	color:#FFF;
	margin:20px auto 60px;
	text-align:center;
	max-width:260px;
	line-height:30px;
}
.closeBtn span{
	font-size:17px;
	font-weight:bold;
	margin-right:5px;
}
	
}