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


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

/*TopSection*/
.topsection {
width:100%;
height: auto;
display: block;
position: relative;
margin-top:60px;
}
.hrcov {
width:100%;
height:  100%;
min-height: 100%;
display: block;
position: absolute;
top:0;
left:0%;
z-index:1200;
/*
background-image: url(../img/index/hrcov.png);
    background-repeat: no-repeat;
    background-position: 0 0;
    background-size: 100% auto;
*/

}
.topcov {
width:100%;
height:  100%;
min-height: 100%;
display: block;
position: absolute;
top:0;
left:0%;
z-index:1100;
background-image: url(../img/index/slidecov.png);
    background-repeat: no-repeat;
    background-position: 0 bottom;
    background-size: 100% auto;

}
.toptxt {
width:90%;
height:  100%;
min-height: 100%;
display: block;
position: absolute;
top:0;
left:5%;
z-index:1700;
padding:20% 5% 0 5%;
}
.toptxt h2 {
font-size:28px;
font-weight: 700;
line-height: 1.4em;
color:var(--color-white);
font-style: italic;
letter-spacing: 0px;
margin-bottom: 10px;
text-shadow:0px 2px 5px rgba(0,0,0,0.8);
}
.toptxt p {
font-size:14px;
font-weight: 700;
line-height: 1.4em;
font-family: var(--font-en);
color:var(--color-white);
letter-spacing: 0px;
margin-bottom: 0px;
text-shadow:0px 2px 5px rgba(0,0,0,0.8);
}

#slidemm_m {
width:100%;
height: auto;
display: block;
}

/* Slider */
.cycle-slideshow, .cycle-slideshow div, .cycle-slideshow div img {
width:100%;
height: auto;
display: block;
}

/* Slider */
#slidemm {
width:100%;
height: auto;
display: block;
}
.cycle-slideshow {
width:100%;
height: auto;
display: block;
}

.sectionbody {
width:100%;
height: auto;
display: block;
padding:60px 0;
margin:0 auto;
position: relative;
}

/* Title */
.sectitle {
width:100%;
height: auto;
display: block;
margin:0 auto 30px;
text-align:center;
}
.sectitle h2 {
font-size:18px;
font-weight: 400;
line-height: 1em;
text-align: center;
font-family: var(--font-en);
color:var(--color-primary);
letter-spacing: 0px;
margin-bottom: 10px;
}
.sectitle p {
font-size:14px;
font-weight: 400;
line-height: 1em;
text-align: center;
color:var(--color-black);
letter-spacing: 0px;
}

/* News */
.nwsection {
width:100%;
height:auto;
display: block;
padding:0px 5%;
margin:0 auto;
}


/* Intro */
.intbody {
width:100%;
height:auto;
display: block;
position: relative;
}
.intcc01 {
width:100%;
height:auto;
display: block;
position: relative;
padding:40% 5% 50px 5%;
background-image: url("../img/index/introbg.jpg");
background-position: right top;
background-repeat: no-repeat;
background-size: 90% auto;
margin-bottom: 20px;
}
.int02 {
width:100%;
height: auto;
display: block;
}
.int02 .int02cc {
width:100%;
height: auto;
display: block;
background-color: var(--color-white);
padding:20px;
}
.int02 h2 {
font-size:18px;
color:var(--color-primary);
font-weight: 400;
line-height: 1.8em;
letter-spacing: 0px;
margin-bottom:20px;
}
.int02 p {
color:var(--color-black);
line-height: 2em;
margin-bottom: 0em;
}

.intcc02 {
width:100%;
height:auto;
display: block;
position: relative;
padding:60% 5% 0px 5%;
background-image: url("../img/index/introbg2.jpg");
background-position: left top;
background-repeat: no-repeat;
background-size: 80% auto;
margin-bottom: 20px;
}
.int04 {
width:100%;
height: auto;
display: block;
}
.int04 .int04cc {
width:100%;
height: auto;
display: block;
background-color: var(--color-white);
padding:20px;
}
.int04 h2 {
font-size:18px;
color:var(--color-primary);
font-weight: 400;
line-height: 1.8em;
letter-spacing: 0px;
margin-bottom:20px;
}
.int04 p {
color:var(--color-black);
line-height: 2em;
margin-bottom: 0em;
}

