@charset "utf-8";
/****************共通設定*************************************/
	*{
		margin:0;
		padding:0;
	}

	body{
		font-family: 'Cinzel','Sawarabi Gothic', serif;
		background-color: #000;
		text-align: center;
		font-size: 15px;
		-webkit-text-size-adjust: 100%;
	}
	a{
		text-decoration:none;
		color:;
	}
	nav{
		width: 100%;
		height: 80px;
	}

	img{
		max-width: 100%;
		height: auto;
	}

	.s_ttl{
		font-size: 20px;
		margin-bottom:25px;
	}

	.ttl{
		font-family: 'Cinzel', serif;
		font-size: 40px;
		letter-spacing: 7px;
		line-height:1em;
	}

	ul li{
		list-style-type: none;
	}
	div.section{
		margin:0 auto;
	}
	.sp_only{
		display:none;
	}
	.more{
		float: right;
		font-size: 22px;
		width: 100%;
		height: 30px;
		border: 1px  solid #aaa;
		display: flex;
		justify-content: center;
		align-items: center;
		font-family: 'Quicksand', sans-serif;
		background-color: #fff; 
	}

	.topics__detail{
		width: 100%;
		clear: both;
	}
	.topics__detail .more a{
		display:block;
		width:100%;
		background: rgba(0,0,0,.3);
    	color: #fff;
	}
	.facebook-wrapper {
	    max-width: 500px;
	    margin: 0 auto;
	}

	.facebook-wrapper > .fb-page {
	    width: 100%;
	}

	.facebook-wrapper > .fb-page > span,
	.facebook-wrapper iframe {
	    width: 100% !important;
	}

	.google_map{
	    position: relative;
	    width: 100% !important;
	    height: 0;
	    padding-top: 75%;
	}

	.google_map iframe{
	    position: absolute;
	    top: 0;
	    left: 0;
	    width: 100%;
	    height: 100%;
	    overflow: hidden;
	}

	.tel{
	/*	margin: 20px 0 0 0;*/
		font-size: 30px;
	}

	.open{
		font-size: 30px;
	}

	.rglholiday{
		font-size: 17px;		
		font-family:"Sawarabi Gothic";
	}
	
	.address{
		font-size: 17px;
		font-family:"Sawarabi Gothic";		
	}

	.shop_info{
		padding: 30px 0;
	}

	.products_list .ott{
		padding-top:40px;
		opacity:.1;
		transition:.5s;
	}

