@charset "utf-8";

@media screen and (max-width: 1000px) {
  /*+-----+-----+-----+-----+-----+-----+-----+-----+-----+-----+
+-----+// glbnav
--+-----+-----+-----+-----+-----+-----+-----+-----+-----+-----+*/


  nav.sub_nav dl dd {
    padding:60px 40px;
  }

  nav.sub_nav dl dd ul li {
    width:50%;
    /* color:#fff; */
    border-right:1px solid #0856a0;
    padding: 10px 0 20px 20px;
  }
  nav.sub_nav dl dd ul li:nth-child(1), nav.sub_nav dl dd ul li:nth-child(4) {
    border-left:none;
  }
  nav.sub_nav dl dd ul li:nth-child(1), nav.sub_nav dl dd ul li:nth-child(3), nav.sub_nav dl dd ul li:nth-child(5) {
    border-left:1px solid #0856a0;
  }
  nav.sub_nav dl dd ul.sub li:nth-child(3) {
    border-left:none;
  }
}


@media screen and (max-width: 900px) {
  /*+-----+-----+-----+-----+-----+-----+-----+-----+-----+-----+
+-----+// contact
--+-----+-----+-----+-----+-----+-----+-----+-----+-----+-----+*/

  .dpcnone900 {
    display:block!important;
  }
  .dspnone900 {
    display:none!important;
  }
  nav.glbnav ul {
    padding-right:107px;
  }
}

@media screen and (max-width: 780px) {
  .dpcnone780 {
    display:block!important;
  }
  .dspnone780 {
    display:none!important;
  }

  nav.sub_nav dl dd div.nav_wrap {
    flex-wrap:wrap;
  }
  nav.sub_nav dl dd div.nav_wrap h1 {
    width:100%;
    padding-right:0;
    display:flex;
    align-items:center;
    margin-bottom:30px;
  }
  nav.sub_nav dl dd ul {
    width:100%;
    max-width:100%;
    margin:auto;
    display:flex;
    flex-wrap:wrap;
  }


  header nav.glbnav ul {
    display:none;
  }
  header h1.sp_logo {
    text-align:left;
  }
  header h1.sp_logo a {
    color:#0f376f;
    font-size:20px;
    font-weight:bold;
  }

  /*+-----+-----+-----+-----+-----+-----+-----+-----+-----+-----+
+-----+// mimage
--+-----+-----+-----+-----+-----+-----+-----+-----+-----+-----+*/

  .wrapper {
    /* height: 760px; */
  }
  div.panel div.btn_slide {
    position:absolute;
    bottom:30px;
    text-align:center;
  }

  section#section-1 div.section-content {
    padding-top:100px;
    justify-content: flex-start;
    -webkit-box-align: center;
  }
  section#section-2 div.section-content {
    padding-bottom:80px;
    justify-content: flex-end;
    -webkit-box-align: center;
    background:url(../images/top/slide02.png) no-repeat top 30px center;
    background-size:400px;
  }

  div.panel h2 {
    width:100%;
    max-width:1000px;
    margin:30px auto;
  }
  div.panel h2 img {
    max-width:100%;
  }
  div.panel h3 {
    color:#602c88;
    margin:20px 0;
    font-size:18px;
    font-weight:bold;
    width:100%;
    max-width:1000px;
    margin:0 auto;
    line-height:1.5;
  }
  div.panel p {
    color:#602c88;
    margin:20px 0;
    font-size:14px;
    line-height:1.7;
    width:100%;
    max-width:1000px;
    margin:30px auto;
  }
  div.panel div.btn_slide {
    width:100%;
    max-width:1000px;
    margin:0 auto;
  }
  div.panel div.btn_slide a {
    margin: 0 auto;
  }

  /*+-----+-----+-----+-----+-----+-----+-----+-----+-----+-----+
+-----+// service
--+-----+-----+-----+-----+-----+-----+-----+-----+-----+-----+*/

  section.service dl {
    flex-direction: column-reverse;
  }
  section.service dl dt {
    width:100%;
    text-align:center;
    background:none;
  }
  section.service dl dt img {
    width:100%;
    max-width:400px;
  }
  section.service dl dd {
    width:100%;
    max-width:500px;
    margin:0 auto;
    padding:50px 40px 20px;
  }

  footer div.copy p {
    font-size:12px;
  }

  /*+-----+-----+-----+-----+-----+-----+-----+-----+-----+-----+
+-----+// top nav
--+-----+-----+-----+-----+-----+-----+-----+-----+-----+-----+*/

  section.top_nav ul li {
    width:calc(50% - 10px);
    margin:10px 0;
    border:1px solid #ccc;
    box-shadow: 0 0 8px #b3b3b3;
    padding:25px 20px;
    text-align:center;
  }


  /*+-----+-----+-----+-----+-----+-----+-----+-----+-----+-----+
+-----+// footer
--+-----+-----+-----+-----+-----+-----+-----+-----+-----+-----+*/

  footer {
    width:100%;
  }
  footer h2 {
    padding-right:0;
    margin:0 auto 20px;
  }

  footer nav.foot_nav ul {
    display:none;
  }
  footer div.copy {
    text-align:center;
  }
}


