@media (max-width: 768px) {
    #container{
        min-width: 320px;
        text-align: center;
        color: #fff;
        font-size: 12px!important;
    }
    #top{
        /*background: url(../img/top_ph.png) no-repeat;
        background-size: cover;
        background-position: 54.5%;*/
        /*アニメーション
        min-height: 570px;*/
        min-height: auto;
        width: auto;
        height: 100%;
        height: 100vh;
        position: relative;
        display: block;
        -webkit-animation: scaleIn 4s ease both;
        animation: scaleIn 4s ease both;
    }
    #top_cover{
        background: url(../img/top_ph.png) no-repeat;
        background-size: cover;
        background-position: 54.5%;
        z-index: -10;
        height: 100%;
        width: 100%;
/*        -webkit-transition: opacity 5s ease-out 1000ms;
        transition: opacity 5s ease-out 1000ms;
        -webkit-animation: scaleIn 5s ease both 1000ms;
        animation: scaleIn 5s ease both 1000ms;*/
    }
    #leo{
        background: url(../img/leo_ph.png) center no-repeat;
        background-size: cover;
        min-height: 570px;
        width: auto;
        height: 100%;
        height: 100vh;
        text-align: left;
        /*min-height: 600px;*/
    }
    #three{
        background: url(../img/three_ph.png) right no-repeat;
        background-size: cover;
        min-height: 570px;
        width: auto;
        height: 100%;
        height: 100vh;
        text-align: left;
    }
    #message{
        background: url(../img/message_ph.png) center no-repeat;
        background-size: cover;
        min-height: 570px;
        width: auto;
        height: 100%;
        height: 100vh;
        text-align: left;
    }
    #skill{
        background: url(../img/skill_ph.png) center no-repeat;
        background-size: cover;
        min-height: 570px;
        width: auto;
        height: 100%;
        height: 100vh;
        text-align: left;
    }
    #about{
        background: url(../img/company_ph.png) center no-repeat;
        background-size: cover;
        /*min-height: 1140px;*/
        /*min-height: 830px;*/
        min-height: 830px;
        width: auto;
        height: 100%;
        height: 100vh;
        /*height: 146vh;*/
        text-align: left;
        position: relative;
    }
    #team{
        background: url(../img/about_ph.png) center no-repeat;
        background-size: cover;
        min-height: 570px;
        width: auto;
        height: 100%;
        height: 100vh;
        text-align: left;
    }
    #recruit{
        background: url(../img/recruit_ph.png) center no-repeat;
        background-size: cover;
        min-height: 570px;
        width: auto;
        height: 100%;
        height: 100vh;
        text-align: left;
    }
    #contact{
        background: url(../img/contact_ph.png) center no-repeat;
        background-size: cover;
        /*min-height: 1140px;*/
        /*min-height: 830px;*/
        min-height: 890px;
        width: auto;
        height: 100%;
        /*height: 200vh;*/
        /*height: 146vh;*/
        text-align: left;
        position: relative;
    }

    /*トップ*/
    #top .co_box{
        border: none;
        color: #fff;
        padding: 0;
        text-align: center;
        letter-spacing: 3px;
        font-family: 'Futura LT W01 Medium', sans-serif;
        width: auto;
        top: 0;
        bottom: 0;
        margin: auto;
        position: absolute;
        height: 200px;
    }
    .co_box .ccTtl{
        width: 85%;
        margin: 0 auto;
        max-width: 340px;
    }
    #top .title{
        font-size: 28px;
        letter-spacing: 5px;
    }

    .scroll_down{
        color: #fff;
        position: absolute;
        bottom: 15px;
        font-family: 'Futura LT W01 Medium', sans-serif;
        left: 0;
        right: 0;
        -webkit-animation: topsd 2s ease 3500ms both;
        animation: topsd 2s ease 3500ms both;
    }
    .scroll_down p{
        padding-bottom: 10px;
        font-size: 11px;
        letter-spacing: 1px;
    }
    .scroll_down img{
        width: 35px;
    }
    /*トップ*/
    /*#top .under_title{
        /*padding-top: 23px;*/
      /*  font-size: 17px;
        letter-spacing: 3px;
        width: 300px;
        margin: 23px auto 0;
        text-shadow: 2px 2px 0 #FFF,
             -2px 2px 0 #fff,
             2px -2px 0 #fff,
             -2px -2px 0 #FFF;
    }*/
    #top .under_title img{
        /*padding-top: 23px;*/
        width: 300px;
    }
    .title_underline{
        border-bottom: solid 1px;
        margin: 25px auto;
        width: 25px;
        -webkit-transform-origin: 50% 50%;
        -moz-transform-origin: 50% 50%;
        -ms-transform-origin: 50% 50%;
        -o-transform-origin: 50% 50%;
        transform-origin: 50% 50%;
    }
    .left_block{
        margin: 0 auto 0;
        display: block;
        width: auto;
        position: relative;
        text-align: center;
        right: 0px;
        top: 8%;
    }

    #contact .left_block{
        width: auto;
        margin: !important;
    }
    .right_block{
        margin: 0 auto 0;
        display: block;
        width: auto;
        position: relative;
        text-align: center;
        right: 0px;
        top: 2%;
    }

    #team img {
    	width: 120px;
    	display: block;
    }
    #team .block_title {
      margin-top: 0rem;
    }
    #leo img.imgRight {
    	margin: 2rem auto;
    }
    #about a {
      color: #fff;
    }
    .fp-section.fp-table, .fp-slide.fp-table {
        display: table;
        table-layout: fixed;
        width: 100%;
    }
    .left_block p.block_title ,.right_block p.block_title{
        font-size: 15px;
        letter-spacing: 4px;
        margin-top: 16px;
        font-family: 'Futura LT W01 Medium', sans-serif;
    }
    .left_block p.convey_01_ja ,.right_block p.convey_01_ja{
        font-size: 16px;
        letter-spacing: 1px;
        line-height: 1.5;
        font-family: "リュウミン M-KL", serif;
    }
    .left_block p.convey_02_ja ,.right_block p.convey_02_ja{
        font-size: 12px;
        letter-spacing: 0.5px;
        margin: 9px 0 35px;
        line-height: 1.5;
        font-family: "リュウミン M-KL", serif;
    }
    .left_block p.convey_01_eng ,.right_block p.convey_01_eng{
        font-size: 18px;
        letter-spacing: 2px;
        line-height: 1.2;
        margin-top: 24px;
    }
    .left_block p.convey_02_eng ,.right_block p.convey_02_eng{
        font-size: 11.5px;
        letter-spacing: 1.8px;
        margin: 11px 0 0px;
        line-height: 1.4;
    }
    #team a, #team a:hover {
    	color: rgb(255, 194, 36)!important;
    }
    #about .left_block p.blockText_font01 {
      line-height: 1.1rem!important;
    }
    p.blockText_font01 {
      width: 90%!important;
      margin: auto!important;
    	line-height: 1.4rem!important;
    	text-align: justify;
      font-size: 12px!important;
    }

    .convey_02_ja .convey_ja_sm{
        font-size: 10px;
    }
    p.textMini{
      margin: 1rem 0;
      font-size: 10px!important;
      line-height: 1.2rem!important;
    }
    p.spmargin{
      margin: 1rem auto 0!important;

    }
    #about .business_ja{
        margin-top: 12px;
        display: block;
    }
    .title_no{
        height: 41px;
        padding-right: 11px;
    }
    .to_top{
    /*  position: absolute;
        bottom: 0;
        left: 50%;
        margin-left: -7%;*/
    }
    .to_top img{
        /*width: 120px;*/
        width: 70px;
        position: absolute;
        bottom: 0;
        left: 0;
        margin: auto;
        right: 0;
    }
    #top .newsBlock {
      display: inline-block;
      width: 90%;
      heiht: 200px;
      text-align: center;
      position: absolute;
      top: auto;
      bottom: 22%;
      margin: 0px auto 0;
    }
    .comingcoon{
/* coming soonあり
        border: solid 1px;
        display: inline-block;
        padding: 12px 35px;
        margin-top: 40px;
        letter-spacing: 5px;
        font-size: 13px;*/
        border: none;
        display: inline-block;
        padding: 0;
        margin-top: 50px;
        letter-spacing: 5px;
        font-size: 23px;
    }
    /*====
    ニュースボックス
   ======*/
    .news_box{
        border: solid 1px;
        padding: 10px 0px 18px 0px;
        margin: 70px auto 0;
        width: 90%;
        text-align: center;
    }
    .left_block .news_box p.convey_02_eng{
        font-size: 12px;
        font-family: 'Futura LT W01 Medium', sans-serif;
    }
    .news_box .news_underline{
        border-bottom: solid 1px;
        margin: 11px auto 13px;
        text-align: center;
        width: 25px;
    }
    /*====ニュースボックス======*/
    .map_box{
          width: 270px;
          height: 280px;
          /* height: 385px; */
          display: inline-block;
          border: solid 1px #fff;
          padding: 22px 8px 13px;
          position: absolute;
          top: auto;
          bottom: 6%;
          right: 0;
          margin: 0px auto 0;
          left: 0;
    }
    .map_box .title_map{
        font-size: 12px;
        letter-spacing: 4px;
        font-family: 'Futura LT W01 Medium', sans-serif;
    }
    #map_canvas {
        height: 220px !important;
    }
    .map_underline{
        border-bottom: solid 1px;
        margin: 13px 0 20px;
        width: 25px;
    }
    .map{
      width: 270px;
    height: 220px;
    background: #fff;
    /* margin: 0 auto; */
    margin: 20px auto 0;
    }
    .address_ja{
        line-height: 1.4;
        font-size: 10px;
        letter-spacing: 0.5px;
        font-family: "リュウミン M-KL", serif;
    }
    .address_eng{
        margin: 5px 0 12px;
        font-size: 11.5px;
        letter-spacing: 1.8px;
        line-height: 1.4;
    }
    .map_box .map_top_line{
        display: none;
    }
    .map_box .map_bottom_line{
        display: none;
    }
    .map_box .map_left_line{
        display: none;
    }
    .map_box .map_right_line{
        display: none;
    }

    /* --responsive----------------------------------------------------------------------------------------------------------------- */

    /* 640pixel start */
    @media screen and ( max-width : 767px ){

    form#mail_form{
    	width : 90%;
    	margin : auto;
    	padding : 2px 0;
      font-size: 90%;
    	background : rgba( 0, 0, 0, 0.18 );
    	border-radius : 4px;
    	box-shadow : 0 0 7px rgba( 0, 0, 0, 0.2 );
    }

    form#mail_form dl{
    	width : 90%;
    	margin : 0 auto;
    	overflow : hidden;
    }

    form#mail_form dl dt{
    	width : auto;
    	float : none;
    	text-align : left;
    	padding : 10px 0 5px;
    	font-weight : bold;
    }

    form#mail_form dl dd{
    	width : auto;
    	float : left;
    	border-top : none;
      margin: 0px;
    	padding : 0px;
    }

    form#mail_form dl dt span{
    	font-weight : normal;
    }

    form#mail_form input {
      width: 80%!important;
    }

    /* -- for JavaScript ここから -------------------------------------------------------------------------------- */

    form#mail_form dl dt span.required,
    form#mail_form dl dt span.optional{
    	margin-right : 1em;
    	margin-bottom : 2em;
    }


    /* -- for JavaScript ここまで -------------------------------------------------------------------------------- */

    form#mail_form input#form_submit_button{
    	margin-left : 0!important;
    }

    form#mail_form input#phone,
    form#mail_form input#schedule{
    	width : 50%;
    }

    }
    /* 640pixel end */