/******申し訳ないけど埋め立て******************************/
		#wrapper{
			max-width:unset;
			width:100%;
		}
		#header{
			margin:0;
		}
		#header__mainvisual{
			background:url(../images/sorrisoMain.jpg) no-repeat center;
			background-size:cover;
			position:relative;
			overflow:hidden;
			width:100%;
		}
		#header__mainvisual:before{
			content:"";
			position:absolute;
			width:100%;
			height:100%;
			left:0;
			top:0;
			background:inherit;
			filter:blur(3px);
		}
		#header__mainvisual:after{
			content:"";
			position:absolute;
			width:100%;
			height:100%;
			left:0;
			top:0;
			background:rgba(0,0,0,.4);
		}
		#header__midashi{
			margin:0;
			position:relative;
		}
		#header__midashi .subtext{
			font-size:25px;
		}
		#header__midashi figure.models{
			margin:10px 0 0;
			position:relative;
		}
		#header__midashi figure.models ul{
			display:flex;
			align-items:center;
			overflow:hidden;
			height:35.5vw;
		}
		#header__midashi figure.models ul li:not(.sp_only){
			display:block;
			transition:1s;
			width:calc((100% - 40px)/5);
			position:absolute;
			left:0;
			top:0;
		}
		#header__midashi figure.models .subtext2{
			margin:10px 0 0;
			color:#444;
			font-size:20px;
			border-bottom: 4px double #aaa;
		    background: #eee;
		    border-top: 4px double #aaa;
		}
		#header__midashi figure.models.disp ul li:nth-of-type(2){
			left:calc((100% - 40px)/5 + 10px);
			top:0;
		}
		#header__midashi figure.models.disp ul li:nth-of-type(3){
			left:calc(2*((100% - 40px)/5 + 10px));
			top:0;
		}
		#header__midashi figure.models.disp ul li:nth-of-type(4){
			left:calc(3*((100% - 40px)/5 + 10px));
			top:0;
		}
		#header__midashi figure.models.disp ul li:nth-of-type(5){
			left:calc(4*((100% - 40px)/5 + 10px));
			top:0;
		}
		.header__log{
			position: absolute;
			top: 20%;
			left: 50%;
			-webkit-transform: translate(-50%,-10%);
			-moz-transform: translate(-50%,-10%);
			-ms-transform: translate(-50%,-10%);
			-o-transform: translate(-50%,-10%);
			transform: translate(-50%,-10%);
		}
		#header__nav{
			position:fixed;
			height:auto;
			overflow:hidden;
			left:0;
			top:0;
			z-index:9999;
			background:none;
		}
		#header__nav .header__navlogo{
			display:none;
		}
		
		#header__nav ul{
			width:100%;
			float:right;
			transition:.4s;
			display:flex;
			justify-content:center;
		}
		.header__logo2{
			font-size:20px;
		}
		#header__nav ul li{
			height:60px;
		}
		#header__nav ul li a{
			color:#fff;
			position:relative;
		}
		#header__nav ul li a:before{
			content:"";
			display:block;
			width:100%;
			position:absolute;
			left:0;
			top:0;
			font-size:10px;
			color:#fff;
			text-align:center;
			opacity:0;
			transition:.3s;
		}
		#header__nav ul li.top a:before{
			content:"トップ";
		}
		#header__nav ul li.catalog a:before{
			content:"商品一覧";
		}
		#header__nav ul li.about a:before{
			content:"会社概要";
		}
		#header__nav ul li.contact a:before{
			content:"お問い合せ";
		}
		#header__nav ul li a:hover:before{
			transition:.3s;
			opacity:1;
			top:-13px;
		}
		nav a:after{
			background:#fff;
			height:1px;
		}
		#product{
			width:100%;
			box-sizing:border-box;
			padding:3% 10% 2.5%;
			box-sizing:border-box;
		}
		#about{
		    width: 100%;
		    margin: 0 auto;
		    overflow: hidden;
		    padding: 3% 10% 2.5%;
		    box-sizing:border-box;
		}
		#about .about__img{
			margin:0;
			float:left;
			width:40%;
			border:1px solid #ddd;
			box-sizing:border-box;
		}
		#about #about__shopinfo{
			float:right;
			width:55%;
		}
		#about #about__shopinfo p{
			text-align:left;
			font-size:17px;
			font-family:'Sawarabi Gothic';
		}
		#topics{
			padding:0;
			width:100%;
		}
		#topics .fb_feeds{
			width: 80%;
		    margin: 0 auto 3%;
		    font-size: 13px !important;
		    border: 1px solid #999;
		    background: #fff;
		    border-radius: 10px;
		    overflow: hidden;
		    box-shadow: inset 0 0 5px #888;
		}
		#topics .fb_feeds ul{
			overflow-y:auto;
			max-height:200px;
			padding:1% 2%;
			box-sizing:border-box;
			width:calc(100% + 20px);
		}
		#topics .fb_feeds ul li a{
			color:#444;
			}
		#topics .fb_feeds ul li dl{
			display:flex;
			justify-content:flex-start;
			align-items:flex-end;
			font-size:16px;
			position:relative;
			padding:0 0 5px;
			margin:0 0 5px;
			border-bottom:1px dotted #999;
			flex-wrap:wrap;
			text-align:left;
			font-family:"Sawarabi Gothic";
		}
		#topics .fb_feeds ul li dl dt{
			margin-right:5%;
		}
		#topics .fb_feeds ul li dl:before{
			content:"";
			display:block;
			position:absolute;
			width:0;
			height:0;
			border:4px solid transparent;
			border-left-color:#444;
			right:0;
			top:calc((100% - 6px)/2);
			font-family:"Cinzel";
		}
		#topics .fb_feeds ul li dl:after{
			content:"read more";
			color:#000;
			display:block;
			position:absolute;
			right:3%;
			top:calc((100% - 15px)/2);
			font-size:13px;
			font-family:"Cinzel";
		}
		.inr{
			padding:0;
		}
		.products_list ul li a{
			color:#444;
		}
		.products_list ul li img{
			border:1px solid #ddd;
		}
		#topics__new{
			color:#000;
			padding:3% 0 2.5%;
			box-sizing:border-box;
		}
		#topics__new .ttl{
			color: #fff;
		    text-align: left;
		    width: 80%;
		    margin: 0 auto 20px;
		    border: 0;
		}
		#topics__new .s_ttl{
			color:#fff;
		}
		.ttl{
			text-align:left;
			font-size:30px;
			margin-bottom:25px;
			border-bottom:1px solid #555;
		}
		.s_ttl{
			display:none;
		}
		#brand{
			width:100%;
			padding:3% 10% 2.5%;
			clear:both;
			margin-bottom:30px;
			box-sizing:border-box;
		}
		#brand__list ul{
			display:flex;
			flex-wrap:wrap;
			align-items:center;
		}
		#brand__list ul li{
			float:none;
			width:14.2%;
			display:flex;
			align-items:center;
			margin:0 2.4% 10px 0;
		}
		#brand__list ul li:nth-of-type(6n){
			margin-right:0;
		}
		#brand__list ul li img{
			margin:0;
			width:100%;
		}
		ul.slider li img{
			position:static;
		}
		footer{
			display:flex;
			flex-wrap:wrap;
			justify-content:space-between;
			align-items:center;
			width:80%;
			margin:0 auto;
		}
		footer .footer_logo figure{
			width:20%;
			margin: 0 auto 10px;
			opacity:.9;
		}
		footer .footer_logo figure img{
			width:100%;
		}
		footer .arrowbox{
			width:100%;
			margin-bottom:30px;
		}
		footer .lc{
			width:45%;
			height:27vw;
			border:2px solid #fff;
			order:2;
			margin-bottom:20px;
		}
		footer .rc{
			width:45%;
			order:1;
			margin-bottom:20px;
		}
		footer .footer_menu {
			width:100%;
			order:3;
			display:flex;
			justify-content:center;
		}
		footer .footer_menu li{
			padding:0 10px;
			margin-right:10px;
			position:relative;
		}
		footer .footer_menu li:nth-last-of-type(1){
			margin:0;
		}
		footer .footer_menu li:after{
			content: "";
		    position: absolute;
		    right: -5px;
		    display: block;
		    width: 1px;
		    height: 70%;
		    transform: rotate(20deg);
		    background: #fff;
		    top: calc((100% - 15px)/2);
		}
		footer .footer_menu li a{
			color:#fff;
		}
		footer small{
			width:100%;
			text-align:center;
			margin:10px 0;
			order:3;
		}
		.catchcopy{
			opacity:.9;
			top:40%;
			left:0;
			position:absolute;
			width:100%;
			color:#fff;
			font-family:"Sawarabi Mincho" !important;			
		}
		.catchcopy h2{
			font-size:35px;
			font-weight:normal;
		}
		.tgt {
			opacity: 0;
		}
		.tgt span{
			opacity: 0;
		}
		.catchcopy .subtext{
			font-size:23px;
		}
		.scrolls{
			position: fixed;
		    right: 0;
		    bottom: 10%;
		    color: #fff;
		    transform: rotate(-90deg);
		    font-size: 17px;
		    z-index: 9999;
		    background: rgba(0,0,0,.4);
		    padding: 3px 10px 2px 25px;
		    cursor:pointer;
		}
		.scrolls:hover{
			opacity:.8;
		}
		.scrolls:before{
			content: "";
		    display: block;
		    border: 1px solid #fff;
		    border-top: 0;
		    border-right: 0;
		    position: absolute;
		    width: 8px;
		    height: 8px;
		    transform: rotate(45deg);
			left: 10px;
		    top: calc((100% - 10px)/2);
		}
		#about .details{
			overflow:hidden;
		}
		.sns{
			display:flex;
			justify-content:space-between;
			margin-top:20px;
			width:100%;
			padding:10px;
			display:flex;
			background:#eee;
			flex-shrink:0;
			justify-content:space-between;
		}
		.sns > div{
			width:48%;
			height:30vw;
			overflow-y:scroll;
		}
		.sns > div figure.icon{
			height:40px;
			margin-bottom:10px;
			display:flex;
			align-items:flex-end;
			font-size:20px;
			flex-shrink:0;
			flex-wrap:wrap;
		}
		.sns > div figure.icon span:nth-of-type(1){
			margin-right:10px;
			width:40px;
		}
		.sns > div figure.icon span:nth-of-type(2){
			width: calc(100% - 50px);
		    text-align: left;
		}
		.read_more{
			display:inline-block;
			float:right;
			background:#444;
			color:#fff !important;
			padding:2px 5px;
			border:3px double #fff;
			margin-top:10px;
		}
		.read_more:hover{
			transition:.3s;
			opacity:.8;
		}
