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


/*
**  1 - General
*/

#catch {
  width: 100%;
  min-width:1280px;
  padding:80px 0px 0px 0px;
  background:#000000;
}
#catch .wrapper{
  width: 1280px;
  margin:0px auto;
  position:relative;
}
#catch .wrapper .top_slider_pc{
  height:800px;
}
#catch .wrapper .top_slider_pc .layerd{
  position:absolute;
  top:0;
  left:0;
  display:none;
}


#philosophy {
  width: 100%;
  min-width:1280px;
  padding:0px 0px;
  background:#232323;
  background-image: url("../../images/philosophy_bg.png");
  color:white;
}
#philosophy .wrapper{
  width: 100%;
  height:auto;
  margin:0px auto;
  background-image: url("../../images/philosophy_bg_layerd.png");
}
#philosophy .wrapper .menu-title{
  width:850px;
  margin:50px auto;
}
#philosophy .wrapper .content{
  width:850px;
  margin:50px auto;
}

#points {
  width: 100%;
  min-width:1280px;
  height:560px;
  padding:0px 0px;
  background:#232323;
  color:white;
}
#points .wrapper{
  width: 1280px;
  margin:0px auto;
}
#points .wrapper .menu-title{
  width: auto;
  margin:60px auto 40px auto;
  text-align:center;
}
#points .wrapper .menu-title img{

}
#points .wrapper .points_buttons{
  width:1050px;
  height:310px;
  margin:0px auto;
}
#points .wrapper .points_buttons div{
  padding:0px 20px;
  float:left;
}
#points .wrapper .points_buttons img:hover{
  cursor:pointer;
  filter:alpha(opacity=70);
  opacity:0.7;
}


.points_clone {
  width: 100%;
  min-width:1280px;
  height:165px;
  padding:20px 0px 0px 0px;
  background:#232323;
  color:white;
}
.points_clone .wrapper{
  width: 1280px;
  margin:0px auto;
  font-size:2em;
}
.points_clone .wrapper .points_buttons{
  width:1050px;
  height:145px;
  margin:0px auto;
}
.points_clone .wrapper .points_buttons div{
  padding:0px 20px;
  float:left;
}
.points_clone .wrapper .points_buttons img:hover{
  cursor:pointer;
  filter:alpha(opacity=70);
  opacity:0.7;
}


#points_menu {
  width: 100%;
  min-width:1280px;
  padding:0px 0px 0px 0px;
  background:#000000;
  color:white;
  border-bottom:1px solid #232323;
}
#points_menu .wrapper{
  width: 1280px;
  margin:0px auto;
}
#points_menu .wrapper .title{
  margin:60px auto 10px auto;
}
#points_menu .wrapper .points_box{
	display:none;
}

#points_menu .wrapper .subtitle{
  margin:0px auto 0px auto;
  padding:10px 0px 20px 0px;
  width:770px;
  border-top:1px solid white;
}
#points_menu .wrapper .text{
  margin:0px auto 60px auto;
}
#points_menu .wrapper #points_menu_01 .text{
  width:900px;
}
#points_menu .wrapper #points_menu_02 .text{
  width:830px;
}
#points_menu .wrapper #points_menu_03 .text{
  width:915px;
}
#points_menu .wrapper .photo{
  margin:0px auto 0px auto;
  padding:10px 0px 100px 0px;
  width:960px;
}


#case {
  width: 100%;
  min-width:1280px;
  padding:80px 0px 150px 0px;
  background:#000000;
  color:white;
}
#case .wrapper{
  width: 1280px;
  margin:0px auto;
}
#case .wrapper .menu-title{
  margin:0px auto;
}
#case .wrapper .menu-title img{

}
#case .wrapper .case_box{
   margin:60px 0px 0px 0px;  
}
#case .wrapper .case_box .slider {
    width:1280px;
    display:block;
    margin:30px auto 0px auto;
}
#case .wrapper .case_box .slider ul.case_slider li {/*メインスライダー*/
    display:block;
    width:1280px;
    height:714px;
}
#case .wrapper .case_box .slider ul.case_slider li img{
    display:block;
    width:1280px;
    height:auto;
}
#case .wrapper .case_box .slider ul.case_slider_pager li a {/*サムネイル*/
    display:block;
    width:150px;
    height:168px;
}
#case .wrapper .case_box .slider ul.case_slider_pager li a img{/*サムネイルの画像*/
    display:block;
    width:150px;
    height:auto;
}
#case .wrapper .case_box .slider div.controlWrap {
    width:1280px;
    display:block;
    position:relative;
    margin:20px auto;
}
#case .wrapper .case_box .slider div.controlWrap p#PrevIcon a{/*矢印画像（前へ）*/
    display:block;
    width:32px;
    height:59px;
    position:absolute;
    background: url(../../images/_prev.png) left center no-repeat;
    color:#fff;
    top:60px;
    left:20px;
    text-indent:-9999px;
}
#case .wrapper .case_box .slider div.controlWrap p#NextIcon a{/*矢印画像（次へ）*/
    display:block;
    width:32px;
    height:59px;
    position:absolute;
    background: url(../../images/_next.png) left center no-repeat;
    color:#fff;
    top:60px;
    right:20px;
    text-indent:-9999px;
}


