@charset "UTF-8";
.title{
 background: #ffffff00;
 width: 100%;
}
.title img{
 margin-left: 50px;
 width: 300px;
}
.phone{
 font-size: 20px;
 color: #999999;
 text-decoration: none;
 position: absolute;
 top: 100px;
 left: 50px;
}
@media(min-width: 768px){
 a[href^="tel:"]{
  pointer-events: none;
 }
 .phone{
  font-size: 30px;
 }
 .btn a{
  font-size: 20px;
 }
 .footer p{
  font-size: 15px;
 }
}
.btn {
 border-top: 2px solid #999999;
 border-bottom: 2px solid #999999;
 text-align: center;
}
.btn a{
 text-decoration: none;
}
.button {
 display: inline-block;
 text-align: center;
 cursor: pointer;
 background: #005739;    
 color: #ffffff;
 transition: .3s;
 line-height: 2;
 width: 20%;
}
.button:hover {
 color: #ffffff;
 background: #547443;
}
.active {
 background: #547443;
}
.slider {
 width: 100vw;
 height: 60vh;
 overflow: hidden;
 position: relative;
 max-width: 100%;
}
.slider div {
 position: absolute;
 top: 15px;
 left: 0;
 width: 100%;
 height: 100%;
 background-position: center center;
 background-size: cover;
 background-repeat: no-repeat;
 z-index: 10;
 opacity: 0;
 animation-name: slide-fade;
 animation-duration: 15s;
 animation-iteration-count: infinite;
}
@keyframes slide-fade {
 0%{
  opacity: 0;
 }
 20%{
  opacity: 1;
 }
 80%{
  opacity: 0;
 }
 100%{
 opacity: 0;
 z-index: 0;
 }
}
.slider div:first-of-type{
 background-image: url(http://hummer-y.com/img/jyuki.png);
}
.slider div:nth-of-type(2){
 background-image: url(http://hummer-y.com/img/zousei.png);
 animation-delay: 5s;
}
.slider div:last-of-type{
 background-image: url(http://hummer-y.com/img/gaikou.png);
 animation-delay: 10s;
}

.footer{
 background: #005739;
 width: 100%;
 color: #ffffff;
 text-align: center;
 line-height: 3;
 font-size: 10px;
}

table {
 margin:auto;
 width:70%;
}
.worktop{
 color: #ffffff;
 background-color: #005739;
}
.work {
 width: 50%;
 padding-top: 8px;
padding-left: 10px;
}
.work img {
 width: 100%;
}
.tbl-cp {
 margin:auto;
 width:50%;
}
@media screen and (max-width: 640px) {
 .tbl-cp td {
  display: block;
  width: 100%;
 }
}
/* input非表示 */
        #check_input {
            display: none;
        }

/* ハンバーガーボタン */
        #menu_btn {
            position: fixed;
            top: 80px;
            right: 30px;
            height: 60px;
            width: 60px;
            display: flex;
            justify-content: center;
            align-items: center;
            z-index: 100;
            background-color: #fff;
            cursor: pointer;
        }
       /* 三本線*/
        #menu_btn span,
        #menu_btn span::before,
        #menu_btn span::after {
            content: "";
            display: block;
            position: absolute;
            height: 3px;
            width: 25px;
            border-radius: 3px;
            background-color: #005739;
            transition: all 0.5s cubic-bezier(0.075, 0.82, 0.165, 1);　/*アニメーションのイージングも設定しておく*/
        }
        #menu_btn span::before {
            bottom: 8px;
        }
        #menu_btn span::after {
            top: 8px;
        }

        /* クリックされたら三本線が×に変化する */
        #check_input:checked ~ #menu_btn span {
            background-color: transparent; 
        }
        #check_input:checked ~ #menu_btn span::before {
            bottom: 0;
            transform: rotate(45deg);
        }
        #check_input:checked ~ #menu_btn span::after {
            top: 0;
            transform: rotate(-45deg);
        }

/* ドロワーメニュー */
        #menu_cont {
            position: fixed;
            top: 0;
            left: 100%; /*left 100%で画面の外に出しておく*/
            width: 30%;
            height: 100%;
            background: #fff;
            z-index: 90;
            transition: all 0.5s cubic-bezier(0.075, 0.82, 0.165, 1);
        }

        /* ドロワーメニュー外の背景 */
        #drawer_back {
            display: none;
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: rgba(0, 0, 0, 0.5);
            z-index: 80;
        }

        /* メニューリストの装飾 */
        #menu_cont ul {
            padding: 10% 10% 0
        }
        #menu_cont ul li {
            list-style: none;
        }
        #menu_cont ul li a {
            
            display: block;
            width: 100%;
            padding: 10px;
            margin: 5px;
            margin-top: 50px;
            color:#005739;
            text-decoration: none;
        }
        #menu_cont ul li a:hover {
            opacity: 0.7;
        }

        /* クリックされたらドロワーメニュー表示 */
        #check_input:checked ~ #menu_cont {
            left: 70%;
        }
        #check_input:checked ~ #drawer_back {
            display: block;
        }