/******申し訳ないけど埋め立て******************************/
/***下層ページ共通*****/
.lower header{
}
.lower .section{
	padding-bottom:50px;
}
.lower .big_ttl{
	background: url(../images/sorrisoMain) center;
    height: 20vw;
    background-size: cover;
    color: #fff;
    overflow:hidden;
    position:relative;
    padding-top:60px;
}
.lower .big_ttl:before{
	content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    background: inherit;
    filter: blur(3px);
}
.lower .big_ttl h2{
	position:absolute;
    display: block;
    background: rgba(0,0,0,.4);
    color: #fff;
    font-weight: normal;
    padding: 10px 20px;
}
.lower .contents{
	padding:3% 10% 2.5%;
}
.lower .ttl{
	margin-top:30px;
}
/***下層ページ共通*****/
/****************共通設定***************************/
/**********パソコン(min-width:1300px)******************/
@media screen and (min-width:1300px){
	.pc_hide{
		display:none !important;
	}
	#wrapper{
		margin: 0 auto;
		background-color: #fff;
		overflow:hidden;
	}

	nav{
		background-color: #e8e8e8;
		position: relative;
	}

	nav a::after {
		position: absolute;
		bottom: -4px;
		left: 0;
		content: '';
		width: 100%;
		transform: scale(0, 1);
		transform-origin: center top;
		transition: transform .3s;
	}

	nav a:hover::after {
	  	transform: scale(1, 1);
	}

	.br__sp{
		display:none;
	}

	#nav-input {
		display: none;
	}

	#header__nav ul li{
		font-size: 20px;
		width: 20%;
		float: left;
		display: flex;
		justify-content: center;
		align-items: center;
	}
	#header{
		position:relative;
		width: 100%;
	}
		#header__nav.scr{
			background:rgba(0,0,0,.4);
			display:flex;
			justify-content:space-between;	
		}
		#header__nav.scr .header__navlogo{
			display:flex;
			align-items:center;
			color:#fff;
			margin-left:20px;
		}
		#header__nav.scr .header__navlogo figure{
			width:40px;
			margin-right:10px;
		}
		#header__nav.scr .header__navlogo a{
			display:flex;
			color:#fff;
		}
		#header__nav.scr .header__navlogo h2{
			font-size:30px;
			text-align:left;
			line-height:1em;
			font-weight:normal;
		}
		#header__nav.scr .header__navlogo h2 span{
			font-size:12px;
			display:block;
			line-height:1em;
		}
		#header__nav.scr ul{
			transition:.4s;
			width:70%;
			justify-content:flex-end;
		}

	.header__log img{
		opacity: 0.9;
		margin-bottom:10px	
	}

	.header__logo1{
		color: #fff;
		font-size: 50px;
		letter-spacing: 10px
	}


	.header__logo2{
		color: #fff;
		letter-spacing: 4px
	}

	.catch_copy{
		position: absolute;
	    z-index: 8000;
	    background: rgba(0,0,0,.3);
	    width: 100%;
	    color: #fff;
	    box-sizing: border-box;
	    left: 0;
	    padding:1%;
	    bottom: 11px;
	    text-shadow:0 0 2px #eee;
	}
	.catch_copy h2{
		font-size:30px;
		font-weight:normal;
		font-family:"Sawarabi Mincho";
		text-align:center;
	}
	.catch_copy p{
		font-size:18px;
	}
	.product_list{
		font-size: 10px;
	}
	.products_list ul{
		display:flex;
		flex-wrap:wrap;
		justify-content:flex-start;
	}
	.products_list ul li{
		width: 20%;
		margin-right:6.5%;
		margin-bottom:3%;
		text-align:right;
		transition:.5s;
	}
	.products_list ul li:nth-of-type(4n){
		margin:0;
	}
	#topics{
		font-size: 25px;
/*		height: 1200px;*/
	}

	#topics #tobics__fb{
		width: 100% !important;
		margin: 0 0 10% 0;
		overflow: hidden;
	}

	#topics__new{
		width: 100%;
		background: url(../images/topic_bg_01.jpg) center left no-repeat;
		background-size: contain;
		background-color: #4b4b4b;
	}

	#topics__photos{
		font-size: 0;
		margin: 0 0 50px 0;
	}

	#topics__photos ul li{
		width: 33.33%;
		letter-spacing: 0;
		display: inline-block;
	}

	#topics__photos ul li img{
		width: 100%;
	}


	#about{
		width: 100%;
		height: 100%;
	}

	#about .about__tel{
		font-size: 40px;
		color: #808080;
	}

	#about .about__open{
		font-size: 24px;
		color: #808080;
	}

	#about .about__rglholiday{
		font-size: 24px;
		color: #808080;
	}

	#about .about__address{
		margin: 20px 0 0 0;
		font-size: 18px;
		color: #808080;
	}

	footer{
		width: 100%;
		color: #fff;
		padding:3% 5% 0 !important;
		box-sizing:border-box;
	}

	.arrow{
		width: 25px;
		height: 25px;
		border: 2px solid;
		border-color: #eee #eee transparent transparent;
		transform: rotate(-45deg);
		margin: 0 auto;
	}

	.footer__logo{
		font-size: 40px;
		letter-spacing: 10px
	}

	.footer__logo2{
		font-size: 20px;
		letter-spacing: 4px
	}

	.br__sp{
		display:none;
	}
	/**下層ページ**/
	.lower .big_ttl h2{
		width:300px;
		left:calc((100% - 300px)/2);
		top:calc(100% - 200px);
		font-size:35px;
		padding:10px 20px;
		box-sizing:border-box;
	}
	.lower .big_ttl h2 span.sub{
		display: block;
	    font-size: 20px;
	    border-top: 1px solid #fff;
	    padding-top: 5px;
	    letter-spacing:5px;
	}
	/***************** catalog ************************/
	#catalog{
		padding-bottom:50px;
	}
	#catalog__nav ul{
		display:flex;
		background:#444;
		justify-content:flex-end;
	}
	#catalog__nav ul li{
		padding: 5px 10px;
		position:relative;
		color:#fff;
		overflow:hidden;
	}
	#catalog__nav ul li:after{
		content:"";
		border-right:1px solid #fff;
		position:absolute;
		right:0;
		top:0;
		height:100%;
	}
	#catalog__nav ul li a{
		color:#fff;
	}
	/**about**/
	.lower .about__left{
		display:flex;
		align-items:flex-start;
	}
	.lower .about__left img{
		width:20%;
	}
	.lower .about__right p{
		text-align:left;
		font-size:18px;
		padding:10px;
	}
	.lower .tbl_wrapper table{
		width:100%;
		border-collapse:collapse;
		border:1px solid #aaa;
	}
	.lower .tbl_wrapper table th{
		width:25%;
		padding:10px 0;
		background:#eee;
		font-size:17px;
		border:1px solid #aaa;
		font-weight:normal;
		font-family:"Sawarabi Gothic";
	}
	.lower .tbl_wrapper table td{
		font-size:17px;
		border:1px solid #aaa;
		font-family:"Sawarabi Gothic";
	}
	/***************** mail **************************/
	#mail{
	}

	#form__container{
		margin-left: auto;
		margin-right: auto;
	}

	.hissu{
		width: 100%;
		margin-left: 10px;
		border-radius: 3px;
		background-color: #e58291;
		color: #fff;
		padding: 0 10px 0 10px;
		font-size:15px;
	}

	.form__border{
	}

	.form__dl{
    	width: 100%;
    	border:1px solid #aaa;
    	border-bottom:0;
	}
	#form__context__inner{
		border-bottom:1px solid #aaa;
	}

	.form__dl dl {
	    display: flex;
	    justify-content:flex-start;
		width:100%;
	}

	.form__dl dt{
		width: 30%;
	    padding: 20px;
	    box-sizing: border-box;
	    display: flex;
	    background: #eee;
	    font-size: 17px;
	    justify-content: flex-end;
	    border-right:1px solid #aaa;
	}

	.form__dl dd{
		width: 70%;
		box-sizing:border-box;
		padding:20px;
	}
	.form__dl dd input{
		width:300px;
		font-size:17px;
		padding:5px;
	}
	.input__context textarea{
	    display: inline-block;
	    padding: 5px;
	    font-size:17px;
	    vertical-align: middle;
	    width: 500px;
	    height:150px;
	    border: solid 1px #cccccc;
	}

	.form__button{
		 font-family: "Sawarabi Gothic";
	    width: 300px;
	    cursor: pointer;
	    padding: 15px;
	    font-size: 20px;
	    box-sizing: border-box;
	    margin: 30px auto;
	    display: block;
	    color: #444;
	    background: #e2e2e2;
	    background: -moz-linear-gradient(top, #e2e2e2 0%, #dbdbdb 50%, #d1d1d1 51%, #fefefe 100%);
	    background: -webkit-linear-gradient(top, #e2e2e2 0%,#dbdbdb 50%,#d1d1d1 51%,#fefefe 100%);
	    background: linear-gradient(to bottom, #e2e2e2 0%,#dbdbdb 50%,#d1d1d1 51%,#fefefe 100%);
	    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e2e2e2', endColorstr='#fefefe',GradientType=0 );
	    border: 1px solid #aaa;
	    border-radius: 5px;
	    box-shadow: 0 2px #aaa;
	}
	.form__button:hover{
		text-decoration:underline;
		transition:.3s;
		opacity:.8;
	}

	form{
		text-align: left;
		width: 100%;
		margin: 20px auto 0;
	}

	#sentmail p{
		font-size:17px;
		text-align:left;
	}
	#sentmail .mail__tbl_wrapper{
		width:80%;
		margin:20px 0;
	}
	#sentmail .to_index a{
		display: inline-block;
	    color: #444;
	    font-size: 18px;
	    padding: 10px 20px 10px 35px;
	    box-sizing: border-box;
	    margin: 30px auto 40px;
	    position: relative;
	    border-radius: 5px;
	    text-decoration:underline;
	    font-weight:bold;
	}
	#sentmail .to_index a:before{
		content: "";
	    display: block;
	    position: absolute;
	    width: 0;
	    height: 0;
	    border: 6px solid transparent;
	    border-left-color: #444;
	    left: 11px;
    	top: calc((100% - 13px)/2);
	}
	#sentmail .to_index a:after{
		content:"";
		border:3px solid #444;
		border-radius:100%;
		padding:10px;
		box-sizing:border-box;
		position:absolute;
		left:0;
		top: calc((100% - 26px)/2);
	}
}