#contact {
  width: 100%;
  min-width:1280px;
  padding:40px 0px;
  background:#f0f0f0;
  color:black;
}
#contact .wrapper{
  width: 1280px;
  margin:0px auto;
}
#contact .wrapper .menu-title{
  width:340px;
  font-size:1.75em;
  font-weight:bold;
  margin:20px auto 0px auto;
}
#contact .wrapper .menu-title img{
}
#contact .wrapper .contact-box{
  width:1200px;
  font-size:1.75em;
  font-weight:bold;
  padding:40px 0;
  margin:40px auto;
  border-bottom:2px dotted #909090;
}
#contact .wrapper .button img:hover{
  filter:alpha(opacity=70);
  opacity:0.7;
}
#contact .wrapper #contact_01{
  width:640px;
  margin:0px auto;
}
#contact .wrapper #contact_01 .button{
  padding:9px 0px 0px 0px;
}

#contact .wrapper #contact_02{
  width:920px;
  margin:0px auto;
}
#contact .wrapper #contact_02 .button{
  padding:45px 0px 0px 0px;
}
#contact .wrapper .contact-box .contact-box-left{
  float:left;
}
#contact .wrapper .contact-box .contact-box-right{
  float:right;
}

#contact .wrapper .contact-tel{
  width:540px;
  font-size:1.75em;
  font-weight:bold;
  margin:0px auto;
}


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


#catch {
  width: 100%;
  min-width:auto;
  padding:21% 0px 0px 0px;
  background:#000000;
}
#catch .wrapper{
  width: 100%;
  margin:0px auto;
  position:relative;
}
#catch .wrapper .top_image{
  width: 100%;
}
#catch .wrapper .top_image img{
  width: 100%;
}

#philosophy {
  width: 100%;
  min-width:auto;
  padding:0px 0px;
}
#philosophy .wrapper{
  width: 100%;
  height:auto;
  margin:0px auto;
  background-image:none;
}
#philosophy .wrapper .menu-title{
  width: 100%;
  text-align:center;
  font-size:1.75em;
  font-weight:bold;
  margin:50px auto;
}
#philosophy .wrapper .menu-title img{
	width:80%;
}
#philosophy .wrapper .content{
  width: 100%;
  margin:50px auto;
}
#philosophy .wrapper .content img{
	width:100%;
}


#points {
  width: 100%;
  min-width:auto;
  height:auto;
  padding:0px 0px 30px 0px;
}
#points .wrapper{
  width: 100%;
  height:auto;
  margin:0px auto;
}
#points .wrapper .menu-title{
  width: 100%;
  margin:60px auto 40px auto;
  text-align:center;
}
#points .wrapper .menu-title img{
  width: 100%;
}
#points .wrapper .points_buttons{
  width: 100%;
  height:auto;
  margin:0px auto;
}
#points .wrapper .points_buttons div{
  width: 30%;
  padding:0px 1.6%;
  float:left;
}
#points .wrapper .points_buttons div img{
  width: 100%;
}


.points_clone {
  width: 100%;
  min-width:auto;
  height:auto;
  padding:20px 0px 15px 0px;
}
.points_clone .wrapper{
  width: 100%;
  height:auto;
  margin:0px auto;
}
.points_clone .wrapper .points_buttons{
  width: 100%;
  height:auto;
  margin:0px auto;
}
.points_clone .wrapper .points_buttons div{
  width: 30%;
  padding:0px 1.6%;
  float:left;
}
.points_clone .wrapper .points_buttons div img{
  width: 100%;
}



