/*  General Settings */


/*  Style for PCs */
@media screen and (min-width: 1025px) {

  .companyimg01 {
    width:100%;
    height: auto;
    display: block;
    overflow: hidden;
    clip-path: polygon(0 10%, 100% 0%, 100% 90%, 0% 100%);
  }

  .comp_features01 {
    width:100%;
    max-width:1600px;
    height: auto;
    display: block;
    padding:50px 5% 150px;
    margin:0 auto;
  }
  .comf01_base {
    width:100%;
    height: auto;
    display: flex;
    justify-content: space-between;
  }
  .comp_features01 .comf01_graph {
    width:50%;
    order: 2;
  }
  .comp_features01 .comf01_cc {
    width:45%;
    padding:20px 0;
    order:1;
  }
  .comp_features01 .comf01_cc h3 {
    font-family: var(--font-min);
    font-size:26px;
    font-weight: 600;
    line-height:1.25em;
    margin-bottom: 6px;
  }
  .comp_features01 .comf01_cc h4 {
    font-family: var(--font-min);
    color:var(--color-555);
    font-size:16px;
    font-weight: 400;
    line-height:1.25em;
    margin-bottom: 10px;
  }
  .comp_features01 .comf01_cc  p {
    line-height: 2em;
  }
  .comp_features01 .comptitle {
    width:100%;
    height: auto;
    display: flex;
    flex-direction: column;
    text-align: center;
    margin-bottom: 25px;
  }
  .comp_features01 .comptitle h2 {
    width:100%;
    height: auto;
    display: block;
    font-size:12px;
    font-weight: 400;
    line-height: 1em;
    color:var(--color-777);
    order:2;
  }
  .comp_features01 .comptitle p {
    width:100%;
    height: auto;
    display: block;
    font-size:24px;
    font-family: var(--font-min);
    font-weight: 400;
    line-height: 1.25em;
    color:var(--color-black);
    letter-spacing: 0.3em;
    margin-bottom: 10px;
    order:1;
  }


.comp_sec01 {
  width:100%;
  max-width:1600px;
  height: auto;
  display: flex;
  margin:0 auto;
  padding:100px 0;
}
.comp_sec01 .comptitle {
  width:15%;
  border-right:1px solid var(--color-black);
  padding:0px;
}
.comp_sec01 .comptitle h2 {
  width:400px;
  height: auto;
  display: block;
  font-size:12px;
  font-weight: 400;
  line-height: 1em;
  color:var(--color-555);
  order:2;
}
.comp_sec01 .comptitle p {
  width:400px;
  height: auto;
  display: block;
  font-size:24px;
  font-family: var(--font-min);
  font-weight: 400;
  line-height: 1.25em;
  color:var(--color-black);
  letter-spacing: 0.3em;
  margin-bottom: 10px;
  order:1;
}
.comp_sec01 .comptitle .comptt_cc {
  width:auto;
  height: auto;
  display: flex;
  flex-direction: column;
  transform:rotate(90deg);
  transform-origin: 30% 120%;
}
.comp_sec01 .comp_cc {
  width:85%;
  height: auto;
  padding:50px 5% 70px;
  display: block;
}

.comp_sec02 {
  width:100%;
  max-width:1600px;
  height: auto;
  display: flex;
  margin:0 auto 100px;
}
.comp_sec02 .comptitle {
  width:15%;
  border-left:1px solid var(--color-black);
  padding:0px;
  order:2;
}
.comp_sec02 .comptitle h2 {
  width:400px;
  height: auto;
  display: block;
  font-size:12px;
  font-weight: 400;
  line-height: 1em;
  color:var(--color-555);
  order:2;
}
.comp_sec02 .comptitle p {
  width:400px;
  height: auto;
  display: block;
  font-size:24px;
  font-family: var(--font-min);
  font-weight: 400;
  line-height: 1.25em;
  color:var(--color-black);
  letter-spacing: 0.3em;
  margin-bottom: 10px;
  order:1;
}
.comp_sec02 .comptitle .comptt_cc {
  width:auto;
  height: auto;
  display: flex;
  flex-direction: column;
  transform:rotate(90deg);
  transform-origin: 30% 120%;
}
.comp_sec02 .comp_cc {
  width:85%;
  height: auto;
  padding:50px 5% 0px;
  display: block;
  order:1;
}

.mapmm, .mapmm iframe {
  width:100%;
  height: 500px;
  display: block;
}

.accessinfo {
  width:100%;
  height: auto;
  display: flex;
  justify-content: space-between;
  padding:50px 0 50px 0;
}
.accessinfo .acci_01  {
  width:50%;
  height: auto;
  display: block;
  padding:0 5% 0 0;
  border-right:1px dotted var(--color-ccc);
}
.accessinfo .acci_02 {
  width:45%;
  height: auto;
  display: block;
}

/* Image slide */
.comp_slide {
  width:100%;
  height: auto;
  display: block;
  margin-bottom: 50px;
}
.imageslider {
  width:100%;
  height:auto;
  display:block;
  }
  /* Container DIV */
  .imageslider .simply-scroll {
  width: 100%;
  height: auto;
  }
  /* Clip DIV */
  .imageslider .simply-scroll .simply-scroll-clip {
  width: 100%;
  height: 550px;
  padding:25px 0;
  }
  /* Explicitly set height/width of each list item */
  .imageslider .simply-scroll .simply-scroll-list li { float: left; /* Horizontal scroll only */ width: 400px!important; height: 500px; margin:0 1%;
  }
  .imageslider .simply-scroll .simply-scroll-list li:nth-child(even) {
    margin-top:50px;
  }
  .imageslider .simply-scroll .simply-scroll-list li img {
  width:100%;
  height:auto;
  display:block;
  overflow: hidden;
  border-radius: 30px;
  box-shadow:0px 15px 20px rgba(0,0,0,0.2);
  }

}