/**********パソコン(min-width:1300px)******************/
/**********タブレット(max:1299px～min:600px)***********/
@media screen and (max-width:1299px) and (min-width:600px){
	html,body{
		font-family: 'Cinzel','Sawarabi Gothic', serif;
		margin: 0 auto;
	}

	.section{
		height: 100%;
	}

	.inr{
		padding: 5% 0 0 0;
		height: 100%;
		margin: 0 !important; 
	}


	nav{
		width: 100%;
		height: 80px;
	}

	.ttl{
		font-family: 'Cinzel', serif;
		letter-spacing: 7px;
	}

	.br__pc{
		display:none;
	}

	.br__sp{
		display:none;
	}

	#wrapper{
		position: relative;
		width: 100%;
		top: 0;
		right: 0;
		font-size: 14px;
		margin: 0 auto;
		background-color: #fff;
		overflow:hidden;
	}

	#header{
		position: relative;
	}

	.header__log{
		position: absolute;
		top: 50vh;
		left: 50%;
		-webkit-transform: translate(-50%,-50%);
		-moz-transform: translate(-50%,-50%);
		-ms-transform: translate(-50%,-50%);
		-o-transform: translate(-50%,-50%);
		transform: translate(-50%,-50%);
	}
	
	.header__log img{
		width: 50%;
		opacity: 0.5;
		margin-bottom:10px;
	}

	.header__logo1{
		color: #fff;
		font-size: 35px;
		letter-spacing: 10px
	}

	.header__logo2{
		color: #fff;
		font-size: 20px;
		letter-spacing: 4px
	}
	#header__nav ul{
		display:block;
	}
	#header__nav ul li{
		height:unset;
		text-align:left;
		padding:10px 10%;
		border-bottom:1px solid #aaa;
	}
	#header__nav ul li.nav_title{
		background: #444;
	    padding: 5px 5%;
	    color: #fff;
	    text-align: left;
	    font-size: 20px;
	}
	#header__nav ul li a{
		color:#444;
	}
	#header__nav ul li a:before,
	#header__nav ul li a:after{
		display:none;
	}
	.scrolls{
		right:-25px !important;
	}
	#header__midashi figure.models ul{
		display: flex;
	    align-items: center;
	    overflow: hidden;
	    height: 35.7vw;
	}
	#header__midashi figure.models ul li{
		width:20% !important;
		margin:0;
	}

	#header__midashi figure.models ul li:nth-of-type(2){
		left:20% !important;
	}
	#header__midashi figure.models ul li:nth-of-type(3){
		left:40% !important;
	}
	#header__midashi figure.models ul li:nth-of-type(4){
		left:60% !important;
	}
	#header__midashi figure.models ul li:nth-of-type(5){
		left:80% !important;
	}

	#header__mainvisual img{
		width: 100%;		
	}

	#header__midashi{
		font-family: 'Cinzel','Sawarabi Gothic', serif;
		font-size: 23px;
		color: #8C8C8C;
	}
	.catch_copy{
		position:absolute;
		background:rgba(0,0,0,.4);
		border-radius:10px;
		width:80%;
		left:10%;
		top:10%;
		text-align:left;
		padding:5% 10%;
		box-sizing:border-box;
		z-index:8000;
		color:#fff;
	}
	.catch_copy h2{
		font-family:"Sawarabi Mincho";
		text-align:center;
		border-bottom:1px solid #fff;
		font-weight:normal;
		margin-bottom:20px;
	}
	.catch_copy p{
		font-size:20px;
		width:90%;
		margin:0 auto;
	}
	#nav-drawer {
		position: fixed;
		top:  10px;
		right: 10px;
	  	height: 22px;
	  	z-index: 9999;
	}

	/*チェックボックス等は非表示に*/
	.nav-unshown {
	  	display:none;
	}

	/*アイコンのスペース*/
	#nav-open {
		display: inline-block;
	  	width: 30px;
	  	height: 22px;
	  	vertical-align: middle;
	  	padding:7px;
	  	background:rgba(0,0,0,.4);
	  	position:relative;
	  	z-index:10000000000000000;
	}

	/*ハンバーガーアイコンをCSSだけで表現*/
	#nav-open span, #nav-open span:before, #nav-open span:after {
		position: absolute;
	  	height: 2px;/*線の太さ*/
	  	width: 30px;/*長さ*/
	  	margin:0 calc((100% - 30px)/2);
	  	border-radius: 3px;
	  	background: #555;
	  	display: block;
	  	content: '';
	  	cursor: pointer;
	  	right: 0;
	  	background-color: white;
	  	z-index:9999;
	  	transition:.3s;
	}

	#nav-open span:before {
		bottom: -10px;
	}

	#nav-open span:after {
		bottom: -20px;
	}

	/*閉じる用の薄黒カバー*/
	#nav-close {
	 	display: none;/*はじめは隠しておく*/
	 	position: fixed;
	 	z-index: 9998;
	 	top: 0;/*全体に広がるように*/
	 	left: 0;
	 	width: 100%;
		height: 100%;
		background: black;
	 	opacity: 0;
	 	transition: .3s ease-in-out;
	}

	/*中身*/
	#nav-content {
		overflow: auto;
		position: fixed;
		top: 0;
		left: 0;
		z-index: 999999;/*最前面に*/
		width: 50%;/*右側に隙間を作る（閉じるカバーを表示）*/
		max-width: 220px;/*最大幅（調整してください）*/
		height: 100%;
		background: #eee;/*背景色*/
		transition: .3s ease-in-out;/*滑らかに表示*/
		-webkit-transform: translateX(-105%);
		transform: translateX(-105%);/*左に隠しておく*/
	}


	#nav-content  a{
		color: #666;
	}

	/*チェックが入ったらもろもろ表示*/
	#nav-input:checked ~ #nav-close {
		display: block;/*カバーを表示*/
		opacity: .5;
	}

	#nav-close {
