@charset "utf-8";





/*boxing*/


#f_view{


  width:100%;


  height:80vh;


}





.inner{


  box-sizing: border-box;


  min-width:320px;


  max-width: 400px;


  margin:0 auto;


}





img{

  width:100%;

}







/*===================================================


=====================================================*/




















/*font*/


body{


  background-color:#f6f4ef;

  font-family: 'Lora', serif;


}


.alp{


  letter-spacing: .2em;


}


section h2{


  height:45px;


  padding:28px 0 18px 0;


  text-align: center;


  font-size: 23px;


  letter-spacing: .3em;


  color:#333;
}


section a{


  font-size: 23px;


}














/*===================================================


=====================================================*/

















/*gnav(hmb)*/


/*　ハンバーガーボタン　*/


.DtgM{


  display: none;


}








.hmb {


  display : block;


  position: fixed;


  z-index : 3;


  left : 20px;


  top   : 20px;


  width : 42px;


  height: 42px;


  cursor: pointer;


  text-align: center;


}


.hmb span {


  display : block;


  position: absolute;


  width   : 35px;


  height  : 3px ;


  left    : 6px;


  background : #222;


  -webkit-transition: 0.3s ease-in-out;


  -moz-transition   : 0.3s ease-in-out;


  transition        : 0.3s ease-in-out;


}


.hmb span:nth-child(1) {


  top: 10px;


}


.hmb span:nth-child(2) {


  top: 25px;


}





/* ナビ開いてる時のボタン */


.hmb.active span:nth-child(1) {


  top : 16px;


  left: 6px;


  background :#888;


  -webkit-transform: rotate(-45deg);


  -moz-transform   : rotate(-45deg);


  transform        : rotate(-45deg);


}





.hmb.active span:nth-child(2) {


  top: 16px;


  background :#888;


  -webkit-transform: rotate(45deg);


  -moz-transform   : rotate(45deg);


  transform        : rotate(45deg);


}





/*nav*/


nav.gMenu {


  position: fixed;


  z-index : 2;


  top  : 0;


  left : 0;


  color: #210B06;


  background: #f6f4ef;


  text-align: center;


  width: 100%;


  height: 80vh;


  opacity: 0;


  visibility: hidden;


  transition: opacity .6s ease, visibility .6s ease;


}





nav.gMenu ul.gM_ul {


  margin: 0 auto;


/*  padding-top: 30px;*/


  width: 100%;


  font-size:20px;


}





nav.gMenu ul.gM_ul li {


  list-style-type: none;


  margin-top: 41px;


  padding: 0;


  width: 100%;


  transition: .4s all;


}


nav.gMenu ul.gM_ul li:last-child {


  margin-bottom: 43px;


}


nav.gMenu ul.gM_ul li a {


  display: block;


  color: #210B06;


  text-decoration :none;


}





/* このクラスを、jQueryで付与・削除する */


nav.gMenu.active {


  visibility: visible;


  opacity: 100;





}





@media screen and (min-width: 490px){


  nav.gMenu {


    width:350px;


    height: 568px;


    margin-top:10px;


    border-radius: 4px;


    position: fixed;


    top  : 0;


    left : 50%;


    transform: translateX(-50%);


    -webkit-transform: translateX(-50%);


    -ms-transform: translateX(-50%);


  }


  nav.gMenu ul.gM_ul {


    padding-top:0;


    margin-top:-10px;


  }


  nav.gMenu ul.gM_ul li{


    margin-top: 50px;


  }


}




















/*===================================================


=====================================================*/























/*header*/


header{


  position: relative;


  overflow:hidden;


}


.who_fstv{


  background:url(../img/who/s_wh008.jpg) no-repeat;


  background-size:cover;

  background-position: -20px -20px;

}




.sho_fstv{

  background:url(../img/sho/sh009.jpg) no-repeat;

  background-size:cover;

  background-position: -20px -20px;

}

.chu_fstv{

  background:url(../img/chu/ch003.jpg) no-repeat;

  background-size:cover;

  background-position: -60px -10px;

}



#h_logo{
  width:130px;
  height:130px;
  border-left:#210B06 1px solid;
  border-bottom:#210B06 1px solid;
  position: absolute;
  top:50%;
  left:50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  background:url(../img/kon_logo2.png) no-repeat;
  background-size:101%;
  background-position: top right;
  opacity:1;
}
  #h_logo h1{
	visibility: hidden;
}













/*===================================================


=====================================================*/




















/*mn_intr*/


.mn_intr{


	width:100%;


	max-width:600px;


	text-align:center;


	padding:20px 35px;


	box-sizing:border-box;


	margin:0 auto;


}


.mn_intr h2{


	height:45px;


	padding: 0 0 60px 0;


	font-size: 27px;


	letter-spacing: .2em;


	line-height:1.2em;


	}


.mn_intr h2 span{


	padding-left:0.3em;


	font-size: 18px;


	letter-spacing: .5em;


}


.mn_intr p{


    font-size: 16px;


    line-height: 1.8em;


    padding-bottom: 30px;


    letter-spacing: .1em;


    }


hr{

	margin:30px 0 40px 0;

}



.mn_intr h2 span#chu_spn{
  line-height: 1.5em;
  padding-bottom: 60px;
  letter-spacing: .3em;
}















/*===================================================


=====================================================*/




















/*item*/



.item{


	width: 100%;


	margin-top: 32px;


}


