/*
    Theme Name: original
*/
@charset "utf-8";

@media screen and (min-width:769px){
/*-------------------------------------------
all
-------------------------------------------*/
body {
   font: 90%/1.8 Arial , "Open Sans" , "Helvetica Neue" , Helvetica , Verdana , Roboto , "游ゴシック" , "Yu Gothic" , "游ゴシック体" , "YuGothic" , "ヒラギノ角ゴ Pro W3" , "Hiragino Kaku Gothic Pro" , "Meiryo UI" , "メイリオ" , Meiryo , "ＭＳ Ｐゴシック" , "MS PGothic" , sans-serif;
  width:100%;
  color:#000;
  max-width:2000px;
  margin:0 auto;
}

/*-------------------------------------------
header
-------------------------------------------*/
header{
  background: url(images/bg_header.jpg) 50% 50% no-repeat;
  width:100%;
  height:850px;
}
header h1{
  height:800px;
  text-align:center;
  padding-top:150px;
}
/*-------------------------------------------
nav
-------------------------------------------*/
#hnav{
  background: #000;
  height:50px;
  line-height:50px;
}

#hnav ul{
  display: -webkit-flex;
  display:flex;
}

#hnav li {
  width:20%;
}
#hnav li a{
  font-family: "EB Garamond";
  display:block;
  text-align: center;
  letter-spacing: 4px;
  color:#fff;
  font-size:130%;
  text-decoration:none;
}
#hnav li a:hover{
  background:#333;
}
/*-------------------------------------------
main
-------------------------------------------*/
section{
  width:100%;
}
section h2{
  font-family: "EB Garamond";
  text-align: center;
  font-size:70px;
  line-height:70px;
  letter-spacing: 10px;
  padding:50px 0 20px 0;
}

section h3{
  font-family: "EB Garamond";
  text-align: center;
  font-size:20px;
  letter-spacing: 4px;
  padding:0 0 30px 0;
}

section p{
  margin-bottom: 30px;
  font-size:120%;
}

section p:last-child{
  margin-bottom: 0;
}

#concept{
  background: url(images/bg_concept.jpg) 50% 50% no-repeat;
  height:800px;
}

#concept .blc{
  width:40%;
  height:100%;
  background: rgba(255,255,255,0.8);
  margin:0 auto;
}
#concept h4{
  padding:0 30px 30px 30px;
}
#concept h4,#concept p{
  text-align: center;
}

#pholosophy{
  background: url(images/bg_philosophy.jpg) 40% 50% no-repeat;
  height:800px;
}

#pholosophy .blc{
  width:50%;
  margin:0 50px 0 auto;
  height:100%;
}

#pholosophy h4{
  text-align:center;
  margin-bottom:30px;
}

#pholosophy h4 strong{
  color:#a4945d;
  display:block;
  font-size:150%;
}

#pholosophy p{
  text-align: center;
}

#ourteam{
  background:#000;
  padding:0 50px 50px 50px;
}

#ourteam h2{
  display: block;
  margin:0 auto;
  padding:50px 0;
}

#ourteam h3{
  text-align: right;
  color:#fff;
  font-size:190%;
}

#ourteam p{
  text-align: right;
  color:#fff;
}

#event{
  background: url(images/bg_event.jpg) 50% 50% no-repeat;
  height:800px;
}
#event .blc{
  background: rgba(255,255,255,0.8);
  width:33%;
  height:100%;
  margin-left: 50px;
  padding:0 30px;
}

#event h4{
  text-align: center;
  font-size:18px;
  margin-bottom:30px;
}

#contact{
  background: url(images/bg_contact.jpg) 50% 50% no-repeat;
  height:800px;
}

#contact .blc{
  background: rgba(255,255,255,0.8);
  width:50%;
  margin:50px auto;
  height:50%;
  padding:170px 50px;
  text-align:center;
}

/*-------------------------------------------
footer
-------------------------------------------*/
.bread{
  background:#000;
  padding:10px;
  color:#fff;
}

.fblc{
  display: -webkit-flex;
  display:flex;
  align-items: center;
  padding:20px;
}

.fblc h2{
  width:50%;
  margin-left:20px;
}
.fblc h2 strong{
  display:block;
  color:#a4945d;
  font-size:120%;
}
.fblc ul{
  position:relative;
  padding-left:20px;
  margin-left:auto;
}
.fblc ul li a{
  color:#000;
  text-decoration:none;
}
.fblc ul li a:hover{
  text-decoration:underline;
}
.fblc ul li a:before{
  font-family: FontAwesome;
  content: "";
  position:absolute;
  left:0;
}

.copy{
  border-top:1px solid #000;
  text-align: center;
  padding: 10px 0;
}

}