/* Stock list */
.stocklist {
width:100%;
height:auto;
display:block;
margin:0 auto;
position: relative;
padding:50px 5% 100px;
padding-top: 20px;
}
.stockbar {
display:none;
}
.stockmm {
width:100%;
height:auto;
display:block;
}



/* Company */
.companymm {
  width:100%;
  height:auto;
  display: block;
  position: relative;
}
.mapmm, .mapmm iframe {
  width:100%;
  height: 300px;
  display: block;
}
.mapmm iframe {
  width:100%;
  height: 300px;
  display: block;
}
.addressmm {
width:100%;
height: auto;
display: block;
padding:0px 5% 50px;
}
.adrcc {
width:100%;
height: auto;
display: block;
text-align: center;
margin:0 auto;
}
.adrcc h2 {
  width:100%;
  height: auto;
  display: block;
  padding-top:80px;
  font-size:14px;
  color:var(--color-primary);
  margin-bottom: 15px;
  background-image: url(../img/header/logo.png);
  background-repeat: no-repeat;
  background-position: center top;
  background-size:auto 80px;
}
.adrcc p {
  line-height: 2em;
  margin-bottom: 0px;
}


}

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

/*TopSection*/
.topsection {
width:100%;
height: auto;
display: block;
position: relative;
margin-top:80px;
}
.hrcov {
width:100%;
height:  100%;
min-height: 100%;
display: block;
position: absolute;
top:0;
left:0%;
z-index:1200;

/*
background-image: url(../img/index/hrcov.png);
    background-repeat: no-repeat;
    background-position: 0 0;
    background-size: 100% auto;

*/
}
.topcov {
width:100%;
height:  100%;
min-height: 100%;
display: block;
position: absolute;
top:0;
left:0%;
z-index:1100;
background-image: url(../img/index/slidecov.png);
    background-repeat: no-repeat;
    background-position: 0 bottom;
    background-size: 100% auto;

}
.toptxt {
width:90%;
height:  100%;
min-height: 100%;
display: block;
position: absolute;
top:0;
left:5%;
z-index:1700;
padding:20% 5% 0 5%;
}
.toptxt h2 {
font-size:40px;
font-weight: 700;
line-height: 1em;
color:var(--color-white);
font-style: italic;
letter-spacing: 0px;
margin-bottom: 10px;
text-shadow:0px 2px 5px rgba(0,0,0,0.8);
}
.toptxt p {
font-size:16px;
font-weight: 700;
line-height: 1.4em;
font-family: var(--font-en);
color:var(--color-white);
letter-spacing: 0px;
margin-bottom: 0px;
text-shadow:0px 2px 5px rgba(0,0,0,0.8);
}

#slidemm {
width:100%;
height: auto;
display: block;
}

/* Slider */
.cycle-slideshow, .cycle-slideshow div, .cycle-slideshow div img {
width:100%;
height: auto;
display: block;
}

/* Slider */
#slidemm_m {
display:none;
}
.cycle-slideshow {
width:100%;
height: auto;
display: block;
}

.sectionbody {
width:100%;
height: auto;
display: block;
padding:60px 0;
margin:0 auto;
position: relative;
}

/* Title */
.sectitle {
width:100%;
height: auto;
display: block;
margin:0 auto 30px;
text-align:center;
}
.sectitle h2 {
font-size:26px;
font-weight: 400;
line-height: 1em;
text-align: center;
font-family: var(--font-en);
color:var(--color-primary);
letter-spacing: 0px;
margin-bottom: 10px;
}
.sectitle p {
font-size:14px;
font-weight: 400;
line-height: 1em;
text-align: center;
color:var(--color-black);
letter-spacing: 0px;
}

/* News */
.nwsection {
width:100%;
height:auto;
display: block;
padding:60px 5%;
margin:0 auto;
}


