.img_effect{
    width:720px;
    height:400px;
    border:3px solid #000000;
    position:relative;
    overflow:hidden;
    animation:bg_color 24s infinite;
    margin-bottom:50px;
   }
   
   .img01{
    width:720px;
    height:700px;
    position:absolute;
    top:-300px;
    left:0;
    animation:img01_a 24s infinite;
    /*-webkit-animation:img01_a 16s infinite;*/	
   }
   
   .img02{
    width:720px;
    height:868px;
    position:absolute;
    top:0;
    left:0;
    animation:img02_a 24s infinite;
    /*-webkit-animation:img02_a 16s infinite;*/	
   }
   
   .img03{
    width:1017px;
    height:400px;
    position:absolute;
    top:0;
    left:-297px;
    animation:img03_a 24s infinite;
    /*-webkit-animation:img03_a 16s infinite;*/	
   }
   
   .img04{
    width:450px;
    height:60px;
    position:absolute;
    top:45px;
    left:135px;
    animation:img04_a 24s infinite;
    /*-webkit-animation:img04_a 16s infinite;*/	
   }
   
   .img05{
    width:536px;
    height:93px;
    position:absolute;
    top:163px;
    left:92px;
    animation:img05_a 24s infinite;
    /*-webkit-animation:img05_a 16s infinite;*/	
   }
   
   .img06{
    width:200px;
    height:45px;
    position:absolute;
    top:310px;
    left:260px;
    animation:img06_a 24s infinite;
    /*-webkit-animation:img06_a 16s infinite;*/
    /*animation-name:img06_a;
    animation-duration: 16s;
    animation-iteration-count:infinite;*/	
   }
   
   @keyframes img01_a{
    0%{opacity:0;}
    7%{opacity:1;}
    20%{opacity:1;}
    25%{opacity:0;transform:translateY(200px);}
    100%{opacity:0;transform:translateY(200px);}
   }
   
   @keyframes img02_a{
    0%{opacity:0;}
    25%{opacity:0;transform:translateY(0);}
    32%{opacity:1;}
    45%{opacity:1;}
    50%{opacity:0;transform:translateY(-150px);}
    100%{opacity:0;transform:translateY(-150px);}
   }
   
   @keyframes img03_a{
    0%{opacity:0;}
    50%{opacity:0;transform:translateX(0);}
    57%{opacity:1;}
    70%{opacity:1;}
    75%{opacity:0;transform:translatexX(297px);}
    100%{opacity:0;transform:translateX(297px);}
   }
   
   @keyframes img04_a{
    0%{opacity:0;}
    77%{opacity:0;}
    78%{opacity:1;}
    93%{opacity:1;}
    96%{opacity:0;}
    100%{opacity:0;}
   }
   
   @keyframes img05_a{
    0%{opacity:0;}
    80%{opacity:0;}
    90%{opacity:1;}
    93%{opacity:1;}
    96%{opacity:0;}
    100%{opacity:0;}
   }
   
   @keyframes img06_a{
    0%{opacity:0;}
    80%{opacity:0;}
    90%{opacity:1;}
    93%{opacity:1;}
    96%{opacity:0;}
    100%{opacity:0;}
   }
   
   @keyframes bg_color{
    0%{background-color:#000000;}
    69%{background-color:#000000;}
    70%{background-color:#f8f8f8;}
    97%{background-color:#f8f8f8;}
    100%{background-color:#000000;}
   }
   
  
   
   .con_daimei{
    width:720px;
    font-size:26px;
    color:#ffffff;
    font-weight:bold;
    line-height:220%;
    border-top:2px solid #000000;
    border-bottom:2px solid #000000;
    background:linear-gradient(to left, #ffffff, #999999 15%, #999999 85%, #ffffff);
    text-shadow:2px 2px 1px #000000;
   }
   
   .con_setsumei{
    width:720px;
    font-size:20px;
    font-family:serif;
    font-weight:bold;
    line-height:130%;
    padding:30px 0;
    background:linear-gradient(to left, #ffffff, #eeeeee 10%, #eeeeee 90%, #ffffff);
   }
   
  
   /*クラフツマンデッキシンク*/
   
   .effect_k{
    width:720px;
    height:405px;
    border:3px solid #000000;
    position:relative;
    overflow:hidden;
    margin-bottom:50px;
   }
   
   .img_k01{
    width:720px;
    height:943px;
    position:absolute;
    top:-500px;
    left:0;
    animation:img_k01_a 12s infinite;
   }
   
   .img_k02{
    width:600px;
    /*height:288px;*/
    position:absolute;
    top:10px;
    left:10px;
    animation:img_k02_a 12s infinite;
   }
   
   .img_k03{
    width:600px;
    /*height:385px;*/
    position:absolute;
    top:10px;
    left:10px;
    animation:img_k03_a 12s infinite;
   }
   
   .img_k04{
    width:600px;
    /*height:385px;*/
    position:absolute;
    top:10px;
    left:10px;
    animation:img_k04_a 12s infinite;
   }
   
   @keyframes img_k01_a{
    0%{opacity:0.6;}
    98%{opacity:0.6;}
    100%{opacity:0;transform:translateY(500px);}
   }
   
   @keyframes img_k02_a{
    0%{opacity:0;}
    10%{opacity:0;}
    18%{opacity:1;}
    43%{opacity:1;}
    44%{opacity:0;}
    100%{opacity:0}
   }
   
   @keyframes img_k03_a{
    0%{opacity:0;}
    35%{opacity:0;}
    43%{opacity:1;}
    68%{opacity:1;}
    69%{opacity:0;}
    100%{opacity:0}
   }
   
   @keyframes img_k04_a{
    0%{opacity:0;}
    60%{opacity:0;}
    68%{opacity:1;}
    82%{opacity:1;}
    90%{opacity:0;}
    100%{opacity:0}
   }
   
   /*センターポジション設計*/
   
   .effect_c{
    width:720px;
    height:325px;
    border:3px solid #000000;
    position:relative;
    overflow:hidden;
    margin-bottom:50px;
   }
   
   .img_c01{
    width:720px;
    height:325px;
    position:absolute;
    top:0;
    left:0;
    animation:img_c01_a 12s infinite;
   }
   
   .img_c02{
    width:277px;
    height:250px;
    position:absolute;
    top:37px;
    left:221px;
    animation:img_c02_a 12s infinite;
   }
   
   .img_c03{
    width:277px;
    height:250px;
    position:absolute;
    top:37px;
    left:221px;
    animation:img_c03_a 12s infinite;
   }
   
   .img_c04{
    width:284px;
    height:200px;
    position:absolute;
    top:62px;
    left:218px;
    animation:img_c04_a 12s infinite;
   }
   
   .img_c05{
    width:273px;
    height:200px;
    position:absolute;
    top:62px;
    left:223px;
    animation:img_c05_a 12s infinite;
   }
   
   @keyframes img_c01_a{
    0%{opacity:1;}
    100%{opacity:1;}
   }
   
   @keyframes img_c02_a{
    0%{opacity:0;transform:translateX(0);}
    10%{opacity:0;transform:translateX(0);}
    25%{opacity:1;}
    30%{opacity:1;transform:translateX(-200px);}
    31%{opacity:0;transform:translateX(-200px);}
    100%{opacity:0;}
   }
   
   @keyframes img_c03_a{
    0%{opacity:0;transform:translateX(0);}
    30%{opacity:0;transform:translateX(0);}
    45%{opacity:1;}
    50%{opacity:1;transform:translateX(200px);}
    51%{opacity:0;transform:translateX(200px);}
    100%{opacity:0;}
   }
   
   @keyframes img_c04_a{
    0%{opacity:0;transform:translateX(0);}
    50%{opacity:0;transform:translateX(0);}
    65%{opacity:1;}
    70%{opacity:1;transform:translateX(-200px);}
    71%{opacity:0;transform:translateX(-200px);}
    100%{opacity:0;}
   }
   
   @keyframes img_c05_a{
    0%{opacity:0;transform:translateX(0);}
    70%{opacity:0;transform:translateX(0);}
    85%{opacity:1;}
    90%{opacity:1;transform:translateX(200px);}
    91%{opacity:0;transform:translateX(200px);}
    100%{opacity:0;}
   }
   
   /*ハイブリッドコンロ*/
   
   .effect_h{
    width:720px;
    height:280px;
    border:3px solid #000000;
    position:relative;
    overflow:hidden;
    margin-bottom:50px;
   }
   
   .img_h01{
    width:720px;
    height:280px;
    position:absolute;
    top:0;
    left:0;
    animation:img_h01_a 10s linear infinite;
   }
   
   .img_h02{
    width:720px;
    height:280px;
    position:absolute;
    top:0;
    left:0;
    animation:img_h02_a 10s linear infinite;
   }
   
   .img_h03{
    width:720px;
    height:280px;
    position:absolute;
    top:0;
    left:0;
    animation:img_h03_a 10s linear infinite;
   }
   
   @keyframes img_h01_a{
    0%{opacity:1;transform:translateX(0);}
    20%{opacity:1;transform:translateX(0);}
    50%{opacity:1;transform:translateX(-100%);}
    51%{opacity:0;transform:translateX(-100%);}
    98%{opacity:0;}
    99%{opacity:1;}
    100%{opacity:1;}
   }
   
   @keyframes img_h02_a{
    0%{opacity:0;transform:translateX(100%);}
    20%{opacity:1;transform:translateX(100%);}
    50%{opacity:1;transform:translateX(0);}
    70%{opacity:1;transform:translateX(0);}
    100%{opacity:1;transform:translateX(-100%);}
   }
   
   @keyframes img_h03_a{
    0%{opacity:0;transform:translateX(100%);}
    70%{opacity:1;transform:translateX(100%);}
    100%{opacity:1;transform:translateX(0);}
   }
   
   /*空間プラン*/
   
   .effect_p{
    width:720px;
    height:356px;
    border:3px solid #000000;
    position:relative;
    overflow:hidden;
   }
   
   .effect_p a{
     display:block;
     position: absolute;
     top:0;
     left:0;
     height:100%;
     width:100%;
     text-indent: -999px;
   }
   
   .img_p01{
    width:720px;
    height:356px;
    position:absolute;
    top:0;
    left:0;
    animation:img_p01_a 24s infinite;
   }
   
   .img_p02{
    width:720px;
    height:356px;
    position:absolute;
    top:0;
    left:0;
    animation:img_p02_a 24s infinite;
   }
   
   .img_p03{
    width:720px;
    height:356px;
    position:absolute;
    top:0;
    left:0;
    animation:img_p03_a 24s infinite;
   }
   
   .img_p04{
    width:720px;
    height:356px;
    position:absolute;
    top:0;
    left:0;
    animation:img_p04_a 24s infinite;
   }
   
   .img_p05{
    width:720px;
    height:356px;
    position:absolute;
    top:0;
    left:0;
    animation:img_p05_a 24s infinite;
   }
   
   .img_p06{
    width:720px;
    height:356px;
    position:absolute;
    top:0;
    left:0;
    animation:img_p06_a 24s infinite;
   }
   
   .img_p07{
    width:720px;
    height:356px;
    position:absolute;
    top:0;
    left:0;
    animation:img_p07_a 24s infinite;
   }
   
   .img_p08{
    width:720px;
    height:356px;
    position:absolute;
    top:0;
    left:0;
    animation:img_p08_a 24s infinite;
   }
   
   
   @keyframes img_p01_a{
    0%{opacity:1;}
    100%{opacity:1;}
   }
   
   @keyframes img_p02_a{
    0%{opacity:0;}
    22.4%{opacity:0;}
    22.5%{opacity:1;}
    37.5%{opacity:1;}
    37.6%{opacity:0;}
    100%{opacity:0;}
   }
   
   @keyframes img_p03_a{
    0%{opacity:0;transform:translateY(-100%);}
    10%{opacity:0;transform:translateY(-100%);}
    12.5%{opacity:1;transform:translateY(0);}
    22.5%{opacity:1;transform:translateY(0);}
    25%{opacity:1;transform:translateY(100%);}
    26%{opacity:0;transform:translateY(100%);}
    100%{opacity:0;}
   }
   
   @keyframes img_p05_a{
    0%{opacity:0;transform:translateY(100%);}
    35%{opacity:0;transform:translateY(100%);}
    37.5%{opacity:1;transform:translateY(0);}
    47.5%{opacity:1;transform:translateY(0);}
    50%{opacity:1;transform:translateY(-100%);}
    51%{opacity:0;transform:translateXY(-100%);}
    100%{opacity:0;}
   }
   
   @keyframes img_p04_a{
    0%{opacity:0;}
    47.4%{opacity:0;}
    47.5%{opacity:1;}
    62.5%{opacity:1;}
    62.6%{opacity:0;}
    100%{opacity:0;}
   }
   
   @keyframes img_p07_a{
    0%{opacity:0;transform:translateY(-100%);}
    60%{opacity:0;transform:translateY(-100%);}
    62.5%{opacity:1;transform:translateY(0);}
    75%{opacity:1;transform:translatey(0);}
    77.5%{opacity:1;transform:translateY(100%);}
    77.6%{opacity:0;transform:translateY(100%);}
    100%{opacity:0;}
   }
   
   @keyframes img_p06_a{
    0%{opacity:0;}
    74.9%{opacity:0;}
    75%{opacity:1;}
    87.5%{opacity:1;}
    87.6%{opacity:0;}
    100%{opacity:0;}
   }
   
   @keyframes img_p08_a{
    0%{opacity:0;transform:translateY(100%);}
    84.9%{opacity:0;transform:translateY(100%);}
    87.5%{opacity:1;transform:translateY(0);}
    97.5%{opacity:1;transform:translateY(0);}
    99.9%{opacity:1;transform:translateY(-100%);}
    100%{opacity:0;}
   }
   
   /*ＨＰリンクボタン*/
   
   .link_centro_hp{
    font-size:24px;
    font-weight:bold;
    /*text-shadow:2px 2px 1px #ffffff;*/
    background:linear-gradient(to left, #ffffff, #cccccc 15%, #cccccc 85%, #ffffff);
    line-height:300%;
    width:720px;
    margin-bottom:150px;
    border-bottom:2px solid #000000;
    transition:0.5s;
   }
   
   .effect_p:hover + .link_centro_hp{
    color:#ffffff;
    text-shadow:2px 2px 1px #000000;
    background:linear-gradient(to left, #ffffff,#cccccc 5%, #999999 15%, #999999 85%,#cccccc 95%, #ffffff);
   }
   
   
   
   .hp_link_btn{
    width: 720px;
    border-top: 2px solid #000000;
    border-bottom: 2px solid #000000;
    background:linear-gradient(to left, #ffffff, #cccccc 15%, #cccccc 85%, #ffffff);
    display:block;
    color:#000000;
    font-size:24px;
    font-weight:bold;
    text-shadow:2px 2px 1px #ffffff;
    line-height:300%;
    text-decoration:none;
    text-align:center;
    transition:0.5s;
     position:relative;  
   }
   
   .hp_link_btn::after{
    content: "";
    border-top:1px solid #000000;
    border-bottom:1px solid #000000;
    position:absolute;
    top:3px;
    left:0px;
    width:calc(100%);
    height:calc(100% - 8px);
   }
   
   
   
   .hp_link_btn span{
    color:#000000;
   }
   
   
   .hp_link_btn > .hover{
    display:none;
   }
   
   /*.hp_link_btn a:hover{
    background:linear-gradient(to left, #ffffff, #999999 15%, #999999 85%, #ffffff);
   }*/
   
   .hp_link_btn:hover{
    background:linear-gradient(to left, #ffffff,#cccccc 5%, #999999 15%, #999999 85%,#cccccc 95%, #ffffff);
    border-top:2px solid #000000;
    border-bottom:2px solid #000000;
    text-decoration:none;
    box-shadow:8px 8px 6px gray;
   }
   
   .hp_link_btn:hover > .nomal{
    display:none;
   }
   
   .hp_link_btn:hover > .hover{
    display:inline;
    color:#ffffff;
    text-shadow:2px 2px 1px #000000;
   }
   
   
   /*test ホバー　画像拡大*/
   
   .kata_img1, .kata_img2{
     width: 350px;
     height: 490px;
     border:1px solid #000000;
     overflow: hidden;
   }
   
   .kata_img1 img:hover{
     transform: scale(1.1,1.1);
   }
   
   .kata_img2 img:hover{
     transform: scale(1.1,1.1);
   }

   .centro_h3{width: 720px;font-size: 26px;padding-bottom: 3px;border-bottom: 3px solid #000;margin-bottom: 20px;}

   h4{margin: 0;padding: 0;}