@media screen and (max-width: 680px) {
  .dpcnone680 {
    display:block!important;
  }
  .dspnone680 {
    display:none!important;
  }

  /*+-----+-----+-----+-----+-----+-----+-----+-----+-----+-----+
+-----+// glbnav
--+-----+-----+-----+-----+-----+-----+-----+-----+-----+-----+*/

  nav.glbnav ul.nav_pc_sub li:after {
    position:absolute;
    right:10px;
    top:0;
    bottom:0;
    margin:auto 0;
    display: flex;
    align-items: center;
    font-weight:bold;
  }
  nav.glbnav ul.nav_pc_sub li.plus:after {
    content:"+";
  }
  nav.glbnav ul.nav_pc_sub li.arrow:after {
    content:">";
  }


  nav.sub_nav dl {
    width:100%;
    height:auto;
    position:fixed;
    z-index:1000;
  }

  nav.sub_nav dl dd {
    display:none;
    width:100%;
    height:100vh;
    padding:40px 0 20px;
    top:0;
    border-radius:0;
    overflow: auto;
  }

  nav.sub_nav dl dd div.nav_wrap {
    width:100%;
    max-width:800px;
    margin:auto;
    display:flex;
  }


  nav.sub_nav dl dd div.nav_wrap h1 {
    width:180px;
    margin:0 auto 20px;
    padding-right:0;
  }

  nav.sub_nav dl dd ul {
    width:100%;
    margin:auto;
    border-top:1px solid #0856a0;
  }
  nav.sub_nav dl dd ul li {
    width:100%;
    border-right:none;
    border-bottom:1px solid #0856a0;
    padding:0;
  }
  nav.sub_nav dl dd ul li:nth-child(n) {
    border-left:none;
  }
  nav.sub_nav dl dd ul li a {
    width:100%;
    display:block;
    padding:20px;
    position:relative;
  }
  nav.sub_nav dl dd ul li span {
    width:100%;
    display:block;
    padding:20px;
    position:relative;
    box-sizing: border-box;
  }
  nav.sub_nav dl dd ul li.nav_copy {
    width:100%;
    margin-top:15px;
    padding:10px 0;
    border:none;
    border-top:none;
    border-bottom:none;
    display:flex;
    justify-content:center;
    flex-direction:column;
    align-items: center;
    text-align:center;
  }

  nav.sub_nav dl dd ul li span:after {
    position:absolute;
    right:10px;
    top:0;
    bottom:0;
    margin:auto 0;
    display: flex;
    align-items: center;
    font-weight:bold;
  }
  nav.sub_nav dl dd ul li.plus span:after {
    content:"+";
  }
  nav.sub_nav dl dd ul li.plus span.active:after {
    content:"-";
  }
  nav.sub_nav dl dd ul li.arrow a:after {
    position:absolute;
    right:10px;
    top:0;
    bottom:0;
    margin:auto 0;
    display: flex;
    align-items: center;
    font-weight:bold;
    content:">";
  }

  nav.sub_nav dl dd ul.sub {
    display:none;
    flex-direction:column;
    margin:0;
  }
  nav.sub_nav dl dd ul.sub li {
    width:100%;
    border-right:none;
    padding:0;
    margin-bottom:0;
    border-bottom:1px solid #0856a0;
  }
  nav.sub_nav dl dd ul.sub li:last-child {
    border-bottom:none;
  }
  nav.sub_nav dl dd ul.sub li a {
    width:100%;
    display:block;
    padding:20px;
  }
  nav.sub_nav dl dd ul.sub li:nth-child(n) {
    border-left:none;
  }

  .wrapper {
    /* height: 760px; */
  }

  section.about h2 div.sec_wrap {
    justify-content: center;
    flex-direction: column;
    text-align: center;
  }
  section.about h2 span.jp {
    line-height:1.6;
  }

  section.service dl dd h3 {
    text-align:center;
  }

  /*+-----+-----+-----+-----+-----+-----+-----+-----+-----+-----+
+-----+// contact
--+-----+-----+-----+-----+-----+-----+-----+-----+-----+-----+*/

  section.contact dt {
    width:100%;
    padding:20px 0;
    display:flex;
    justify-content:center;
    align-items:center;
  }
  section.contact h2 {
    margin-bottom:0;
    text-align:center;
    font-size:24px;
  }
  section.contact h2 span {
    color:#602c88;
    font-size:14px;
  }
  section.contact dd {
    width:100%;
    padding:20px;
  }

  section.contact dd div.contact_group {
    max-width:100%;
    width:100%;
  }
  section.contact dd div.contact_group h3 {
    text-align:center;
  }

  section.contact dd div.contact_group .btn_contact {
    width:100%;
    min-width:206px;
    max-width:380px;
    margin:0 auto 15px;
  }
  section.contact dd div.contact_group .btn_contact span {
    margin-left:10px;
  }
  section.contact dd div.contact_group .btn_contact:after {
    top:12px;
  }



  /*+-----+-----+-----+-----+-----+-----+-----+-----+-----+-----+
+-----+// company outline
--+-----+-----+-----+-----+-----+-----+-----+-----+-----+-----+*/

  section.outline dd.com_map div.map_con {
    width:100%;
    padding-right:0;
    margin-bottom:20px;
  }

  /*+-----+-----+-----+-----+-----+-----+-----+-----+-----+-----+
+-----+// service
--+-----+-----+-----+-----+-----+-----+-----+-----+-----+-----+*/

  section.service_con h3 {
    font-size:28px;
    line-height:1.5;
  }
  section.service_con div.service_wrap {
    padding:0 20px;
  }
}