/*  Style for iPad Pro */
@media screen and (min-width: 769px) and (max-width: 1024px) {

  .companyimg01 {
    width:70%;
    height: auto;
    display: block;
    overflow: hidden;
    clip-path: polygon(0 10%, 100% 0%, 100% 90%, 0% 100%);
    margin:0 auto;
  }

  .comp_features01 {
    width:100%;
    height: auto;
    display: block;
    padding:0px 5% 0;
    margin:0 auto 100px;
  }
  .comf01_base {
    width:100%;
    height: auto;
    display: flex;
    flex-direction: column;
  }
  .comp_features01 .comf01_graph {
    width:80%;
    height: auto;
    display: block;
    margin:0 auto 50px;
    order: 1;
  }
  .comp_features01 .comf01_cc {
    width:100%;
    padding:20px 0;
    order:2;
  }
  .comp_features01 .comf01_cc h3 {
    font-family: var(--font-min);
    font-size:32px;
    font-weight: 600;
    line-height:1.25em;
    margin-bottom: 5px;
  }
  .comp_features01 .comf01_cc h4 {
    font-family: var(--font-min);
    font-size:18px;
    color:var(--color-777);
    font-weight: 400;
    line-height:1.25em;
    margin-bottom: 10px;
  }
  .comp_features01 .comf01_cc  p {
    line-height: 2em;
  }
  .comp_features01 .comptitle {
    width:100%;
    height: auto;
    display: flex;
    flex-direction: column;
    text-align: center;
    margin-bottom: 25px;
  }
  .comp_features01 .comptitle h2 {
    width:100%;
    height: auto;
    display: block;
    font-size:12px;
    font-weight: 400;
    line-height: 1em;
    color:var(--color-777);
    order:2;
  }
  .comp_features01 .comptitle p {
    width:100%;
    height: auto;
    display: block;
    font-size:24px;
    font-family: var(--font-min);
    font-weight: 400;
    line-height: 1.25em;
    color:var(--color-black);
    letter-spacing: 0.3em;
    margin-bottom: 10px;
    order:1;
  }

  .comp_sec01 {
    width:100%;
    height: auto;
    display: flex;
    padding-top: 50px;
    margin:0 auto 100px;
  }
  .comp_sec01 .comptitle {
    width:15%;
    border-right:1px solid var(--color-black);
    padding:0px;
  }
  .comp_sec01 .comptitle h2 {
    width:400px;
    height: auto;
    display: block;
    font-size:12px;
    font-weight: 400;
    line-height: 1em;
    color:var(--color-555);
    order:2;
  }
  .comp_sec01 .comptitle p {
    width:400px;
    height: auto;
    display: block;
    font-size:24px;
    font-family: var(--font-min);
    font-weight: 400;
    line-height: 1.25em;
    color:var(--color-black);
    letter-spacing: 0.3em;
    margin-bottom: 10px;
    order:1;
  }
  .comp_sec01 .comptitle .comptt_cc {
    width:auto;
    height: auto;
    display: flex;
    flex-direction: column;
    transform:rotate(90deg);
    transform-origin: 30% 120%;
  }
  .comp_sec01 .comp_cc {
    width:85%;
    height: auto;
    padding:50px 5% 50px;
    display: block;
  }

  .comp_sec02 {
    width:100%;
    height: auto;
    display: flex;
    margin:0 auto;
  }
  .comp_sec02 .comptitle {
    width:15%;
    border-left:1px solid var(--color-black);
    padding:0px;
    order:2;
  }
  .comp_sec02 .comptitle h2 {
    width:400px;
    height: auto;
    display: block;
    font-size:12px;
    font-weight: 400;
    line-height: 1em;
    color:var(--color-555);
    order:2;
  }
  .comp_sec02 .comptitle p {
    width:400px;
    height: auto;
    display: block;
    font-size:24px;
    font-family: var(--font-min);
    font-weight: 400;
    line-height: 1.25em;
    color:var(--color-black);
    letter-spacing: 0.3em;
    margin-bottom: 10px;
    order:1;
  }
  .comp_sec02 .comptitle .comptt_cc {
    width:auto;
    height: auto;
    display: flex;
    flex-direction: column;
    transform:rotate(90deg);
    transform-origin: 30% 120%;
  }
  .comp_sec02 .comp_cc {
    width:85%;
    height: auto;
    padding:50px 5% 70px;
    display: block;
    order:1;
  }

  .mapmm, .mapmm iframe {
    width:100%;
    height: 500px;
    display: block;
  }

  .accessinfo {
    width:100%;
    height: auto;
    display: flex;
    justify-content: space-between;
    padding:50px 0 50px 0;
  }
  .accessinfo .acci_01  {
    width:50%;
    height: auto;
    display: block;
    padding:0 5% 0 0;
    border-right:1px dotted var(--color-ccc);
  }
  .accessinfo .acci_02 {
    width:45%;
    height: auto;
    display: block;
  }

  /* Image slide */
  .comp_slide {
    width:100%;
    height: auto;
    display: block;
    margin-bottom: 0px;
  }
  .imageslider {
    width:100%;
    height:auto;
    display:block;
    }
    /* Container DIV */
    .imageslider .simply-scroll {
    width: 100%;
    height: auto;
    }
    /* Clip DIV */
    .imageslider .simply-scroll .simply-scroll-clip {
    width: 100%;
    height: 450px;
    padding:25px 0;
    }
    /* Explicitly set height/width of each list item */
    .imageslider .simply-scroll .simply-scroll-list li { float: left; /* Horizontal scroll only */ width: 300px!important; height: 400px; margin:0 1%;
    }
    .imageslider .simply-scroll .simply-scroll-list li:nth-child(even) {
      margin-top:50px;
    }
    .imageslider .simply-scroll .simply-scroll-list li img {
    width:100%;
    height:auto;
    display:block;
    overflow: hidden;
    border-radius: 20px;
    box-shadow:0px 15px 20px rgba(0,0,0,0.2);
    }

}