.itm_img, .sh_hbx{


    width: 85%;


    max-width: 253px;


    height: 160px;


    border-radius: 10px;


    box-sizing: border-box;


    margin: 0 auto;


    overflow: hidden;

    position:relative;
    background-color:#fff;
}
#ch_rgbx div.itm_img{
  height: 190px;
}
#ch_rgbx div.itm_img img{
  position:relative;
  top:0;
  left:0;
}
.itm_img img{
  position:absolute;
  top:-8px;
  left:0;
}
.itm_tx{


	width:100%;


  max-width: 253px;


	box-sizing:border-box;


	font-size:20px;


	margin:0 auto;


	padding: 30px 0 13px 0;


}


.itm_tx h3{


	text-align:center;


	letter-spacing:.1em;


}


.itm_tx p{


	text-align: left;


  display: block;


  margin: 0 auto;


  width: 100%;


  padding: 20px 0 0 5px;


  font-size: 15px;


  line-height: 1.8em;


  letter-spacing: .1em;
}


.ab_clm{

	padding:30px 13px 0 13px;

}

.bl_clm{

	padding:0 13px 13px 13px;

}


















/*grm item*/


.grm_m{


  width:90%;


  border:#fff 2px solid;


  border-radius: 8px;


  margin:0 auto;


  box-sizing: border-box;


  padding-bottom:30px;


  }



.grm_m h2,.reg_m h2{


  line-height:1.3em;


  letter-spacing:.3em;


}





.grm_m h2 span,.reg_m h2 span{


  font-size:14px;


  }


#wh_grm1 .itm_img

{
  height:153px;
}
#wh_grm1 .itm_img img{
  position: absolute;
  top:0;
  left:0;
}
#wh_grm5 .itm_img{
  width:230px;
  height:230px;
}
#wh_grm5 .itm_img img{
  position: absolute;
  top:0;
  left:0;
}
/*reg item*/





.reg_m{


	margin:60px 0;


}


.reg_m h2{


  line-height:1.3em;


  letter-spacing:.2em;


  margin-bottom:45px;


}


.reg_m h2 span{


  padding-top:5px;


}



#wh_reg6 .itm_img{
  height:188px;
}
#wh_reg6 .itm_img img{
  position: absolute;
  top:0;
  left:0;
}
#wh_reg6 .itm_img img{

}


/*short*/

#shMenu .itm_img img{
width:100%;
}
#sh_grm .itm_img,
#sh_reg .itm_img{
width:240px;
height:182px;
}

#sh_grm .itm_img#lng_img1,
#sh_grm .itm_img#lng_img2{
  width:240px;
  height:290px;
}
#sh_grm2 .itm_img{
      position: relative;
}
#sh_grm4 .itm_img{
      position: relative;
}
#sh_grm .sh_hbx{
      height:158px;
}
#sh_grm6 .itm_img{
  width:240px;
  height:233px;
}
#sh_grm8 .itm_img{
  position: relative;
}
#sh_reg8 .itm_img img{
  position: absolute;
  top:-22px;
  left:-17px;
}
#sh_grm2 .itm_img img,
#sh_grm4 .itm_img img,
#sh_reg9 .itm_img img,
#sh_reg10 .itm_img img,
#sh_reg11 .itm_img img,
#sh_reg12 .itm_img img,
#sh_reg13 .itm_img img{
  position: absolute;
  top:0;
  left:0;
}

/*===================================================


=====================================================*/




















/*insite_img*/























/*===================================================


=====================================================*/


























/*infomation*/




















/*===================================================


=====================================================*/























/*recommended*/


/*===================================================


=====================================================*/























/*menu*/


























/*===================================================


=====================================================*/


























/*cutting*/














/*===================================================


=====================================================*/




















/*access*/


#access{


  padding-top:30px;


  border-top: #888 1px solid;


}


#access h2{


  padding-bottom:35px;


}


#shp_inf{


	width:280px;


  padding:25px 20px;


  margin-bottom:30px;


  margin:0 auto;


  border-top:#555 1px solid;


	border-bottom:#555 1px solid;


	box-sizing:border-box;


}


#shp_inf h3{


  font-weight: normal;


	font-size:18px;


	text-align:center;


	margin-bottom:5px;


	letter-spacing:0.2em;


}


#shp_inf dl{


	line-height:1.5em;


	overflow: hidden;


}


#shp_inf dt{


	font-size:13px;


	font-weight:bold;


	margin-top:8px;


	letter-spacing:0.2em;


}


#shp_inf dd{


	margin-top:2px;


	font-size:13px;


	padding-left:45px;


}


#shp_inf #tel{


	float:left;


	margin-top:10px;


}


#shp_inf #tel+dd{


	margin:12px 0;


}


#o_img_box{


  padding-top:50px;


}


#out_img{


	border:#555 1px solid;


	width:260px;


	height:174px;


  margin-top:50px;


  margin: 0 auto;


}


/*===================================================


=====================================================*/

















/*g_map*/


#map_bx{


	width:100%;


}





.g_map {


	margin:70px 0 40px 0;


	position: relative;


	padding-bottom: 250px; /*高さは250pxで固定*/


	height: 0;


	overflow: hidden;


	max-width:460px;


	border:#555 1px solid;


	box-sizing:border-box;


}





.g_map iframe {


	position: absolute;


	top: 0;


	left: 0;


	width: 100%;


	height: 100%;


}














/*===================================================


=====================================================*/









































/*===================================================


=====================================================*/


/*footer*/


footer{


  height:50px;


  margin-top:20px;


}





#c_box{


	width:320px;


	height:100%;


	margin:0 auto;


	box-sizing:border-box;


}


#c_box p{


	width:100%;


	text-align:center;


  color:#473631;


  line-height:50px;


}