/* Intro */
.intbody {
width:100%;
height:auto;
display: block;
position: relative;
}
.intcc01 {
width:100%;
height:auto;
display: block;
position: relative;
padding:50px 5% 50px 5%;
background-image: url("../img/index/introbg.jpg");
background-position: right top;
background-repeat: no-repeat;
background-size: 80% auto;
margin-bottom: 20px;
}
.int02 {
width:55%;
height: auto;
display: block;
}
.int02 .int02cc {
width:100%;
height: auto;
display: block;
background-color: #fff;
padding:30px;
}
.int02 h2 {
font-size:30px;
color:var(--color-primary);
font-weight: 100;
line-height: 1.4em;
letter-spacing: 0px;
margin-bottom:20px;
}
.int02 p {
color:var(--color-black);
line-height: 2em;
margin-bottom: 0em;
}

.intcc02 {
width:100%;
height:auto;
display: block;
position: relative;
padding:50px 5% 50px 5%;
background-image: url("../img/index/introbg2.jpg");
background-position: left top;
background-repeat: no-repeat;
background-size: 80% auto;
}
.int04 {
width:55%;
height: auto;
display: block;
margin-left: 45%;
}
.int04 .int04cc {
width:100%;
height: auto;
display: block;
background-color: #fff;
padding:30px;
}
.int04 h2 {
font-size:30px;
color:var(--color-primary);
font-weight: 100;
line-height: 1.4em;
letter-spacing: 0px;
margin-bottom:20px;
}
.int04 p {
color:var(--color-black);
line-height: 2em;
margin-bottom: 0em;
}


/* Stock list */
.stocklist {
width:100%;
height:auto;
display:block;
margin:0 auto;
position: relative;
padding:80px 5%;
padding-top: 40px;
}
.stockmm {
width:100%;
height:auto;
display:block;
}



/* Company */
.companymm {
  width:100%;
  height:auto;
  display: block;
  position: relative;
}
.mapmm, .mapmm iframe {
  width:100%;
  height: 400px;
  display: block;
}
.mapmm iframe {
  width:100%;
  height: 400px;
  display: block;
}
.addressmm {
width:100%;
height: auto;
display: block;
padding:0px 5% 50px;
}
.adrcc {
width:100%;
height: auto;
display: block;
text-align: center;
margin:0 auto;
}
.adrcc h2 {
  width:100%;
  height: auto;
  display: block;
  padding-top:80px;
  font-size:14px;
  color:var(--color-primary);
  margin-bottom: 15px;
  background-image: url(../img/header/logo.png);
  background-repeat: no-repeat;
  background-position: center top;
  background-size:auto 80px;
}
.adrcc p {
  line-height: 2em;
  margin-bottom: 0px;
}
.adrcc p br {
  display:none;
}

}

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

/*TopSection*/
.topsection {
width:100%;
height: auto;
display: block;
position: relative;
top:120px;
}
.hrcov {
width:100%;
height:  100%;
min-height: 100%;
display: block;
position: absolute;
top:0;
left:0%;
z-index:1200;
/*
background-image: url(../img/index/hrcov.png);
    background-repeat: no-repeat;
    background-position: 0 0;
    background-size: 100% auto;
    */


}
.topcov {
width:100%;
height:  100%;
min-height: 100%;
display: block;
position: absolute;
top:0;
left:0%;
z-index:1100;
background-image: url(../img/index/slidecov.png);
    background-repeat: no-repeat;
    background-position: 0 bottom;
    background-size: 100% auto;

}
.toptxt {
width:90%;
height:  100%;
min-height: 100%;
display: block;
position: absolute;
top:0;
left:5%;
z-index:1700;
padding:20% 10% 0 0;
}
.toptxt h2 {
font-size:60px;
font-weight: 700;
line-height: 1.4em;
color:var(--color-white);
font-style: italic;
letter-spacing: 0px;
margin-bottom: 20px;
text-shadow:0px 2px 5px rgba(0,0,0,0.8);
}
.toptxt p {
font-size:16px;
font-weight: 400;
line-height: 1.4em;
color:var(--color-white);
font-family: var(--font-en);
letter-spacing: 0px;
margin-bottom: 0px;
text-shadow:0px 2px 5px rgba(0,0,0,0.8);
}

#slidemm {
width:100%;
height: auto;
display: block;
}

/* Slider */
.cycle-slideshow, .cycle-slideshow div, .cycle-slideshow div img {
width:100%;
height: auto;
display: block;
}