@media screen and (max-width: 520px) {
  .dspnone {
    display:none!important;
  }
  .dpcnone {
    display:block!important;
  }

  section#section-2 div.section-content {
    background-size:80%;
  }

  /*+-----+-----+-----+-----+-----+-----+-----+-----+-----+-----+
+-----+// about
--+-----+-----+-----+-----+-----+-----+-----+-----+-----+-----+*/

  /* section.about ul li {
    width:50%;
    text-align:center;
    margin-bottom:40px;
  } */


  /*+-----+-----+-----+-----+-----+-----+-----+-----+-----+-----+
+-----+// company outline
--+-----+-----+-----+-----+-----+-----+-----+-----+-----+-----+*/

  section.outline dt {
    width:100%;
    padding:20px 40px 0;
    border-bottom:none;
  }
  section.outline dd {
    width:100%;
    padding:10px 40px 20px;
  }

  /*+-----+-----+-----+-----+-----+-----+-----+-----+-----+-----+
+-----+// company develop
--+-----+-----+-----+-----+-----+-----+-----+-----+-----+-----+*/

  section.develop dt {
    width:100%;
    padding:20px 40px 0;
    border-bottom:none;
  }
  section.develop dd {
    width:100%;
    padding:10px 40px 20px;
  }

  /*+-----+-----+-----+-----+-----+-----+-----+-----+-----+-----+
+-----+// recruit
--+-----+-----+-----+-----+-----+-----+-----+-----+-----+-----+*/

  section.recruit dt {
    width:100%;
    padding:20px 40px 0;
    border-bottom:none;
  }
  section.recruit dd {
    width:100%;
    padding:10px 40px 20px;
  }
}