@charset "utf-8";
@import url('https://fonts.googleapis.com/css?family=Noto+Sans+JP:300,500&display=swap&subset=japanese');
/**----------------------------------------------------------
 *CSS information 
 *
 * file name	: default.css
 -----------------------------------------------------------*/

/*
base setting
------------------------------*/
html{
 font-family: 'Noto Sans JP', sans-serif;
 font-size: 62.5%;
 font-weight: 300;
 color: #333;
 -webkit-text-size-adjust: 100%;
}
body{
 letter-spacing: 0;
 line-height: 1.4; /* 基本の行間 */
}
h1,h2,h3,h4,h5,h6,b,strong{ font-weight: 500;}
input,textarea,select {
 font-family: 'Noto Sans JP', sans-serif;
	font-size: 100%;
}


/*
link color
------------------------------*/
a{
 outline:none;
 transition: opacity 0.2s, color 0.2s;
}
a:link {
  color: #333;
  text-decoration:none;}
a:visited {
  color: #333;
  }
a:hover,
a:active,
a:focus {
  color: #333;
  text-decoration: underline;}


/*
general class
------------------------------*/
.float-left {float: left;}
.float-right {float: right;}
.clear {
  clear: both;
  float: none;}

.cf:before,
.cf:after {
  content: "";
  display: table;}
.cf:after { clear: both; }
.cf { zoom: 1; } 

.img_center {
 display:block;
 margin:0 auto;} 


/*
common style
header, footer, all wrap ,path
------------------------------*/
html,
body {
  height: 100%;
	 color: #333;}
	
#container {
	 width:100%;
	 margin:0 auto;
	 min-height: 100%;
  height: auto !important;
  height: 100%;
  position: relative;}

.inc_header {
  width:100%;
  height: 113px;
  margin:0 auto;
  position: relative;
}

header {
  position: absolute;
  height:113px;
  background:#fff;
  width:100%;
  margin:0 auto;
  opacity:1;
}

header.hover_header {
  position: fixed;
  top: -113px;
  transition: all .2s;
  transform: translateY(0);
  background-color: white;
  opacity:0;
  z-index: 300;
}

header.hover_header.fixed {
  opacity:1;
  box-shadow: 0px 5px 17px #00000029;
  transform: translateY(113px);
}

#header_inner{
 width:910px;
 margin:0 auto;
 height: 100%;
 display: flex;
 justify-content: space-between;
 align-items: center;
 box-sizing: border-box;
 padding-top: 9px;
}
#logo a{
 display:block;
 background:url(/images/common/logo.gif) no-repeat;
 width:119px;
 height:42px;
 text-indent: 100%;
 white-space: nowrap;
 overflow: hidden;
}


.hover_inquiry {
  position: fixed;
  right: 25px;
  z-index: 1000;
  bottom: -100px;
  transition: all .2s;
  will-change: all;
}

.hover_inquiry.active {
  bottom: 0;
  transform: translate(0px, -25px);
}

.hover_inquiry_box {
  position: relative;
  top: 11px;
  right: 6px;
  background: #2F85DE 0% 0% no-repeat padding-box;
  border: 2px solid #2F85DE;
  border-radius: 10px;
  opacity: 0.7;
  font: normal normal bold 13px/19px Noto Sans JP;
  letter-spacing: 0px;
  color: #FFFFFF;
  transition: opacity .2s;
}
.hover_inquiry_box:hover {
  opacity: 1;
  border: 2px solid #000;
}
.hover_inquiry_item{
  padding: 8px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
}
.hover_inquiry_box .toInquiry {
  padding: 9px 28px 10px;
  background: #FFFFFF 0% 0% no-repeat padding-box;
  border-radius: 29px;
}
.hover_inquiry_box .toInquiry a{
  font: normal normal bold 11px/16px Noto Sans JP;
  color: #2F85DE;
}
.hover_inquiry_box .toInquiry a span{
  font: normal normal bold 18px/26px Noto Sans JP;
  color: #2F85DE;
}
.hover_inquiry_button {
  position: absolute;
  top: 0;
  right: 0;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: #FFFFFF 0% 0% no-repeat padding-box;
  border: 1px solid #2F85DE;
  cursor: pointer;
}

.hover_inquiry_button::before, .hover_inquiry_button::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 2px;
  height: 11px;
  background: #2F85DE;
}
 
.hover_inquiry_button::before {
  transform: translate(-50%,-50%) rotate(45deg);
}
 
.hover_inquiry_button::after {
  transform: translate(-50%,-50%) rotate(-45deg);
}

#contents {
  width:100%;
  min-width:910px;
  margin:0 auto;
	 float: none;
	 clear: both;
  overflow:auto;}
#contents:before,
#contents:after {
   content: "";
   display: table;}
#contents:after { clear: both; }
/* For IE 6/7 (trigger hasLayout) */
#contents { zoom: 1; }

footer{background-color:#DDD;
	}
#gFooter {
 color:#333;
 background-color:#DDD;
 clear: both;
 float: none;
 height: 367px;/*このpxは#contentsのpadding-bottomとつながっています*/
 min-width:910px;
 width: 100%;
 box-sizing: border-box;
 padding-top: 64px;
}
#footer_inner{
 height: 155px;
 width: 910px;
 margin: 0 auto;
 box-sizing: border-box;
 display: flex;
 border-left:1px solid #CCC;
 border-right:1px solid #CCC;
 padding-left:45px;
}
#footer_left{ width: 145px;}
#footer_left a{
 display: block;
 margin-bottom: 15px;
}
#footer_left a:hover{ opacity: 0.7;}
#footer_left p{ font-size: 1rem;}

#footer_right{
 width: 258px;
 border-right: 1px solid #CCC;
}
p.footer_contact{
 font-size: 1.3rem;
 box-sizing: border-box;
 padding-left: 8px;
 margin: 11px 0 12px;
}
p.footer_contact span{
 display: block;
 font-weight: 500;
 font-size: 2rem;
}
       .tel {
         background:url(/images/common/tel.gif) no-repeat 7px 0;
         text-indent:-9999px;
         width:201px;
         height:19px;
         margin-bottom:8px;
        }
        .contact_btn a {
         display:block;
         background:url(/images/common/contact_btn.gif) no-repeat;
         text-indent:-9999px;
         width:215px;
         height:43px;
         }
        .contact_btn a:hover {
          opacity:0.7;
          filter: alpha(opacity=70);}
             
 #gFooter ul{ padding: 25px 0 0 29px;}

     #gFooter ul li{
       list-style:none;
       font-size:1.2rem;
       margin-bottom:5px;}
     #gFooter ul li:before { content:"・ " }
#copyright{
 display:block;
 width: 910px;
 box-sizing: border-box;
 margin: 25px auto 0;
 text-align: right;
 font-size: 1rem;
 padding-right: 20px;
}
.pageTop {
  float: none;
  clear: both;
  text-align: right;}
  
 