/*
** Table of contents
**  1 - General (Page : index)
**  2 - Responsive Max Width: 640px
**  3 - CSS for Print
*/


/*
**  1 - General
*/

.font01{
  font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN", "Hiragino Mincho ProN", "Sawarabi Mincho", "ＭＳ Ｐ明朝", "MS PMincho", "HGS明朝E", serif;
}
.font02{
  font-family: "游ゴシック", YuGothic, "ヒラギノ角ゴ ProN","Hiragino Kaku Gothic ProN", "ＭＳ Ｐゴシック", "MS P Gothic", Osaka, "メイリオ", Meiryo, Verdana,Arial, Helvetica, sans-serif;
}
.font03{
  font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN", "Hiragino Mincho ProN", "Sawarabi Mincho", "ＭＳ Ｐ明朝", "MS PMincho", "HGS明朝E", serif;
}
.font04{
  font-family: "Fjalla One", "AvenirNextCondensed-DemiBold", "Avenir Next Condensed", Impact, sans-serif-condensed;
}

#philosophy .wrapper{
}
#philosophy .wrapper .menu-title .title{
  font-size:7em;
  color:#beaf3f;
  letter-spacing:13px;
}
#philosophy .wrapper .content .subtitle{
  font-size:2.25em;
  display:inline;
  font-weight:bold;
  line-height: 260%;
}

#philosophy .wrapper .content .subtitle2{
  font-size:2.25em;
  display:inline;
  font-weight:bold;
  line-height: 240%;
}

#philosophy .wrapper .content .text{
  border-top:1px solid white;
  font-size:1.2em;
  line-height: 200%;
  padding-top:30px;
}


#points .wrapper .menu-title{
  font-size:1.9em;
  font-weight:bold;
}
#points .wrapper .menu-title p{
  display:inline;
}


#points_menu .wrapper .title .eng{
  font-size:1.2em;
  letter-spacing:4px;
}
#points_menu .wrapper .title .jp{
  font-size:2em;
  line-height:190%;
  color:#B7AB80;
  display:inline;
}
#points_menu .wrapper #points_menu_01 .title .jp{letter-spacing:4px;}
#points_menu .wrapper #points_menu_02 .title .jp{letter-spacing:-2px;}
#points_menu .wrapper #points_menu_03 .title .jp{letter-spacing:4px;}

#points_menu .wrapper .subtitle{
  font-size:2em;
  line-height:160%;
}
#points_menu .wrapper .subtitle p{
	display:inline;
}
#points_menu .wrapper .text{
  font-size:1em;
  line-height:190%;
}


#case .wrapper .menu-title{
}
#case .wrapper .menu-title .title .eng{
  font-size:3.25em;
  letter-spacing:4px;
  line-height:200%;
  color:#B7AB80;
}
#case .wrapper .menu-title .title .eng span{
  font-size:1.2em;
}
#case .wrapper .menu-title .title .jp{
  display:inline;
  font-size:2em;
}

#case .wrapper .case_box{
  
}
#case .wrapper .case_box .box_wrapper .title{
  width:300px;
  border:1px solid white;
  padding:45px 0px;
  letter-spacing:3px;
  font-size:1.5em;
  color:#beaf3f;
}

#case .wrapper #case_before{
  width:92%;
  margin:0px auto;
  padding-top:150px;
}
#case .wrapper #case_before .before_image{
  height:700px;
  background-image: url("../../images/case_content_01.png");
  background-repeat: no-repeat;
  background-position: right bottom;
}
#case .wrapper #case_before .box_wrapper{
  width:50%;  
  float:left;
}
#case .wrapper #case_before .box_wrapper .outline{
  text-align: left;
  font-size:1em;
  padding-left:40px;
  line-height:140%;
}
#case .wrapper #case_before .box_wrapper .outline .outline_title{
  width:300px;
  border-bottom:1px solid white;
  color:#B7AB80;
  font-size:1em;
  line-height:160%;
  letter-spacing:2px;
}
#case .wrapper #case_before .box_wrapper .text{
  padding-top:160px;
  padding-left:40px;
  text-align: left;
  font-size:1.25em;
  line-height:160%;
}


#case .wrapper #case_presentation{
  width:92%;
  margin:0px auto;
  padding-top:150px;
}
#case .wrapper #case_presentation .box_wrapper{
  width:100%;
}
#case .wrapper #case_presentation .presentation_image{
  width:1000px;
  height:600px;
  background-image: url("../../images/case_content_02_01.png");
  background-repeat: no-repeat;
  background-position: right top;
}
#case .wrapper #case_presentation .text{
  padding-top:60px;
  text-align: left;
  font-size:1.25em;
  line-height:160%;
}
#case .wrapper #case_presentation .image{
  float:left;
}

#case .wrapper #case_after{
  width:92%;
  margin:0px auto;
  padding-top:150px;
}

#case .wrapper #case_after .box_wrapper .title{
  float:left;  
}
#case .wrapper #case_after .box_wrapper .text{
  padding-top:10px;
  padding-left:30px;
  float:left;
  text-align: left;
  font-size:1.25em;
  line-height:160%;
}



#contact .wrapper .menu-title{
  font-size: 4em;
  font-weight:100;
  color:#505050;
  letter-spacing:4px;
}

#contact .wrapper .contact-box{
  text-align: left;
}
#contact .wrapper .contact-box  .title{
  font-size: 0.8em;  
  line-height:140%;
  padding:10px 0px;
  letter-spacing:4px;
}
#contact .wrapper .contact-box .content{
  font-size: 0.5em;
  line-height:150%;
  font-weight:300;
}