/* 	  background: transparent;*/
	}

	#nav-close :before,#nav-close :after{
	  	margin-top: 0;
	}

	#nav-close :before{
	  	transform: rotate(-45deg);
	  	-webkit-transform: rotate(-45deg);
	  	background-color: #fff;
	}

	.rotate{
		transform: rotate(45deg);
		top:17px;
		transition:.3s;
	}

	.rotate:before{
	  	bottom: 0px !important;
	}

	.rotate::before{
	  	transform: rotate(90deg);
	}

	.rotate::after{
		display: none !important;
	}
	.nav_footer{
		position:fixed;
		width:100%;
		left:0;
		bottom:0;
	}
	.nav_f_sns{
		padding:10px;
	}
	.nav_f_sns a{
		display:flex;
		margin-bottom:20px;
		align-items:center;
		justify-content:flex-start;
		font-size:20px;
	}
	.nav_f_sns a:nth-of-type(2){
		margin:0;
	}
	.nav_f_sns a img{
		width:30px;
		height:30px;
		margin-right:10px;
	}

	#nav-input:checked ~ #nav-content {
	  		-webkit-transform: translateX(0%);
	 		 transform: translateX(0%);/*中身を表示（右へスライド）*/
	  		box-shadow: 6px 0 25px rgba(0,0,0,.15);
	}

	#header__midashi figure.models{
		margin:10px 0 !important;
	}
	#header__midashi figure.models .subtext2{
		background:rgba(0,0,0,.5);
		color:#fff;
		font-size:16px;
		margin: 0;
	    padding: 3px 2%;
	    text-align: left;
	}
	#product{
		padding:5% 10% 2.5%;
	}
	.products_list ul{
		display:flex;
		flex-wrap:wrap;
		align-items:flex-start;
	}
	.products_list ul li{
		width: 21%;
		margin-right:5%;
		padding: 0 0 2% 0;
		text-align:right;
		transition:.5s;
	}
	.products_list ul li:nth-of-type(4n){
		margin:0;
	}

	.products_list ul li img{
		width: 100%;
	}

	#topics{
		color: #fff;
		clear: both;
	}

	#topics__new{
		width: 100%;
		padding: 5% 0 2.5% 0;
		background: url(../images/topic_bg_01.jpg) center left no-repeat;
		background-size: contain;
		background-color: #4b4b4b;
	}

	#topics #tobics__fb{
		width: 100% !important;
		margin: 0 0 10% 0;
		overflow: hidden;
	}

	#topics .fb_feeds ul li dl:before,
	#topics .fb_feeds ul li dl:after{
		display:none;
	}

	#topics__photos{
		letter-spacing: -.40em;
		font-size: 0;
	}

	#topics__photos ul li{
		width: 33.33%;
		 letter-spacing: 0;
		display: inline-block;
	}

	#topics__photos ul li img{
		width: 100%;
	}

	#brand{
		clear: both;
		padding:5% 10% 2.5%;
	}

	#brand__list ul li,
	#brand__list ul li:nth-of-type(6n){
		width:20%;
		margin-right:6%;
	}
	#brand__list ul li:nth-of-type(4n){
		margin:0;
	}
	#about{
		padding: 5% 10% 2.5%;
		clear: both;
	}

	ul.slider li {
		  position: relative;
	}

	.arrow{
		width: 25px;
		height: 25px;
		border: 2px solid;
		border-color: #eee #eee transparent transparent;
		transform: rotate(-45deg);
		margin: 0 auto;
	}

	footer{
		padding: 5% 5% 0 !important;
		width: 100%;
		box-sizing:border-box;
		color: #fff;
	}
	footer .footer_logo figure{
		width:25%;
	}
	.footer__logo{
		font-size: 35px;
		letter-spacing: 10px
	}
	.tel{
		font-size:25px;
	}
	.open{
		font-size:25px;
	}
	.footer__logo2{
		font-size: 20px;
		letter-spacing: 4px
	}
