@charset "shift_jis";
@font-face {
	font-family: "Kokoro";
	src: url("../../font/Kokoro.eot?") format('eot'),
	url("../../font/Kokoro.woff") format('woff'),
	url("../../font/Kokoro.otf")  format('opentype');
}
*{
	list-style:none;
	margin:0;
	padding:0;
}
*, *:before, *:after {
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
         -o-box-sizing: border-box;
        -ms-box-sizing: border-box;
            box-sizing: border-box;
}

img{
	border:none;
}

body{
	font-size:80%; 
	color: #504229;
	font-family:"ƒ�ƒCƒŠƒI",Osaka; 
}

a{
	color:#504229;
	text-decoration:none;
}
a:hover{
	text-decoration:none;
}

#wrapper{
	width:900px;
	align-items: flex-start ;
	display:flex;
	justify-content: space-between;
	line-height:1.8;
	padding:20px 0;
	margin:0 auto;
}

#wrapper h2{
	font-family:"Kokoro","ƒqƒ‰ƒMƒm–¾’© Pro W3","HG–¾’©E","‚l‚r ‚o–¾’©","‚l‚r –¾’©",serif;
	font-weight:normal;
	margin:0 0 15px;
}

#left{
	width:230px;
	background: url(images/bg.jpg) fixed;
	border-radius:10px;
	padding:20px 20px 0;
}
#left ul{
	list-style:none;
	padding:0 0 30px;
}
#left ul li{
	display:inline-block;
}

#right{
	width:600px;
	display:flex;
	flex-wrap:wrap;
	justify-content: space-between;
}


#right p{
	padding:0 0 1em;
}


#right h2{
	margin:0 0 10px;
}

#right  div{
	width:45%;
	padding:0 0 80px;
}

.clearfix:after {
  content: ".";  
  display: block; 
  clear: both;
  height: 0;
  visibility: hidden;
}

.clearfix {
  min-height: 1px;
}

* html .clearfix {
  height: 1px;
  /*\*//*/
  height: auto;
  overflow: hidden;
  /**/
}


@media screen and (max-width: 800px){
#wrapper{
	width:90% !important;
	flex-direction:column;
	padding:30px 0 50px!important;
	margin:0 auto;
}



#left{
	order: 2;
	width:100%;
}

#left a{
	color:#504229;
}
#left li a{
	display:inline-block;
	color:#504229;
	background:#fff;
	margin:0 0 1em;
	padding:.2em 1em;
}
#right{
	order: 1;
	display:block;
	width:100%;
}
#right div{
	display:block;
	width:100%;
}
}