/*
** 2 - Responsive
**     Max Width: 800px
**
*/
/* Max Width: 800px */
@media only screen and (max-width: 800px) {

.spnobreak{
    display:inline;
}

  
#philosophy .wrapper{
}
#philosophy .wrapper .menu-title .title{
  font-size:10vw;
  font-weight:100;
  letter-spacing:8px;
}
#philosophy .wrapper .content .subtitle{
  font-size:6vw;
  display:block;
  line-height: 140%;
}
#philosophy .wrapper .content .subtitle2{
  font-size:6vw;
  display:block;
  line-height: 140%;
}

#philosophy .wrapper .content .text{
  width:93%;
  font-size:4vw;
  line-height: 170%;
  margin:10px auto;
  padding-top:20px;
  text-align:left;
}
#philosophy .wrapper .content .text p{
  display:block;
  text-align:left;
}

#points .wrapper .menu-title{
  width:100%;
  font-size:6vw;
  font-weight:bold;
  line-height: 160%;
}
#points .wrapper .menu-title p{
  display:block;
}


#points_menu .wrapper .title .eng{
  font-size:3vw;
  letter-spacing:4px;
}
#points_menu .wrapper .title .jp{
  font-size:5vw;
  line-height:190%;
  color:#B7AB80;
}
#points_menu .wrapper #points_menu_01 .title .jp{letter-spacing:4px;}
#points_menu .wrapper #points_menu_02 .title .jp{letter-spacing:-2px;}
#points_menu .wrapper #points_menu_03 .title .jp{letter-spacing:4px;}

#points_menu .wrapper .subtitle{
  font-size:5vw;
  line-height:160%;
}
#points_menu .wrapper .subtitle p{
	display:block;
}
#points_menu .wrapper .text{
  font-size:4vw;
  line-height:190%;
  text-align:left;
}


#case .wrapper .menu-title{
}
#case .wrapper .menu-title .title .eng{
  font-size:5.5vw;
  letter-spacing:1px;
  line-height:200%;
  color:#B7AB80;
}
#case .wrapper .menu-title .title .eng span{
  font-size:6vw;
}
#case .wrapper .menu-title .title .jp{
  display:block;
  line-height:160%;
  font-size:4vw;
}

#case .wrapper .case_box{
  
}
#case .wrapper .case_box .box_wrapper .title{
  width:30%;
  padding:30px 0px;
  font-size:3vw;
}
#case .wrapper .case_box .box_wrapper .spimage{
  width:100%;
  margin:10px auto;
}
#case .wrapper .case_box .box_wrapper .spimage img{
  width:100%;    
}

#case .wrapper #case_before{
  width:92%;
  margin:0px auto;
  padding-top:50px;
}
#case .wrapper #case_before .before_image{
  height:auto;
  background-image: none;
}
#case .wrapper #case_before .box_wrapper{
  width:100%;  
}
#case .wrapper #case_before .box_wrapper .title{
  float:left;
}
#case .wrapper #case_before .box_wrapper .outline{
  width:65%;
  float:right;
  font-size:3vw;
  padding-left:0px;
}
#case .wrapper #case_before .box_wrapper .outline .outline_title{
  width:auto;
  font-size:3vw;
}
#case .wrapper #case_before .box_wrapper .text{
  padding-top:10px;
  padding-left:0px;
  font-size:3.5vw;
}

#case .wrapper #case_before .box_wrapper .text p{
  display:inline;
}

#case .wrapper #case_presentation{
  width:92%;
  margin:0px auto;
  padding-top:50px;
}
#case .wrapper #case_presentation .box_wrapper{
  width:100%;
}
#case .wrapper #case_presentation .presentation_image{
  width:100%;
  height:auto;
  background-image: none;
  background-repeat: no-repeat;
  background-position: right bottom;
}
#case .wrapper #case_presentation .text{
  padding-top:10px;
  text-align: left;
  font-size:3.5vw;
  line-height:160%;
}
#case .wrapper #case_presentation .image{
  float:left;
}

#case .wrapper #case_after{
  width:92%;
  margin:0px auto;
  padding-top:50px;
}

#case .wrapper #case_after .box_wrapper .title{
  float:left;  
}
#case .wrapper #case_after .box_wrapper .text{
  padding-top:10px;
  padding-left:0px;
  float:none;
  text-align: left;
  font-size:3.5vw;
  line-height:160%;
  clear:both;
}



#contact .wrapper .menu-title{
  font-size: 6vw;
  font-weight:100;
  color:#505050;
  letter-spacing:2px;
}

#contact .wrapper .contact-box{
  width:90%;
  text-align: left;
}
#contact .wrapper .contact-box .title{
  font-size: 4.5vw;  
  line-height:140%;
  padding:0px 0px;
  letter-spacing:0px;
}
#contact .wrapper .contact-box .content{
  font-size: 3vw;  
  line-height:150%;
  font-weight:300;
}
  
  #contact .wrapper .contact-box #contact_01 .contact-box-left{
    width:50%;
    float:left;
  }
  #contact .wrapper .contact-box #contact_01 .contact-box-left .content{
    padding-top:10px;
    padding-bottom:20px;
  }
  #contact .wrapper .contact-box #contact_01 .contact-box-right{
    width:50%;
    float:left;
    
  }
  #contact .wrapper .contact-box #contact_01 .contact-box-right img{
    width:100%;
  }
  
  #contact .wrapper .contact-box #contact_02 .contact-box-left{
    text-align:center;
  }
  #contact .wrapper .contact-box #contact_02 .contact-box-left .title p{
    display:inline;
  }
  #contact .wrapper .contact-box #contact_02 .contact-box-left .content{
    display:none;
  }  

}


/*
**  3 - CSS for Print
*/
@media media print {

}