@charset "UTF-8";
/* 基本設定： ページ全体 */
*{
   margin: 0;
   padding: 0;
}
BODY{
   font-size : 16px;
   color : #2a2a2a;
   font-family: 'メイリオ' ,Meiryo, 'ヒラギノ角ゴ Pro W3' , 'Hiragino Kaku Gothic Pro' , 'ＭＳ Ｐゴシック' , 'Osaka' ,sans-serif;
}
IMG{
   border-style:none;
}
A IMG{
   border-style:none;
}
*, *::before, *::after{
   -webkit-box-sizing: border-box;
   -moz-box-sizing: border-box;
   -o-box-sizing: border-box;
   -ms-box-sizing: border-box;
   box-sizing: border-box;
}
/* 汎用クラス */
.hide{
   display: none;
}
/* スマホ時改行 <BR class="br-sp"> */
.br-sp{
   display:block;
}
/* PC時改行 <BR class="br-sp"> */
.br-sp2{
   display:none;
}
/*===============================================
● モバイルファースト用（スマホ）
===============================================*/
/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝　ヘッダーメニュー　＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */
HEADER{
   background-color : rgba(255, 255, 255, 0.85);
   width : 100%;
   position : absolute;
   top : 0px;
   left : 0px;
   z-index: 100;
}
.head_rogo{
   line-height : 70px;
   background-color : #87bf28;
   padding-left : 20px;
   padding-right : 20px;
   display : inline-block;
   color : white;
   text-decoration : none;
   font-size : 6vw;
}
.head_menu UL{
   list-style: none;
}
.head_menu A{
   display: block;
   padding : 15px;
   color : black;
   font-size: 1em;
   text-decoration: none;
}
.head_menu A:hover{
   background-color : rgba(111, 156, 33, 0.7);
   color : white;
}
/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝　トップイメージ　＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */
.top-img{
   background-position: center;
   background-size: cover;
   height : 300px;
   -js-display: flex;
   display: -ms-flexbox;
   display: -webkit-box;
   display: -webkit-flex;
   display: flex;
   -ms-flex-align: center;
   -webkit-box-align: center;
   -webkit-align-items: center;
   align-items: center;
   -ms-flex-pack: center;
   -webkit-box-pack: center;
   -webkit-justify-content: center;
   justify-content: center;
}
.top-img H2{
   font-size : 1.7em;
   text-align : center;
   text-shadow: 1px 1px 2px #696969;
   color : white;
}
/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝　アクセス　＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */
.access{
   margin-bottom : 20px;
}
.access .text{
   padding : 20px 15px 50px;
}
.access H3{
   margin-bottom : 10px;
   font-size : 7.6vw;
}
.access H3 A{
   font-size : 7.6vw;
}
/* メールフォームへボタン */
.access H4 A{
   font-size : 1em;
   color : white;
   background-color : #87bf28;
   text-decoration : none;
   padding-top : 15px;
   padding-left : 25px;
   padding-right : 25px;
   padding-bottom : 15px;
   display : inline-block;
}
.access A:hover{
   background-image: linear-gradient(
		rgba(255,255,255,0.2),
		rgba(255,255,255,0.2)
	);
}
.access P{
   font-size: 1em;
   line-height: 1.8;
   text-align : left;
}
.access .map{
   height: auto;
}
.map .ggmap{
   position: relative;
   padding-bottom: 56.25%;
   padding-top: 30px;
   height: 0;
   overflow: hidden;
}
.ggmap IFRAME,
.ggmap OBJECT,
.ggmap EMBED{
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
}
.access .detail{
   line-height : 1.8em;
   margin-bottom : 5px;
}
.access .detail .large{
   font-size : 1.2em;
   font-weight : bold;
   padding-bottom : 15px;
}
.detail::after{
   content: "";
   clear: both;
   display: block;
}
.access .detail DT{
   float : left;
   clear : left;
   width : 95px;
}
.access .detail DD{
   float : left;
}
/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝　フッター用（全共通）　＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */
FOOTER{
   width: 100%;
   padding: 15px 20px;
   background: #000;
}
FOOTER .container{
   max-width : 1200px;
   margin-left : auto;
   margin-right : auto;
}
FOOTER UL{
   width: 100%;
   margin-bottom : 10px;
   list-style-type: none;
}
FOOTER LI{
   width: 50%;
   float: left;
}@media screen and (min-width:768px) {
   FOOTER UL{
   max-width : 700px;
}
FOOTER LI{
   width: 33.33%;
}}
FOOTER LI A{
   display: block;
   color : white;
   font-size : 0.9em;
   line-height: 45px;
   text-decoration: none;
   padding-left:20px;
}
@media screen and (min-width:768px) {
   FOOTER LI A{
   line-height : 20px;
   padding-right : 10px;
   padding-top : 5px;
   padding-bottom : 5px;
}}
FOOTER LI A:hover{
   background: #C30;
}
FOOTER UL::after{
   display: table;
   content: "";
   clear: both;
}
#copyright{
   text-align: right;
   color : white;
   font-size : 0.85em;
   border-top-width : 1px;
   border-top-style : solid;
   border-top-color : white;
   padding-top : 8px;
}@media screen and (min-width:600px) {
   #copyright BR{
   display: none;
}}@media screen and (max-width:360px) {
   #copyright{
   font-size : 0.7em;
}
FOOTER LI A{
   font-size : 0.8em;
   padding-left: 5px;
}}
/*===============================================
● 360px以下　iPhone 5 / Galaxy S5 用
===============================================*/
@media screen and (max-width: 360px) {
/* アクセス */
.access H3{
   font-size : 5vh;
}
.access H3{
   font-size : 7.8vw;
}
.access H4 A{
   font-size : 2.8vh;
   padding-top : 10px;
   padding-left : 10px;
   padding-right : 10px;
   padding-bottom : 10px;
}
}
/*===============================================
● 415px以下　iPhone 6-8 Plus / Nexus6 用
===============================================*/
@media screen and (min-width: 400px) and (max-device-width: 415px)  {
/* アクセス */
.access H3{
   font-size : 6.9vw;
}
.access H3 A{
   font-size : 6.9vw;
}
}
/*==================================================
● 画面の横幅が500px以上767px以下（Nexus7用）
==================================================*/
@media screen and (min-width: 500px) and (max-device-width: 767px) {
/* アクセス */
.access H3{
   font-size : 4.7vw;
}
.access H3 A{
   font-size : 4.7vw;
}
}
/*===============================================
● 767px以下　スマホ（トグルボタン）
===============================================*/
@media screen and (max-width: 767px) {header .container-small {
   -js-display: flex;
   display: -ms-flexbox;
   display: -webkit-box;
   display: -webkit-flex;
   display: flex;
   -ms-flex-align: center;
   -webkit-box-align: center;
   -webkit-align-items: center;
   align-items: center;
   -ms-flex-pack: justify;
   -webkit-box-pack: justify;
   -webkit-justify-content: space-between;
   justify-content: space-between;
}
.toggle{
   margin-right: 25px;
   padding: 0;
   border: none;
   outline: none;
   background: none;
   font-size: 30px;
   opacity: 0.9;
   cursor: pointer;
color:#000;
}
.head_menu{
   display: none;
}
HEADER{
   background-color : rgba(255, 255, 255, 0.95);
}}
/*===============================================
● ● 画面の横幅が768px以上: タブレットとPC用
===============================================*/
@media screen and (min-width:768px){
   .br-sp{
   display:none;
}
   .br-sp2{
   display:block;
}
  a[href^="tel:"]{
    pointer-events: none;
    text-decoration: none;
    color:#2a2a2a;
  }
/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝　タブレットとPC　ヘッダーメニュー　＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */
.head_rogo{
   font-size : 24px;
}HEADER .container{
   -js-display: flex;
   display: -ms-flexbox;
   display: -webkit-box;
   display: -webkit-flex;
   display: flex;
   -ms-flex-align: center;
   -webkit-box-align: center;
   -webkit-align-items: center;
   align-items: center;
   -ms-flex-pack: justify;
   -webkit-box-pack: justify;
   -webkit-justify-content: space-between;
   justify-content: space-between;
}.head_menu UL{
   -js-display: flex;
   display: -ms-flexbox;
   display: -webkit-box;
   display: -webkit-flex;
   display: flex;
}
.head_menu{
   display: block !important;
}
.toggle{
   display: none;
}
/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝　タブレットとPC　トップイメージ　＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */
.top-img{
   background-image : url(../others/webTOP.jpg);
   height : 400px;
}
.top-img H2{
   font-size : 2.5em;
}
/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝　タブレットとPC　アクセス　＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */
.access .container{
   -js-display: flex;
   display: -ms-flexbox;
   display: -webkit-box;
   display: -webkit-flex;
   display: flex;
   max-width: 1200px;
   margin-left: auto;
   margin-right: auto;
      border-top-style : solid;
      border-top-color : #6f9d20;
   
      padding-top : 15px;
      border-top-width : 1px;
   }
.access .map{
   -ms-flex: 1 1 50%;
   -webkit-box-flex: 1 1 50%;
   -webkit-flex: 1 1 50%;
   flex: 1 1 50%;
   max-width: 50%;
}
.access .text{
   -ms-flex: 1 1 50%;
   -webkit-box-flex: 1 1 50%;
   -webkit-flex: 1 1 50%;
   flex: 1 1 50%;
   max-width: 50%;
   padding : 20px 5px 0px 40px;
}
.access H3{
   font-size : 28px;
}
.access H3 A{
   font-size : 28px;
}
}
/*==================================================
● 画面の横幅が768px以上1090px以下（タブレット専門）
==================================================*/
@media screen and (min-width: 768px) and (max-device-width: 1090px) {
   /* ヘッダーメニュー */
.head_rogo{
   font-size : 21px;
}
.head_menu A{
   padding : 15px 7px;
   font-size: 13px;
}
}
/*==================================================
● 画面の横幅が1024px以上1090px以下（i-Pad pro用）
==================================================*/
@media screen and (min-width: 1024px) and (max-device-width: 1090px) {
/* アクセス */
.access H3{
   font-size : 2.8vw;
}
.access H3 A{
   font-size : 2.8vw;
}
}