/* Slider */
#slidemm_m {
display:none;
}
.cycle-slideshow {
width:100%;
height: auto;
display: block;
}

.sectionbody {
width:100%;
height: auto;
display: block;
padding:60px 0;
margin:0 auto;
position: relative;
}

/* Title */
.sectitle {
width:100%;
height: auto;
display: block;
margin:0 auto 30px;
text-align:center;
}
.sectitle h2 {
font-size:26px;
font-weight: 400;
line-height: 1em;
text-align: center;
font-family: var(--font-en);
color:var(--color-primary);
letter-spacing: 0px;
margin-bottom: 10px;
}
.sectitle p {
font-size:14px;
font-weight: 400;
line-height: 1em;
text-align: center;
color:var(--color-black);
letter-spacing: 0px;
}

/* News */
.nwsection {
width:100%;
height:auto;
display: block;
padding:0px 5% 60px;
margin:0 auto;
}


/* Intro */
.intbody {
width:100%;
height:auto;
display: block;
position: relative;
margin-bottom: 100px;
}
.intcc01 {
width:100%;
height:auto;
display: block;
position: relative;
padding:100px 5% 100px 5%;
background-image: url("../img/index/introbg.jpg");
background-position: right top;
background-repeat: no-repeat;
background-size: 60% auto;
margin-bottom: 20px;
}
.int02 {
width:45%;
height: auto;
display: block;
}
.int02 .int02cc {
width:100%;
height: auto;
display: block;
background-color: #fff;
padding:50px;
}
.int02 h2 {
font-size:40px;
color:var(--color-primary);
font-weight:100;
line-height: 1.4em;
letter-spacing: 0px;
margin-bottom:20px;
}
.int02 p {
color:var(--color-black);
line-height: 2em;
margin-bottom: 0em;
}

.intcc02 {
width:100%;
height:auto;
display: block;
position: relative;
padding:100px 5% 100px 5%;
background-image: url("../img/index/introbg2.jpg");
background-position: left top;
background-repeat: no-repeat;
background-size: 60% auto;
margin-bottom: 20px;
}
.int04 {
width:45%;
height: auto;
display: block;
margin-left: 50%;
}
.int04 .int04cc {
width:100%;
height: auto;
display: block;
background-color: #fff;
padding:50px;
}
.int04 h2 {
font-size:40px;
color:var(--color-primary);
font-weight:100;
line-height: 1.4em;
letter-spacing: 0px;
margin-bottom:20px;
}
.int04 p {
color:var(--color-black);
line-height: 2em;
margin-bottom: 0em;
}


/* Stock list */
.stocklist {
width:100%;
height:auto;
display:block;
margin:0 auto;
position: relative;
padding-top: 140px;
}
.stockmm {
width:100%;
height: auto;
display: block;
padding:0px 5% 50px 5%;
margin:0 auto 0px;
}



/* Company */
.companymm {
  width:100%;
  height:auto;
  display: block;
  position: relative;
}
.mapmm, .mapmm iframe {
  width:100%;
  height: 500px;
  display: block;
}
.mapmm iframe {
  width:100%;
  height: 500px;
  display: block;
}
.addressmm {
width:100%;
height: auto;
display: block;
padding:0px 5% 50px;
}
.adrcc {
width:100%;
height: auto;
display: block;
text-align: center;
margin:0 auto;
}
.adrcc h2 {
  width:100%;
  height: auto;
  display: block;
  padding-top:80px;
  font-size:14px;
  font-weight: 400;
  color:var(--color-primary);
  margin-bottom: 15px;
  background-image: url(../img/header/logo.png);
  background-repeat: no-repeat;
  background-position: center top;
  background-size:auto 80px;
}
.adrcc p {
  line-height: 2em;
  margin-bottom: 0px;
}
.adrcc p br {
  display:none;
}

}


#slidemm .cycle-slide img {
  width: 100%;
  height: auto;
  transform: scale(1.2);
  animation: zoomOut 5s ease-in-out forwards;
  object-fit: cover;
}

@keyframes zoomOut {
  0% {
    transform: scale(1.2);
  }
  100% {
    transform: scale(1);
  }
}