/* ----------------------------------------------------------
General Settings
---------------------------------------------------------- */


/* ----------------------------------------------------------
Style for PCs
---------------------------------------------------------- */
@media screen and (min-width: 1025px) {

.topcatch {
  width:100%;
  height: auto;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  font-size:34px;
  font-family: var(--font-min);
  font-weight: 300;
  line-height: 1.5em;
  text-align: center;
  color:var(--color-black);
  margin:0 auto 20px;
  padding-top:120px;
  background-image: url(../img/header/yamaha_trust.png);
  background-repeat: no-repeat;
  background-position: center top;
  background-size: auto 110px;
}

.imglist01 {
  width:100%;
  height: auto;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.imglist01 li {
  flex:1;
  margin:0 2%;
  box-shadow: 0px 5px 10px rgba(0,0,0,0.2);
}

.aboutcontents h2 {
  font-size:26px;
  font-family: var(--font-min);
  font-weight: 300;
  line-height: 1.5em;
  text-align: center;
  color:var(--color-black);
  margin-bottom: 5px;
}
.aboutcontents h3 {
  font-size:16px;
  font-family: var(--font-en);
  font-weight: 400;
  line-height: 1.25em;
  text-align: center;
  color:var(--color-1st);
  margin-bottom: 15px;
}
.aboutcontents p {
  font-size:14px;
  line-height: 2em;
  margin:0;
}

.about_sec01 {
  width:100%;
  height: auto;
  display:flex;
  justify-content: space-between;
  align-items: center;
}
.about_sec01 .abs01_a {
  width:30%;
  height: auto;
  display: block;
  clip-path: polygon(0 0, 85% 0, 100% 100%, 0% 100%);

}
.about_sec01 .abs01_c {
  width:30%;
  height: auto;
  display: block;
clip-path: polygon(15% 0, 100% 0%, 100% 100%, 0% 100%);
}
.about_sec01 .abs01_b {
  width:40%;
  height: auto;
  display: block;
  padding:5% 5% 5% 5%;
}


.about_sec02 {
  width:100%;
  height: auto;
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin:0 auto 80px;
}

.about_sec02 .abc02_a {
width:50%;
height: auto;
display: block;
order:1;
}
.about_sec02 .abc02_b {
width:45%;
height: auto;
display: block;
order:2;
}

.about_sec03 {
  width:100%;
  height: auto;
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin:0 auto;
}
.about_sec03 .abc03_a {
width:50%;
height: auto;
display: block;
order:2;
}
.about_sec03 .abc03_b {
width:45%;
height: auto;
display: block;
order:1;
}


.aboutsectitle h2 {
  font-size:26px;
  font-family: var(--font-min);
  font-weight: 300;
  line-height: 1.5em;
  color:var(--color-black);
  margin-bottom: 5px;
}
.aboutsectitle p {
  font-size:16px;
  font-family: var(--font-en);
  font-weight: 400;
  line-height: 1.25em;
  color:var(--color-1st);
  margin-bottom: 15px;
}

.aboutsectitle2 h2 {
  font-size:22px;
  font-family: var(--font-min);
  font-weight: 300;
  line-height: 1.5em;
  color:var(--color-black);
  margin-bottom: 5px;
}
.aboutsectitle2 p {
  font-size:14px;
  font-family: var(--font-en);
  font-weight: 400;
  line-height: 1.25em;
  color:var(--color-1st);
  margin-bottom: 5px;
}


}

/* ----------------------------------------------------------
Style for iPad Pro
---------------------------------------------------------- */
@media screen and (min-width: 769px) and (max-width: 1024px) {

.topcatch {
  width:100%;
  height: auto;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  font-size:28px;
  font-family: var(--font-min);
  font-weight: 300;
  line-height: 1.5em;
  text-align: center;
  color:var(--color-black);
  margin:0 auto 20px;
  padding-top:120px;
  background-image: url(../img/header/yamaha_trust.png);
  background-repeat: no-repeat;
  background-position: center top;
  background-size: auto 110px;
}

.imglist01 {
  width:70%;
  height: auto;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin:0 auto;
}
.imglist01 li {
  width:45%;
  height: auto;
  display: block;
  margin:0 2.5% 25px;
  box-shadow: 0px 5px 10px rgba(0,0,0,0.2);
}
.imglist01 li:nth-child(n+3) {
  margin:0 2.5% 0;
}

.aboutcontents h2 {
  font-size:26px;
  font-family: var(--font-min);
  font-weight: 300;
  line-height: 1.5em;
  text-align: center;
  color:var(--color-black);
  margin-bottom: 5px;
}
.aboutcontents h3 {
  font-size:16px;
  font-family: var(--font-en);
  font-weight: 400;
  line-height: 1.25em;
  text-align: center;
  color:var(--color-1st);
  margin-bottom: 15px;
}
.aboutcontents p {
  font-size:14px;
  line-height: 2em;
  margin:0;
}

.about_sec01 {
  width:80%;
  height: auto;
  display:flex;
  justify-content: space-between;
  flex-wrap: wrap;
  margin:0 auto;
}
.about_sec01 .abs01_a {
  width:45%;
  height: auto;
  display: block;
  margin:0 2.5% 0 0;
  box-shadow: 0px 5px 10px rgba(0,0,0,0.2);
  order:2;
}
.about_sec01 .abs01_c {
  width:45%;
  height: auto;
  display: block;
  margin:0 0 0 2.5%;
  box-shadow: 0px 5px 10px rgba(0,0,0,0.2);
  order:3;
}
.about_sec01 .abs01_b {
  width:100%;
  height: auto;
  display: block;
  padding:5% 5% 5% 5%;
  order:1;
}

.about_sec02 {
  width:90%;
  height: auto;
  display: flex;
  justify-content: space-between;
  margin:0 auto 80px;
}

.about_sec02 .abc02_a {
width:55%;
height: auto;
display: block;
order:1;
}
.about_sec02 .abc02_b {
width:40%;
height: auto;
display: block;
order:2;
}

.about_sec03 {
  width:90%;
  height: auto;
  display: flex;
  justify-content: space-between;
  margin:0 auto;
}
.about_sec03 .abc03_a {
width:55%;
height: auto;
display: block;
order:2;
}
.about_sec03 .abc03_b {
width:40%;
height: auto;
display: block;
order:1;
}


.aboutsectitle h2 {
  font-size:26px;
  font-family: var(--font-min);
  font-weight: 300;
  line-height: 1.5em;
  color:var(--color-black);
  margin-bottom: 5px;
}
.aboutsectitle p {
  font-size:16px;
  font-family: var(--font-en);
  font-weight: 400;
  line-height: 1.25em;
  color:var(--color-1st);
  margin-bottom: 15px;
}

.aboutsectitle2 h2 {
  font-size:22px;
  font-family: var(--font-min);
  font-weight: 300;
  line-height: 1.5em;
  color:var(--color-black);
  margin-bottom: 5px;
}
.aboutsectitle2 p {
  font-size:14px;
  font-family: var(--font-en);
  font-weight: 400;
  line-height: 1.25em;
  color:var(--color-1st);
  margin-bottom: 5px;
}

}


/* ----------------------------------------------------------
Style for Smartphone
---------------------------------------------------------- */
@media screen and (max-width: 768px) {

  .topcatch {
  width:100%;
  height: auto;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  font-size:24px;
  font-family: var(--font-min);
  font-weight: 300;
  line-height: 1.5em;
  text-align: left;
  color:var(--color-black);
  margin:0 auto 20px;
  padding-top:120px;
  background-image: url(../img/header/yamaha_trust.png);
  background-repeat: no-repeat;
  background-position: center top;
  background-size: auto 110px;
}
.topcatch br {
  display: none;
}

.imglist01 {
  width:100%;
  height: auto;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin:0 auto;
}
.imglist01 li {
  width:45%;
  height: auto;
  display: block;
  margin:0 2.5% 15px;
  box-shadow: 0px 5px 10px rgba(0,0,0,0.2);
}
.imglist01 li:nth-child(n+3) {
  margin:0 2.5% 0;
}

.aboutcontents h2 {
  font-size:22px;
  font-family: var(--font-min);
  font-weight: 300;
  line-height: 1.5em;
  text-align: center;
  color:var(--color-black);
  margin-bottom: 5px;
}
.aboutcontents h3 {
  font-size:12px;
  font-family: var(--font-en);
  font-weight: 400;
  line-height: 1.25em;
  text-align: center;
  color:var(--color-1st);
  margin-bottom: 15px;
}
.aboutcontents p {
  font-size:14px;
  line-height: 2em;
  margin:0;
}

.about_sec01 {
  width:90%;
  height: auto;
  display:flex;
  justify-content: space-between;
  flex-wrap: wrap;
  margin:0 auto;
}
.about_sec01 .abs01_a {
  width:43%;
  height: auto;
  display: block;
  margin:0 2% 0 5%;
  box-shadow: 0px 5px 10px rgba(0,0,0,0.2);
  order:2;
}
.about_sec01 .abs01_c {
  width:43%;
  height: auto;
  display: block;
  margin:0 5% 0 2%;
  box-shadow: 0px 5px 10px rgba(0,0,0,0.2);
  order:3;
}
.about_sec01 .abs01_b {
  width:100%;
  height: auto;
  display: block;
  padding:0% 5% 5% 5%;
  order:1;
}

.about_sec02 {
  width:98%;
  height: auto;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  margin:0 auto 50px;
}

.about_sec02 .abc02_a {
width:100%;
height: auto;
display: block;
order:2;
}
.about_sec02 .abc02_b {
width:100%;
height: auto;
display: block;
order:1;
margin-bottom: 20px;
}

.about_sec03 {
  width:98%;
  height: auto;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  margin:0 auto 0px;
}
.about_sec03 .abc03_a {
width:100%;
height: auto;
display: block;
order:2;
}
.about_sec03 .abc03_b {
width:100%;
height: auto;
display: block;
order:1;
margin-bottom: 20px;
}
.about_sec03 .abc03_b p {
  margin-bottom: 0;
}


.aboutsectitle h2 {
  font-size:26px;
  font-family: var(--font-min);
  font-weight: 300;
  line-height: 1.5em;
  color:var(--color-black);
  margin-bottom: 5px;
}
.aboutsectitle p {
  font-size:16px;
  font-family: var(--font-en);
  font-weight: 400;
  line-height: 1.25em;
  color:var(--color-1st);
  margin-bottom: 15px;
}

.aboutsectitle2 h2 {
  font-size:22px;
  font-family: var(--font-min);
  font-weight: 300;
  line-height: 1.5em;
  color:var(--color-black);
  margin-bottom: 5px;
}
.aboutsectitle2 p {
  font-size:14px;
  font-family: var(--font-en);
  font-weight: 400;
  line-height: 1.25em;
  color:var(--color-1st);
  margin-bottom: 5px;
}

}