/**下層ページ**/
.lower header{
	height:auto;
}
.lower .big_ttl h2{
	width:300px;
	left:calc((100% - 300px)/2);
	top:calc((100% - 100px)/2);
	font-size:25px;
}
.lower .big_ttl h2 span.sub{
	display:block;
	border-top:1px solid #fff;
	font-size:17px;
	padding-top:5px;
	margin-top:5px;
	letter-spacing:5px;
}
/***************** catalog ************************/
	#catalog{
	}

	#catalog__nav ul{
		display:flex;
		background:#444;
		justify-content:flex-end;
	}
	#catalog__nav ul li{
		padding:5px 10px;
		color:#fff;
		position:relative;
	}
	#catalog__nav ul li:after{
		content:"";
		display:block;
		right:0;
		top:0;
		height:100%;
		border-right:1px solid #fff;
		position:absolute;
	}
	#catalog__nav ul li a{
		color:#fff;
	}

	/**about**/
	.lower .about__left{
		display:flex;
		align-items:flex-start;
	}
	.lower .about__left img{
		width:20%;
	}
	.lower .about__right p{
		text-align:left;
		font-size:18px;
		padding:10px;
	}
	.lower .tbl_wrapper table{
		width:100%;
		border-collapse:collapse;
		border:1px solid #aaa;
	}
	.lower .tbl_wrapper table th{
		width:25%;
		padding:10px 0;
		background:#eee;
		font-size:17px;
		border:1px solid #aaa;
		font-weight:normal;
		font-family:"Sawarabi Gothic";
	}
	.lower .tbl_wrapper table td{
		font-size:17px;
		border:1px solid #aaa;
		font-family:"Sawarabi Gothic";
	}
	/***************** mail **************************/

	.hissu{
		width: 100%;
		margin-left: 10px;
		border-radius: 3px;
		background-color: #e58291;
		color: #fff;
		padding: 0 10px 0 10px;
		font-size:15px;
	}

	.form__border{
	}

	.form__dl{
    	width: 100%;
    	border:1px solid #aaa;
    	border-bottom:0;
	}
	#form__context__inner{
		border-bottom:1px solid #aaa;
	}

	.form__dl dl {
	    display: flex;
	    justify-content:flex-start;
		width:100%;
	}

	.form__dl dt{
		width: 35%;
	    padding: 20px;
	    box-sizing: border-box;
	    display: flex;
	    background: #eee;
	    font-size: 15px;
	    justify-content: flex-end;
	    border-right:1px solid #aaa;
	}

	.form__dl dd{
		width: 65%;
		box-sizing:border-box;
		padding:20px;
	}
	.form__dl dd input{
		width:85%;
		font-size:15px;
		padding:5px;
	}
	.input__context textarea{
	    display: inline-block;
	    padding: 5px;
	    font-size:15px;
	    vertical-align: middle;
	    width: 85%;
	    height:150px;
	    border: solid 1px #aaa;
	}

	.form__button{
		 font-family: "Sawarabi Gothic";
	    width: 300px;
	    cursor: pointer;
	    padding: 15px;
	    font-size: 20px;
	    box-sizing: border-box;
	    margin: 30px auto;
	    display: block;
	    color: #444;
	    background: #e2e2e2;
	    background: -moz-linear-gradient(top, #e2e2e2 0%, #dbdbdb 50%, #d1d1d1 51%, #fefefe 100%);
	    background: -webkit-linear-gradient(top, #e2e2e2 0%,#dbdbdb 50%,#d1d1d1 51%,#fefefe 100%);
	    background: linear-gradient(to bottom, #e2e2e2 0%,#dbdbdb 50%,#d1d1d1 51%,#fefefe 100%);
	    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e2e2e2', endColorstr='#fefefe',GradientType=0 );
	    border: 1px solid #aaa;
	    border-radius: 5px;
	    box-shadow: 0 2px #aaa;
	}
	.form__button:hover{
		text-decoration:underline;
		transition:.3s;
		opacity:.8;
	}
	form{
		text-align: left;
		width: 100%;
		margin: 20px auto 0;
	}
	#sentmail p{
		font-size:17px;
		text-align:left;
	}
	#sentmail .mail__tbl_wrapper{
		width:100%;
		margin:30px 0;
	}
	#sentmail .to_index a{
		 display: inline-block;
	    color: #444;
	    font-size: 16px;
	    padding: 10px 20px 10px 35px;
	    box-sizing: border-box;
	    margin: 0 auto 40px;
	    position: relative;
	    border-radius: 5px;
	    text-decoration: underline;
	    font-weight: bold;
	}
	#sentmail .to_index a:before{
		content: "";
	    display: block;
	    position: absolute;
	    width: 0;
	    height: 0;
	    border: 6px solid transparent;
	    border-left-color: #444;
	    left: 11px;
	    top: calc((100% - 13px)/2);
	}
	#sentmail .to_index a:after{
		content: "";
	    border: 3px solid #444;
	    border-radius: 100%;
	    padding: 10px;
	    box-sizing: border-box;
	    position: absolute;
	    left: 0;
	    top: calc((100% - 26px)/2);
	}
}
/***小さいタブレット(600~800px)*****/
@media screen and (max-width:799px) and (min-width:600px){
	.sp_only{
		display:inherit;
	}
	#header__midashi figure.models ul{
		display:flex;
		flex-wrap:wrap;
		align-items:flex-start !important;
		height:auto !important;
	}
	#header__midashi figure.models ul li{
		position:static !important;
		width:33.3% !important;
		display: block;
	    transition: 1s;
	    width: calc((100% - 40px)/5);
	    position: absolute;
	    left: 0;
	    top: 0;
	}
	.products_list ul li{
		width:30%;
		margin-right:5%;
	}
	.products_list ul li:nth-of-type(3n){
		margin:0;
	}
	.products_list ul li:nth-of-type(4n){
		margin-right:5%;
	}
	.sns{
		flex-wrap:wrap;
	}
	.sns > div{
		width:100% !important;
		height:55vw !important;
	}
	.sns > div:nth-of-type(1){
		margin-bottom:30px;
	}

	footer .rc{
		width:100%;
	}
	footer .footer_logo figure{
		width:15%;
		margin:0 auto 10px;
	}
	.footer_logo{
		margin:20px 0 0;
	}
	.footer_logo figure img{
		width:100%;
	}
	.footer__logo{
		font-size:35px;
	}
	.shop_info{
		padding:30px 0;
	}
	footer .lc{
		height:40vw;
		width:100%;
		margin-bottom:30px;
	}
}
/**********タブレット(max:1299px～min:600px)***********/
/**********スマホ(max:599px～min:360px)****************/
@media screen and (max-width:599px){

	html,body{
		min-width: 360px;
		margin: 0 auto;
	}
	.sp_only{
		display:inherit;
	}
	.ttl{
		font-family: 'Cinzel', serif;
		font-size: 22px !important;
		letter-spacing: 7px;
	}

	.section{
		height: 100%;
	}

	.inr{
		margin: 0 auto;
		height: 100%;
	} 

	.s_ttl{
		font-size: 13px;
	}

	.br__pc{
		display:none;
	}

	#wrapper{
		position: relative;
		top: 0;
		right: 0;
		width:100%;
		margin: 0 auto;
		background-color: #fff;
		overflow:hidden;
	}

	#header{
		position: relative;
	}

	.header__log{
		position: absolute;
		top: 25%;
		left: 50%;
		-webkit-transform: translate(-50%,-50%);
		-moz-transform: translate(-50%,-50%);
		-ms-transform: translate(-50%,-50%);
		-o-transform: translate(-50%,-50%);
		transform: translate(-50%,-50%);
	}

	.header__log img{
		width: 50%;
		opacity: 0.5;
		margin-bottom:15px;
	}

	.header__logo1{
		color: #fff;
		font-size: 35px;
		letter-spacing: 10px
	}

	.header__logo2{
		color: #fff;
		font-size: 20px;
		letter-spacing: 4px
	}
	.scrolls{
		right:-25px !important;
	}
	#header__midashi{
		font-family: 'Sawarabi Gothic', serif;
		font-size: 13px;
		color: #8C8C8C;
		text-align:left;
	}
	#header__midashi figure.models ul{
		display:flex;
		flex-wrap:wrap;
		align-items:flex-start !important;
		height:inherit;
	}
	#header__midashi figure.models ul li{
		position:static !important;
		width:33.3% !important;
		display: block;
	    transition: 1s;
	    width: calc((100% - 40px)/5);
	    position: absolute;
	    left: 0;
	    top: 0;
	}
	#header__midashi .subtext2{
		padding:2%;
	}
	#header__mainvisual{
		width: 100%;
		height: 200px;
		background-color: #808080;
	}

	#header__mainvisual img{
		width: 100%;
		margin: 0;
	}
	.catch_copy{
		position:absolute;
		background:rgba(0,0,0,.4);
		width:100%;
		left:0;
		top:40vw;
		text-align:left;
		padding:5% 10%;
		box-sizing:border-box;
		z-index:8000;
		color:#fff;
	}
	.catch_copy h2{
		font-family:"Sawarabi Mincho";
		text-align:center;
		border-bottom:1px solid #fff;
		font-weight:normal;
		margin-bottom:20px;
		font-size:7vw;
	}
	.catch_copy p{
		font-size:4vw;
		width:100%;
		margin:0 auto;
	}


	#nav-drawer {
		position: fixed;
		top:  10px;
		right: 10px;
	  	height: 22px;
	  	z-index: 9999;
	}
	#header__nav ul li{
		width:100% !important;
		height:unset !important;
		padding:10px 10%;
		text-align:left;
		border-bottom:1px solid #aaa;
	}
	#header__nav ul li:before,
	#header__nav ul li:after{
		display:none;
	}
	#header__nav ul li:before{
		content:"";
		display:block;
		border-left:1px solid #444;
	}
	/*チェックボックス等は非表示に*/
	.nav-unshown {
	  	display:none;
	}

	/*アイコンのスペース*/
	#nav-open {
	  	display: inline-block;
	  	width: 30px;
	  	height: 22px;
	  	vertical-align: middle;
	  	padding:7px;
	  	background:rgba(0,0,0,.4);
	  	position:relative;
	  	z-index:1000000;
	}

	/*ハンバーガーアイコンをCSSだけで表現*/
	#nav-open span, #nav-open span:before, #nav-open span:after {
	  	position: absolute;
	  	height: 2px;/*線の太さ*/
	  	width: 30px;/*長さ*/
	  	margin:0 calc((100% - 30px)/2);
	  	border-radius: 3px;
	  	background: #555;
	  	display: block;
	  	content: '';
	  	cursor: pointer;
	  	right: 0;
	  	background-color: white;
	  	z-index:9999;
	  	transition:.3s;
	}

	#nav-open span:before {
	  	bottom: -10px;
	}

	#nav-open span:after {
	  	bottom: -20px;
	}

	/*閉じる用の薄黒カバー*/
	#nav-close {
	  	display: none;/*はじめは隠しておく*/
	  	position: fixed;
	  	z-index: 99;
	  	top: 0;/*全体に広がるように*/
	  	left: 0;
	  	width: 100%;
	  	height: 100%;
	  	background: black;
	  	opacity: 0;
	  	transition: .3s ease-in-out;
	}

	/*中身*/
	#nav-content {
	  	overflow: auto;
	  	position: fixed;
	  	top: 0;
	  	left: 0;
	  	z-index: 999999;/*最前面に*/
	  	width: 50%;/*右側に隙間を作る（閉じるカバーを表示）*/
	  	max-width: 220px;/*最大幅（調整してください）*/
	  	height: 100%;
	  	background: #eee;/*背景色*/
	  	transition: .3s ease-in-out;/*滑らかに表示*/
	  	-webkit-transform: translateX(-105%);
	  	transform: translateX(-105%);/*左に隠しておく*/
	}
	#nav-content ul {
		display:flex;
		flex-wrap:wrap;
	}
	#nav-content ul li.nav_title {
		background: #444;
	    color: #fff;
	    text-align: left;
	    text-indent: 1.2em;
	    font-size: 20px;
	    padding: 5px 5%;
	}
	#nav-content  a{
		color: #444 !important;
	}
	#header__nav ul li a:before{
		display:none;
	}
	/*チェックが入ったらもろもろ表示*/
	#nav-input:checked ~ #nav-close {
	  	display: block;/*カバーを表示*/
	  	opacity: .5;
	}

	#nav-input:checked ~ #nav-content {
	 	 -webkit-transform: translateX(0%);
	 	 transform: translateX(0%);/*中身を表示（右へスライド）*/
	 	 box-shadow: 6px 0 25px rgba(0,0,0,.15);
	}

	.rotate{
		transform: rotate(45deg);
		top:17px;
		transition:.3s;
	}

	.rotate:before{
	  	bottom: 0px !important;
	}

	.rotate::before{
	  	transform: rotate(90deg);
	}

	.rotate::after{
		display: none !important;
	}
	.nav_footer{
		position:fixed;
		width:100%;
		left:0;
		bottom:0;
	}
	.nav_f_sns{
		padding:10px;
	}
	.nav_f_sns a{
		display:flex;
		margin-bottom:20px;
		align-items:center;
		justify-content:flex-start;
		font-size:20px;
	}
	.nav_f_sns a:nth-of-type(2){
		margin:0;
	}
	.nav_f_sns a img{
		width:30px;
		height:30px;
		margin-right:10px;
	}

	#product{
		width: 100%;
	}

	.products_list{
		width: 100%;
	}
	.products_list ul{
		display:flex;
		flex-wrap:wrap;
	}
	.products_list ul li{
		width: 45%;
		margin:0 10% 5% 0;
		text-align:right;
		transition:.5s;
	}
	.products_list ul li:nth-of-type(2n){
		margin:0;
	}

	.products_list ul li img{
		width: 100%;
	}

	.topics__detail{
		width: 100%;
		padding: 0 0 10% 0;
		clear: both;
	}
	#topics{
		color: #000;
		clear: both;
		padding:2% 0 2.5%;
	}

	#topics__new{
		width: 100%;
	    background: url(../images/topic_bg_01.jpg) center left no-repeat;
	    background-size: contain;
	    border-bottom: 1px solid #ddd;
	    background-color: #4b4b4b;
	}
	.fb_feeds dl{
		display:flex;
		flex-wrap:wrap;
		justify-content:flex-start;
		font-family:"Sawarabi Gothic";
	}
	.fb_feeds dl:before,
	.fb_feeds dl:after{
		display:none !important;
	}
	.fb_feeds dl dt{
		width:100%;
	}
	.fb_feeds dl dd{
		text-indent:.5em;
	}


	#about .details{
		display:flex;
		flex-wrap:wrap;
	}
	#about .details .about__img{
		width:100% !important;
		margin-bottom:20px;
	}
	#about .details #about__shopinfo{
		width:100% !important;
	}

	#brand__list ul li{
		width: 50%;
		float:left;
	}
	#brand__list ul{
		display:flex;
		align-items:center;
		justify-content:space-between;
	}
	#brand__list ul li{
		width:45%;
		margin-bottom:10%;
	}
	#about{
		height: 100%;
		font-size: 15px;
	}

	#about .about__img{
		margin: 0 0 10% 0;
	}
	#about .sns{
		flex-wrap:wrap;
		box-sizing:border-box;
	}
	#about .sns > div{
		width:100%;
		height:80vw;
		margin-bottom:20px;
	}
	#about .sns > div:nth-of-type(2){
		margin:0;
	}

	footer{
		padding:5% 5% 0 !important;
		width:100%;
		color: #fff;
		box-sizing:border-box;
	}

	footer .lc{
		width:100%;
		height:250px;
		margin-bottom:20px;
	}
	footer .rc{
		width:100%;
		margin:0;
	}
	footer .footer_logo figure{
		width:90px;
		margin:0 auto 10px;
	}
	footer .footer_logo figure img{
		width:100%;
	}
	.shop_address{
		padding:0;
	}
	.arrow{
		width: 25px;
	    height: 25px;
	    border: 2px solid;
	    border-color: #eee #eee transparent transparent;
	    transform: rotate(-45deg);
	    margin: 0 auto;
	}

	.footer__logo{
		font-size: 35px;
		letter-spacing: 10px
	}

	.footer__logo2{
		font-size: 20px;
		letter-spacing: 4px
	}
	footer .tel{
		font-size:25px;
	}
	footer .open{
		font-size:25px;
	}


	/**下層ページ**/
	.lower header{
		height:auto;
	}
	.lower .big_ttl{
		height:40vw;
	}
	.lower .big_ttl h2{
		width: 40%;
	    left: calc((100% - 50%)/2);
	    top: calc((100% - 80px)/2);
	    font-size: 24px;
	}
	.lower .big_ttl h2 span.sub{
		display:block;
		border-top:1px solid #fff;
		font-size:15px;
		padding-top:5px;
		margin-top:5px;
		letter-spacing:5px;
	}

	#catalog{
	}


	#catalog__nav ul{
		display:flex;
		background:#444;
		justify-content:flex-start;
		flex-wrap:wrap;
	}
	#catalog__nav ul li{
		color:#fff;
		position:relative;
		box-sizing:border-box;
		border-right:1px solid #fff;
		padding:5px 0;
	}
	#catalog__nav ul li:nth-last-of-type(1){
		border:0;
	}
	#catalog__nav ul li.list_title{
		width:100%;
		border:0;
		border-bottom:1px solid #fff;
	}
	#catalog__nav ul li a{
		color:#fff;
		padding:5px 2vw;
	}
	/**about**/
	.lower .about__left{
		display:flex;
		align-items:flex-start;
		overflow:hidden;
	}
	.lower .about__left img{
		width:100%;
	}
	.lower .about__right p{
		text-align:left;
		font-size:18px;
		padding:10px;
	}
	.lower .tbl_wrapper table{
		width:100%;
		border-collapse:collapse;
		border:1px solid #aaa;
	}
	.lower .tbl_wrapper table th{
		width:30%;
		padding:10px 0;
		background:#eee;
		font-size:15px;
		border:1px solid #aaa;
		font-weight:normal;
		font-family:"Sawarabi Gothic";
	}
	.lower .tbl_wrapper table td{
		font-size:15px;
		border:1px solid #aaa;
		font-family:"Sawarabi Gothic";
	}
	/***************** mail **************************/
	#form__container p{
		text-align:left;
	}

	#form__container label{
		width: 100%;
		display:block;
		margin-bottom:5px;
		font-size:17px;
	}

	.hissu{
		width: 20%;
		border-radius: 3px;
		background-color: #e58291;
		color: #fff;
		margin-left:10px;
		font-size:15px;
		padding: 0 10px 0 10px;
	}

	.form__border{
		padding-top: 30px;
	}

	.form__dl{
		display: table;
    	width: 100%;
	}

	.form__dl dl {
	}

	.form__dl dt{
		width: 100%;
		vertical-align: top;
	}

	.form__dl dd{
		width: 100%;
	 }
	 .form__dl dd input{
	 	width:100%;
	 	box-sizing:border-box;
	 	padding:5px;
	 	font-size:17px;
	 }

	.input__context textarea{
		width: 100%;
	    border: solid 1px #aaa;
	    padding:5px;
	    font-size:17px;
	    height:6em;
	    box-sizing:border-box;
	}

	.form__button{
		font-family: "Sawarabi Gothic";
	    margin: 50px auto 30px;
	    width: 80%;
	    padding: 15px 0;
	    box-sizing: border-box;
	    font-size: 18px;
	    display: block;
	}

	.form__button input{
		width: 100%;
		height: 50px;
		background-color: #4f4e4e;
		color: #fff;
		box-sizing:border-box;
		font-size: 18px;
	}

	form{
		text-align: left;
		width: 100%;
		margin: 0 auto;
	}
		#sentmail p{
		font-size:17px;
		text-align:left;
	}
	#sentmail .mail__tbl_wrapper{
		width:100%;
		margin:30px 0;
	}
	#sentmail .to_index a{
		 display: inline-block;
	    color: #444;
	    font-size: 16px;
	    padding: 10px 20px 10px 35px;
	    box-sizing: border-box;
	    margin: 0 auto 40px;
	    position: relative;
	    border-radius: 5px;
	    text-decoration: underline;
	    font-weight: bold;
	}
	#sentmail .to_index a:before{
		content: "";
	    display: block;
	    position: absolute;
	    width: 0;
	    height: 0;
	    border: 6px solid transparent;
	    border-left-color: #444;
	    left: 11px;
	    top: calc((100% - 13px)/2);
	}
	#sentmail .to_index a:after{
		content: "";
	    border: 3px solid #444;
	    border-radius: 100%;
	    padding: 10px;
	    box-sizing: border-box;
	    position: absolute;
	    left: 0;
	    top: calc((100% - 26px)/2);
	}
}
/**********スマホ(max:599px～min:360px)****************/