/*  Style for Smartphone */
@media screen and (max-width: 768px) {

  .companyimg01 {
    width:100%;
    height: auto;
    display: block;
    overflow: hidden;
    clip-path: polygon(0 10%, 100% 0%, 100% 90%, 0% 100%);
    margin:0 auto;
  }

  .comp_features01 {
    width:100%;
    height: auto;
    display: block;
    padding:0px 5% 50px;
    margin:0 auto;
  }
  .comf01_base {
    width:100%;
    height: auto;
    display: flex;
    flex-direction: column;
  }
  .comp_features01 .comf01_graph {
    width:100%;
    height: auto;
    display: block;
    margin:0 auto;
    order: 1;
  }
  .comp_features01 .comf01_cc {
    width:100%;
    padding:20px 0;
    order:2;
  }
  .comp_features01 .comf01_cc h3 {
    font-family: var(--font-min);
    font-size:26px;
    font-weight: 600;
    line-height:1.25em;
    margin-bottom: 8px;
  }
  .comp_features01 .comf01_cc h4 {
    font-family: var(--font-min);
    color:var(--color-555);
    font-size:16px;
    font-weight: 400;
    line-height:1.25em;
    margin-bottom: 10px;
  }
  .comp_features01 .comf01_cc  p {
    line-height: 2em;
  }
  .comp_features01 .comptitle {
    width:100%;
    height: auto;
    display: flex;
    flex-direction: column;
    text-align: center;
    margin-bottom: 25px;
  }
  .comp_features01 .comptitle h2 {
    width:100%;
    height: auto;
    display: block;
    font-size:12px;
    font-weight: 400;
    line-height: 1em;
    color:var(--color-777);
    order:2;
  }
  .comp_features01 .comptitle p {
    width:100%;
    height: auto;
    display: block;
    font-size:24px;
    font-family: var(--font-min);
    font-weight: 400;
    line-height: 1.25em;
    color:var(--color-black);
    letter-spacing: 0.3em;
    margin-bottom: 10px;
    order:1;
  }

  .comp_sec01 {
    width:100%;
    height: auto;
    display: flex;
    flex-direction: column;
    margin:0 auto 100px;
    padding:100px 8% 0;
  }
  .comp_sec01 .comptitle {
    width:100%;
    border-bottom:1px solid var(--color-black);
    padding:0 0 15px 0;
    margin-bottom: 25px;
  }
  .comp_sec01 .comptitle h2 {
    width:100%;
    height: auto;
    display: block;
    font-size:12px;
    font-weight: 400;
    line-height: 1em;
    color:var(--color-777);
    order:2;
  }
  .comp_sec01 .comptitle p {
    width:100%;
    height: auto;
    display: block;
    font-size:18px;
    font-family: var(--font-min);
    font-weight: 400;
    line-height: 1.25em;
    color:var(--color-black);
    letter-spacing: 0.3em;
    margin-bottom: 10px;
    order:1;
  }
  .comp_sec01 .comptitle .comptt_cc {
    width:auto;
    height: auto;
    display: flex;
    flex-direction: column;
  }
  .comp_sec01 .comp_cc {
    width:100%;
    height: auto;
    padding:0 0 0 0;
    display: block;
  }

  .comp_sec02 {
    width:100%;
    height: auto;
    display: flex;
    flex-direction: column;
    margin:0 auto 100px;
    padding:0 8%;
  }
  .comp_sec02 .comptitle {
    width:100%;
    border-bottom:1px solid var(--color-black);
    padding:0 0 15px 0;
    margin-bottom: 25px;
  }
  .comp_sec02 .comptitle h2 {
    width:100%;
    height: auto;
    display: block;
    font-size:12px;
    font-weight: 400;
    line-height: 1em;
    color:var(--color-777);
    order:2;
  }
  .comp_sec02 .comptitle p {
    width:100%;
    height: auto;
    display: block;
    font-size:18px;
    font-family: var(--font-min);
    font-weight: 400;
    line-height: 1.25em;
    color:var(--color-black);
    letter-spacing: 0.3em;
    margin-bottom: 10px;
    order:1;
  }
  .comp_sec02 .comptitle .comptt_cc {
    width:auto;
    height: auto;
    display: flex;
    flex-direction: column;
  }
  .comp_sec02 .comp_cc {
    width:100%;
    height: auto;
    padding:0 0 0 0;
    display: block;
  }

  .mapmm, .mapmm iframe {
    width:100%;
    height: 400px;
    display: block;
  }

  .accessinfo {
    width:100%;
    height: auto;
    display: flex;
    flex-direction: column;
    padding:50px 0 50px 0;
  }
  .accessinfo .acci_01  {
    width:100%;
    height: auto;
    display: block;
    padding:0 0 0 0;
  }
  .accessinfo .acci_02 {
    width:100%;
    height: auto;
    display: block;
  }


  /* Image slide */
  .comp_slide {
    width:100%;
    height: auto;
    display: block;
    margin-bottom: 0px;
  }
  .imageslider {
    width:100%;
    height:auto;
    display:block;
    }
    /* Container DIV */
    .imageslider .simply-scroll {
    width: 100%;
    height: auto;
    }
    /* Clip DIV */
    .imageslider .simply-scroll .simply-scroll-clip {
    width: 100%;
    height: 350px;
    padding:25px 0;
    }
    /* Explicitly set height/width of each list item */
    .imageslider .simply-scroll .simply-scroll-list li { float: left; /* Horizontal scroll only */ width: 200px!important; height: 300px; margin:0 1%;
    }
    .imageslider .simply-scroll .simply-scroll-list li:nth-child(even) {
      margin-top:50px;
    }
    .imageslider .simply-scroll .simply-scroll-list li img {
    width:100%;
    height:auto;
    display:block;
    overflow: hidden;
    border-radius: 10px;
    box-shadow:0px 10px 15px rgba(0,0,0,0.2);
    }

}
