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

@import url(http://fonts.googleapis.com/earlyaccess/notosansjapanese.css);

/* T A G
----------------------------------------------------*/
html {font-size: 62.5%;}
body {font-size: 1.0rem;}

div,
li, 
dt, 
dd, 
th, 
td, 
p,
a,
button,
input,
select,
textarea {
  font-family:'Noto Sans Japanese',"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ",Meiryo,"ＭＳ Ｐゴシック","MS PGothic",sans-serif;
  color:#555;
  font-size:1.3rem;
  letter-spacing: .25rem;
  line-height: 1.8;
}
h1,h2,h3,h4,h5,h6 {
  font-family:'Dosis',"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ",Meiryo,"ＭＳ Ｐゴシック","MS PGothic",sans-serif;
  font-weight: 300;
  letter-spacing: 0.15em;
  margin:0;
}

body {
  min-width: 320px;
  background-color: #FCFBF7;
}
img {
  max-width: 100%;
  height: auto;
}

table {
	/*width: 100%;*/
}

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

/*clearfix*/
.clearfix {
  zoom: 1;
}
.clearfix:after {
  content: "";
  display: block;
  clear: both;
}


a {transition: all .6s;}
a:hover {opacity:0.8;}


/* C O M M O N
=========================================================*/
/* ------------
   class
------------ */
.both {
	clear: both;
}
.over {
 overflow: hidden;
}
.box {
 background-color: #EEE;
}

/* ------------
   font
------------ */
.fs10 { font-size:1rem;}
.fs11 { font-size:1.1rem;}
.fs12 { font-size:1.2rem;}
.fs13 { font-size:1.3rem;}
.fs14 { font-size:1.4rem;}
.fs16 { font-size:1.6rem;}
.fs18 { font-size:1.8rem;}
.fs22 { font-size:2.2rem;}
.fs24 { font-size:2.4rem;}

.red { color: #CC2936;}
.beige { color: #827459;}

.gf2 {font-family: 'Dosis',Verdana,sans-serif; font-weight:200;}
.gf3 {font-family: 'Dosis',Verdana,sans-serif; font-weight:300;}
.gf4 {font-family: 'Dosis',Verdana,sans-serif; font-weight:400;}
.gf5 {font-family: 'Dosis',Verdana,sans-serif; font-weight:500;}
.gf6 {font-family: 'Dosis',Verdana,sans-serif; font-weight:600;}
.gf7 {font-family: 'Dosis',Verdana,sans-serif; font-weight:700;}

.bold { font-weight:600;}

.ls1 { letter-spacing:0.1em;}
.ls_1 { letter-spacing:-0.1em;}

/* ------------
   margin
------------ */



/* ------------
   align
------------ */
.t_center {text-align: center;}
.t_left {text-align: left;}
.t_right {text-align: right;}

/* ------------
   float
------------ */
.f_left {float: left;}
.f_right {float: right;}




/* R A Y O U T
----------------------------------------------------*/
.wrapper{
width: 100%;
display: block;
position:relative;
margin:0 auto;
letter-spacing: -0.4em;
color:#544F43;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.wrapper:after{
content:"";
display: block;
clear:both;
box-sizing: border-box;
}

/* G R I D
----------------------------------------------------*/

.fcol2_1,.fcol2_2,.fcol3_1 , .fcol3_2 , .fcol3_3,.fcol4_1 , .fcol4_2 , .fcol4_3 , .fcol4_4 {
 text-align: center;
 margin-bottom: .5rem;
}

.icol1,.icol2,.icol3,.icol4,.icol5,.icol6,
.icol7,.icol8,.icol9,.icol10,.icol11,.icol12{
 display:inline-block;
 vertical-align:middle;
 margin-left: 2%;
 margin-right: 2%;
 margin-top:10px;
 margin-bottom: 10px;
 width:96%;
 letter-spacing: normal;
 box-sizing: border-box;
 text-align: center;
}


/* H E A D E R
----------------------------------------------------*/
/*
.header {
  margin-bottom: 1em;
 position: relative;
}
.header h1 a {
  text-decoration: none;
}
.header h1 span {
  display: block;
  margin-bottom:0.2em;
  text-align: center;
  font-size: 77%;
  letter-spacing: normal;
}
.header h1 span.logo {
  font: 300 32px/1.0 'Lato',Verdana,sans-serif;
}
.header h1 span.logo strong {font-weight: 400;}
.header h1 span.shopname {
  font-weight: 600;
  font-size: 85%;
 
}
*/

/*------------------
Gnavi
-------------------*/
/* MENU Button 
#toggle {
   position: absolute;
   top: 5px;
}
#toggle a{
    display: block;
    position: relative;
    padding: 15px 0;
    width: 60px;
    text-indent: -9999px;
}
#toggle:before {
    display: block;
    content: "";
    position: absolute;
    top: 42%;
    left: 10px;
    width: 30px;
    height: 16px;
    margin-top: -4px;
    background: #CC2936;
}
#toggle a:before, #toggle a:after {
    display: block;
    content: "";
    position: absolute;
    top: 42%;
    left: 10px;
    width: 30px;
    height: 5px;
    background: #FFF;
}
#toggle a:before {
    margin-top:-2px;
}
#toggle a:after {
    margin-top: 5px;
}


nav.gnavi {display: none;}
nav.gnavi {
  margin: 1em 0;
}
nav.gnavi ul {
  margin: 0;
  padding: 0;
  list-style: none;
  
}
nav.gnavi ul li {
  border-top: 1px solid #EEE;
  width: 100%;
}
nav.gnavi ul li:last-child {
  border-bottom: 1px solid #EEE;
}
nav.gnavi ul li a {
  display: block;
  padding: 15px 10px;
  text-decoration: none;
}
nav.gnavi ul li a strong {
  display: inline-block;
  margin-right: 10px;
  font: 300 2.4rem/1.0 'Lato',Verdana,sans-serif;
}
*/

/* F O O T E R
----------------------------------------------------
.footer {
 margin-top: 2em;
 padding: 2em 0;
 background-color: #333;
  }
.footer ul {
 padding: 0;
 margin-bottom: 2em;
}
.footer ul li {
 display:block;
}
.footer ul li a {
 padding-left: 15px;
 margin: 0.5em;
 background: url("../img/allow_gl_b.png") 0 50% no-repeat;
 background-size: 8px;
 color: #FFF;
 font-size: 100%;
 text-decoration: none;
 line-height: 2.4;
}
.footer small {
 display: block;
 text-align: center;
 color: #FFF;
}
*/

/*media Queries (481px)
------------------------------------------------------------------------*/
@media only screen and (min-width: 480px) {
}

/*media Queries (768px)
------------------------------------------------------------------------*/
@media only screen and (min-width: 768px) {

/* Column Float */
.fcol2_1 {
	width: 49%;
	float: left;
}
.fcol2_2 {
	width: 49%;
	float: right;
}
.fcol3_1 , .fcol3_2 , .fcol3_3 {
	width: 32%;
	float: left;
}
.fcol3_2 {
	margin-right: 2%;
	margin-left: 2%;
}
.fcol4_1 , .fcol4_2 , .fcol4_3 , .fcol4_4 {
	width: 23.5%;
	float: left;
}
.fcol4_2 {
	margin-left: 2%;
	margin-right: 2%;
}
.fcol4_3 {
	margin-right: 2%;
}

/* Column inline-block */
.icol1,.icol2,.icol3,.icol4,.icol5,.icol6,
.icol7,.icol8,.icol9,.icol10,.icol11,.icol12 {
margin-top:20px;
margin-bottom:20px;
}
.icol1 { width:4.168%; }
.icol2 { width:12.5%; }
.icol3 { width:20.835%; }
.icol4 { width:29.168%; }
.icol5 { width:37.5%; }
.icol6 { width:45.83%; }
.icol7 { width:54.168%; }
.icol8 { width:62.5%; }
.icol9 { width:70.835%; }
.icol10 { width:79.168%; }
.icol11 { width:87.5%; }
.icol12 { width:95.8318%; }
.icol100 { width:100.0%; }





/*------------------
Gnavi
-----------------------
nav.gnavi {display: block;}
#toggle {display: none;}
 
nav.gnavi {
  text-align: center;
}
nav.gnavi ul {
 text-align: center;
 /*font-size: 0; i-b 隙間埋め用 
 letter-spacing: -0.4em;/* i-b 隙間埋め用 
}
nav.gnavi ul li {
  display: inline-block;
  width: 20%;
  margin: 0;
  border-top: none;
  border-bottom: 1px solid #F5F5F5;
  border-left: none;
}
nav.gnavi ul li:last-child {
  border-bottom: none;
}

nav.gnavi ul li a {
 position: relative;
  display: block;
 padding: 15px 0;
 text-decoration: none;
 font-size: 1.1rem;
 text-align: center;
}
nav.gnavi ul li a strong {
 display: block;
 font-size: 1.6rem;
 margin-bottom: .3em;
 text-align: center;
 margin-right: 0;
}
nav.gnavi ul li a:after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 1px;
  transform: scaleX(0);
  background-color: #666;
  transition: all .3s ease;
}
nav.gnavi ul li a:hover:after {
  transform: scaleX(1);
}
*/
 
/* F O O T E R
----------------------------------------------------
 .footer ul {
 text-align: center;
 } 
 .footer ul li {
 display:inline-block;
 }
 .footer ul li a {
 font-size: 93%;
 } 
 */

}


/*media Queries (960px)
------------------------------------------------------------------------*/
@media only screen and (min-width: 960px) {
.wrapper {
  max-width: 960px;
  margin: 0 auto;
}


  
}


/*media Queries (1280px)
------------------------------------------------------------------------*/
@media only screen and (min-width: 1200px) {


}