/*非表示管理*/
    .sm_hide{
        display: none;
    }
    .pc_hide{
        display: block;
    }
    #top .left_line{
        display: none;
    }
    #top .right_line{
        display: none;
    }
    #top .top_line{
        display: none;
    }
    #top .bottom_line{
        display: none;
    }

    #success_page {
        margin: 5rem auto 0;
    }

/*非表示管理*/
/*========================
アニメーション
========================*/
    @keyframes scaleIn {
      0% {
        opacity: 0;
        -webkit-transform: scale(1.3);
        transform: scale(1.3);
      }
      100% {
        opacity: 1;
        -webkit-transform: scale(1);
        transform: scale(1);
      }
    }
    @-webkit-keyframes scaleIn {
      0% {
        opacity: 0;
        -webkit-transform: scale(1.3);
        transform: scale(1.3);
      }
      100% {
        opacity: 1;
        -webkit-transform: scale(1);
        transform: scale(1);
      }
    }
    .fadein {
    opacity : 0;
       -moz-transform: translate(0px,30px);
       -webkit-transform: translate(0px,30px);
       -o-transform: translate(0px,30px);
       -ms-transform: translate(0px,30px);
       transform : translate(0, 30px);

    /*  -webkit-transform: scale(0.4);
        transform: scale(0.4);*/
        -webkit-transition : all 2000ms;
        transition : all 2000ms;

    }
    .fadein.scrollin {
        opacity : 1;
        transform : translate(0, 0);
    /*  -webkit-transform: scale(1.0);
        transform: scale(1.0);*/
    }
    .active .fadein {
        opacity : 1;
        -moz-transform: translate(0px,0px);
        -webkit-transform: translate(0px,0px);
        -o-transform: translate(0px,0px);
        -ms-transform: translate(0px,0px);
        transform : translate(0, 0);
    /*  -webkit-transform: scale(1.0);
        transform: scale(1.0);*/
    }
    .fadein {
    opacity : 0;
        transform : translate(0, 30px);
        transition : all 1500ms;
    }
    .fadein_down {
    opacity : 0;
        transform : translate(0, -35px);
        -webkit-transition: 500ms cubic-bezier(0.78, 0.18, 0.44, 0.88);
        -moz-transition: 500ms cubic-bezier(0.78, 0.18, 0.44, 0.88);
        -ms-transition: 500ms cubic-bezier(0.78, 0.18, 0.44, 0.88);
        -o-transition: 500ms cubic-bezier(0.78, 0.18, 0.44, 0.88);
        transition: 500ms cubic-bezier(0.78, 0.18, 0.44, 0.88);
    }
    .fadein_up {
    opacity : 0;
        transform : translate(0, 30px);
        /*transition : all 1300ms cubic-bezier(0.78, 0.18, 0.44, 0.88) 200ms;*/
        -webkit-transition: 500ms cubic-bezier(0.78, 0.18, 0.44, 0.88);
        -moz-transition: 500ms cubic-bezier(0.78, 0.18, 0.44, 0.88);
        -ms-transition: 500ms cubic-bezier(0.78, 0.18, 0.44, 0.88);
        -o-transition: 500ms cubic-bezier(0.78, 0.18, 0.44, 0.88);
        transition: 500ms cubic-bezier(0.78, 0.18, 0.44, 0.88);
    }
    .fadein.scrollin {
        opacity : 1;
        transform : translate(0, 0);
    }
    .active .fadein,.active .fadein_up {
        opacity : 1;
        transform : translate(0, 0);
        -webkit-transition: all 1300ms cubic-bezier(0.78, 0.18, 0.44, 0.88) 200ms;
        -moz-transition: all 1300ms cubic-bezier(0.78, 0.18, 0.44, 0.88) 200ms;
        -ms-transition: all 1300ms cubic-bezier(0.78, 0.18, 0.44, 0.88) 200ms;
        -o-transition: all 1300ms cubic-bezier(0.78, 0.18, 0.44, 0.88) 200ms;
        transition : all 1300ms cubic-bezier(0.78, 0.18, 0.44, 0.88) 200ms;
    }
    .active .fadein_down{
        opacity : 1;
        transform : translate(0, 0);
        transition : all 1500ms cubic-bezier(0.78, 0.18, 0.44, 0.88) 300ms;
    }
/*=========アニメーション===============*/
}
@media (max-width: 350px) {
    #top .co_box {
        height: 150px;
    }
    #top .title {
        font-size: 26px;
        letter-spacing: 5px;
    }
    #message .left_block{
        top: 13%;
    }
    .map_box {
        width: 250px;
    }
    .map {
        width: 250px;
        height: 125px;
    }
    .scroll_down {
        /*bottom: 22%;*/
        bottom: 5%;
    }
}