#points_menu {
  width: 100%;
  min-width:auto;
  padding:0px 0px 0px 0px;
}
#points_menu .wrapper{
  width: 100%;
  margin:0px auto;
}
#points_menu .wrapper .title{
  margin:60px auto 10px auto;
}
#points_menu .wrapper .points_box{
	display:block;
}
#points_menu .wrapper #points_menu_01 .title{
}
#points_menu .wrapper #points_menu_02 .title{
}
#points_menu .wrapper #points_menu_03 .title{
}
#points_menu .wrapper .subtitle{
  margin:0px auto 0px auto;
  padding:10px 0px 20px 0px;
  width: 100%;
  border-top:1px solid #aaa;
  text-align:center;
}
#points_menu .wrapper .subtitle img{
	width:auto;
  max-width:100%;
}
#points_menu .wrapper .text{
  text-align:center;
  margin:0px auto 60px auto;
}
#points_menu .wrapper #points_menu_01 .text{
  max-width:90%;
}
#points_menu .wrapper #points_menu_01 .text img{
	width:auto;
  max-width:100%;
}
#points_menu .wrapper #points_menu_02 .text{
  max-width:90%;
}
#points_menu .wrapper #points_menu_02 .text img{
	width:auto;
  max-width:100%;
}
#points_menu .wrapper #points_menu_03 .text{
  max-width:90%;
}
#points_menu .wrapper #points_menu_03 .text img{
	width:auto;
  max-width:100%;
}
#points_menu .wrapper .photo{
  margin:0px auto 0px auto;
  padding:10px 0px 100px 0px;
  width:100%;
}
#points_menu .wrapper .photo img{
  width:100%;
}


#case {
  width: 100%;
  min-width:auto;
  padding:80px 0px 80px 0px;
}
#case .wrapper{
  width: 100%;
  margin:0px auto;
}
#case .wrapper .menu-title{
  width: 100%;
  margin:0px auto;
}
#case .wrapper .menu-title img{
  width: 100%;
}
#case .wrapper .case_box{
  width: 100%;
  margin:60px 0px 0px 0px;  
}
#case .wrapper .case_box .image{
  width: 100%;
}
#case .wrapper .case_box .image img{
  width: 100%;
}
#case .wrapper .case_box .slider {
  width: 100%;
    display:block;
    margin:30px auto 0px auto;
}
#case .wrapper .case_box .slider ul.case_slider li {/*メインスライダー*/
    display:block;
  width: 100%;
    height:auto;
}
#case .wrapper .case_box .slider ul.case_slider li img{
    display:block;
  width: 100%;
    height:auto;
}
#case .wrapper .case_box .slider ul.case_slider_pager li a {/*サムネイル*/
    display:block;
  width: 100%;
    height:auto;
}
#case .wrapper .case_box .slider ul.case_slider_pager li a img{/*サムネイルの画像*/
    display:block;
  width: 100%;
    height:auto;
}
#case .wrapper .case_box .slider div.controlWrap {
  width: 100%;
    display:block;
    position:relative;
    margin:10px auto;
}
#case .wrapper .case_box .slider div.controlWrap p#PrevIcon a{/*矢印画像（前へ）*/
    display:block;
    width:10%;
    height:auto;
    position:absolute;
    background: url(../../images/_prev.png) left center no-repeat;
    color:#fff;
    top:10px;
    left:20px;
    text-indent:-9999px;
}
#case .wrapper .case_box .slider div.controlWrap p#NextIcon a{/*矢印画像（次へ）*/
    display:block;
    width:10%;
    height:auto;
    position:absolute;
    background: url(../../images/_next.png) left center no-repeat;
    color:#fff;
    top:10px;
    right:20px;
    text-indent:-9999px;
}

#contact {
  width: 100%;
  min-width:auto;
  padding:40px 0px;
}
#contact .wrapper{
  width: 100%;
  margin:0px auto;
}
#contact .wrapper .menu-title{
  width: 100%;
  margin:0px auto 0px auto;
  text-align:center;
}
#contact .wrapper .menu-title img{
  width: 40%;
}
#contact .wrapper .contact-box{
  width: 100%;
  font-size:1.75em;
  font-weight:bold;
  padding:20px 0;
  margin:40px auto;
  border-bottom:2px dotted #909090;
}
#contact .wrapper #contact_01{
  width: 100%;
  margin:0px auto;
}
#contact .wrapper #contact_01 .button{
  padding:9px 0px 0px 0px;
}

#contact .wrapper #contact_02{
  width: 100%;
  margin:0px auto;
}
#contact .wrapper #contact_02 .button{
  padding:25px 0px 0px 0px;
}
#contact .wrapper .contact-box .contact-box-left{
  float:none;
}
#contact .wrapper .contact-box .contact-box-left img{
  width: 100%;
}
#contact .wrapper .contact-box .contact-box-right{
  float:none;
}
#contact .wrapper .contact-box .contact-box-right img{
  width: 100%;
}
#contact .wrapper .contact-box .contact-box-center{
  float:none;
  margin:0px auto;
  text-align:center;
}
#contact .wrapper .contact-box .contact-box-center img{
  width: 70%;
}
  
#contact .wrapper .contact-tel{
  width: 100%;
  margin:0px auto;
}
#contact .wrapper .contact-tel img{
  width: 100%;
}

}


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

}