@charset "UTF-8";

.newsAndTopics .inner { font-size:16px;}
.products .productsArea { font-size:18px;}
.products .productsArea > .exp-01 { font-size:18px;}
.mainVisual-01 img.spacer-01,
.mainVisual-01 .pc > p.visual-02,
.mainVisual-01 .sp > p.visual-02 { filter:alpha(opacity=0); -webkit-opacity:0; -moz-opacity:0; -ms-opacity:0; -o-opacity:0; opacity:0;}

@-webkit-keyframes mainVisual_01 {
0% { filter:blur(8px); opacity:0;}
50% { filter:blur(8px); opacity:1;}
100% { filter:blur(0); opacity:1;}
}

@-moz-keyframes mainVisual_01 {
0% { filter:blur(8px); opacity:0;}
50% { filter:blur(8px); opacity:1;}
100% { filter:blur(0); opacity:1;}
}

@-ms-keyframes mainVisual_01 {
0% { filter:blur(8px); opacity:0;}
50% { filter:blur(8px); opacity:1;}
100% { filter:blur(0); opacity:1;}
}

@-o-keyframes mainVisual_01 {
0% { filter:blur(8px); opacity:0;}
50% { filter:blur(8px); opacity:1;}
100% { filter:blur(0); opacity:1;}
}

@keyframes mainVisual_01 {
0% { filter:blur(8px); opacity:0;}
50% { filter:blur(8px); opacity:1;}
100% { filter:blur(0); opacity:1;}
}

body { background-position:left top 100vh;}
.mainVisual-01 { background-position:center center; background-repeat:no-repeat; background-size:cover; /*background-image:url("../images/top/mainVisual-02.png"); */width:100%; height:100vh;}
.mainVisual-01 .pc,
.mainVisual-01 .sp,
.mainVisual-01 .pc > p,
.mainVisual-01 .sp > p { background-position:center center; background-repeat:no-repeat; background-size:cover; left:0; top:0; width:100%; height:100%;}
.mainVisual-01 img.spacer-01 { display:none; float:left; width:100%; height:auto; float:left;}
.mainVisual-01 .pc > p,
.mainVisual-01 .sp > p { position:absolute;}
.mainVisual-01 .pc > p.visual-01,
.mainVisual-01 .sp > p.visual-01 { left:100%;}
.mainVisual-01 .pc > p.visual-01.set,
.mainVisual-01 .sp > p.visual-01.set { left:0;}
.mainVisual-01 .pc > p.visual-02,
.mainVisual-01 .sp > p.visual-02 { -webkit-filter:blur(8px); -moz-filter:blur(8px); -ms-filter:blur(8px); -o-filter:blur(8px); filter:blur(8px);}
.mainVisual-01 .pc > p.visual-02.set,
.mainVisual-01 .sp > p.visual-02.set { -webkit-animation-name:mainVisual_01; -moz-animation-name:mainVisual_01; -ms-animation-name:mainVisual_01; -o-animation-name:mainVisual_01; animation-name:mainVisual_01; -webkit-animation-duration:1s; -moz-animation-duration:1s; -ms-animation-duration:1s; -o-animation-duration:1s; animation-duration:1s; -webkit-animation-iteration-count:1; -moz-animation-iteration-count:1; -ms-animation-iteration-count:1; -o-animation-iteration-count:1; animation-iteration-count:1; -webkit-animation-timing-function:linear; -moz-animation-timing-function:linear; -ms-animation-timing-function:linear; -o-animation-timing-function:linear; animation-timing-function:linear; -webkit-animation-fill-mode:forwards; -moz-animation-fill-mode:forwards; -ms-animation-fill-mode:forwards; -o-animation-fill-mode:forwards; animation-fill-mode:forwards; -webkit-animation-delay:0; -moz-animation-delay:0; -ms-animation-delay:0; -o-animation-delay:0; animation-delay:0; -webkit-animation-direction:normal; -moz-animation-direction:normal; -ms-animation-direction:normal; -o-animation-direction:normal; animation-direction:normal;}
.mainVisual-01 .pc { background-image:url("../images/top/mainVisualBg-pc.jpg"); left:100%;}
.mainVisual-01 .pc > p.visual-01 { -webkit-transition:left 1s ease-in-out; -moz-transition:left 1s ease-in-out; -ms-transition:left 1s ease-in-out; -o-transition:left 1s ease-in-out; transition:left 1s ease-in-out;}
.mainVisual-01 .pc .visual-01 { background-image:url(../images/top/mainVisual-01-pc.png);}
.mainVisual-01 .pc .visual-02 { background-image:url(../images/top/mainVisual-02-pc.png);}
.mainVisual-01 .pc .visual-03 { background-image:url(../images/top/mainVisual-03-pc.png?2021011201);}
.mainVisual-01 .sp { background-image:url("../images/top/mainVisualBg-sp.jpg");}
.mainVisual-01 .sp > p.visual-01 { -webkit-transition:left 0.7s ease-in-out; -moz-transition:left 0.7s ease-in-out; -ms-transition:left 0.7s ease-in-out; -o-transition:left 0.7s ease-in-out; transition:left 0.7s ease-in-out;}
.mainVisual-01 .sp .visual-01 { background-image:url(../images/top/mainVisual-01-sp.png);}
.mainVisual-01 .sp .visual-02 { background-image:url(../images/top/mainVisual-02-sp.png);}
.mainVisual-01 .sp .visual-03 { background-image:url(../images/top/mainVisual-03-sp.png?2021011102);}
.newsAndTopics { padding-top:1.1rem; padding-bottom:1.6rem; width:100%; overflow:hidden;}
.newsAndTopics .inner { max-width:1100px; width:90%; margin-left:auto; margin-right:auto; position:relative; padding-top:0.5rem;}
.newsAndTopics .inner * { font-size:1em;}
.newsAndTopics .ttl-01 { width:18.18182%; background:#1f1f1f; position:absolute; left:0; top:0;}
.newsAndTopics .ttl-01 img { width:100%; height:auto; float:left;}
.newsAndTopics .img-01 { width:494px; left:50%; top:-40px; -webkit-transform:translateX(430px); -moz-transform:translateX(430px); -ms-transform:translateX(430px); -o-transform:translateX(430px); transform:translateX(430px);}
.newsAndTopics .img-01 img { width:100%; height:auto; float:left;}
.newsAndTopics .listArea { width:88.18182%; min-height:1.8rem; padding-top:2.5em; padding-bottom:2.5em; margin-left:auto; border-width:1px; border-color:#ccc; border-style:solid; letter-spacing:0.05em; display:flex; flex-direction:column; justify-content:center;}

body.ie .newsAndTopics .listArea { min-height:auto; height:1.8rem; /*height:auto; */}
.newsAndTopics .listArea .list { display:flex; justify-content:space-between; width:70%; margin-top:0.6em; margin-left:17%;}
.newsAndTopics .listArea .list:first-of-type { margin-top:0;}
.newsAndTopics .listArea .list time { width:6em; display:block;}
.newsAndTopics .listArea .list .ttl { width:calc(100% - 6em - 1.6em);}
.products { width:100%;}
.products .ttl-01 { width:calc(1300px + (100vw - 1600px) / 2); background-image:url("../images/top/products-ttlBg.png"); background-position:right center; background-repeat:no-repeat; background-size:contain; background-color:#006835;}
.products .ttl-01 img { width:1000px; float:right;}
.products .productsArea { max-width:1600px; width:100%; margin-left:auto; margin-right:auto; margin-top:1rem; display:flex; flex-wrap:wrap;}
.products .productsArea * { font-size:1em;}
.products .productsArea > * { width:30.625%; margin-top:2.3em;}
.products .productsArea > *:nth-child(1),
.products .productsArea > *:nth-child(2),
.products .productsArea > *:nth-child(3) { margin-top:0;}
.products .productsArea > *:nth-child(3n-2) { margin-left:2.25%;}
.products .productsArea > *:nth-child(3n-1) { margin-left:1.8125%;}
.products .productsArea > *:nth-child(3n) { margin-left:1.8125%;}
.products .productsArea > .exp-01 * { color:#fff;}
.products .productsArea > .exp-01 .txt-01 { background:#1f1f1f;}
.products .productsArea > .exp-01 .txt-01 > strong { display:flex; align-items:center; justify-content:center; text-align:center; width:95%; height:100%; position:absolute; left:2.5%; top:0; font-weight:300; letter-spacing:0.1em; line-height:2;}
.products .productsArea > .exp-01 .txt-01 > img { width:100%; height:auto; float:left;}
.products .productsArea > figure > img { width:100%; height:auto; float:left;}
.products .productsArea > figure figcaption { clear:both; letter-spacing:0.1em; padding-top:0.35em;}

@media (max-width:1600px) {
.newsAndTopics .img-01 { width:30.875%; -webkit-transform:translateX(87.5%); -moz-transform:translateX(87.5%); -ms-transform:translateX(87.5%); -o-transform:translateX(87.5%); transform:translateX(87.5%);}
.newsAndTopics .listArea .list { width:68%;}
}

@media (max-width:1550px) {
.newsAndTopics .listArea .list { width:66.5%;}
}

@media (max-width:1500px) {
.newsAndTopics .img-01 { top:-0.05rem;}
.newsAndTopics .listArea .list { width:65.5%;}
}

@media (max-width:1450px) {
.newsAndTopics .listArea .list { width:64.5%;}
}

@media (max-width:1400px) {
.newsAndTopics .listArea .list { width:63%;}
}

@media (max-width:1350px) {
.newsAndTopics .img-01 { top:0.25rem;}
.newsAndTopics .listArea .list { width:62%;}
}

@media (max-width:1300px) {
.newsAndTopics .listArea .list { width:60.5%;}
.products .productsArea > * { margin-top:1.9em;}
}

@media (max-width:1250px) {
.newsAndTopics .listArea .list { width:59.5%;}
}

@media (max-width:1222px) {
.products .ttl-01 { width:90.91653%;}
.products .ttl-01 img { width:90.009%;}
}

@media (max-width:1000px) {
.newsAndTopics .img-01 { width:35.50625%; -webkit-transform:translateX(68.75%); -moz-transform:translateX(68.75%); -ms-transform:translateX(68.75%); -o-transform:translateX(68.75%); transform:translateX(68.75%);}
.newsAndTopics .listArea .list { margin-left:15.5%; width:58.5%;}
}

@media (max-width:850px) {
.newsAndTopics .ttl-01 { width:21.81818%; top:-0.3rem;}
.newsAndTopics .listArea .list { margin-left:18%; width:56.5%;}
.products .ttl-01 img { margin-right:calc((108.0108% - 90.009%) / 2 * -1); width:108.0108%;}
}

@media (max-width:768px) {
.globalFooter { margin-top:0.4rem;}
.newsAndTopics { padding-top:0.567rem; padding-bottom:1.008rem;}
.newsAndTopics .inner { width:100%; margin-right:0; margin-left:0;}
.newsAndTopics .img-01 { top:0.15rem; width:37.05%; -webkit-transform:translateX(65.625%); -moz-transform:translateX(65.625%); -ms-transform:translateX(65.625%); -o-transform:translateX(65.625%); transform:translateX(65.625%);}
.newsAndTopics .listArea { min-height:1.3rem; border-width:1px 0 1px 1px;}
body.ie .newsAndTopics .listArea { min-height:1.134rem;}
.newsAndTopics .listArea .list { margin-left:17.5%; width:53%;}
.products .productsArea { width:90%; margin-top:0.63rem; margin-bottom:auto; justify-content:space-between;}
.products .productsArea > * { width:calc(95.5% / 2);}
.products .productsArea > *:nth-child(3) { margin-top:1.9em;}
.products .productsArea > *:nth-child(2n-1),
.products .productsArea > *:nth-child(2n) { margin-left:0;}
}

@media (max-width:650px) {
.newsAndTopics .ttl-01 img { -webkit-transform:translateY(-49%); -moz-transform:translateY(-49%); -ms-transform:translateY(-49%); -o-transform:translateY(-49%); transform:translateY(-49%);}
.newsAndTopics .ttl-01 { padding-top:0.45rem; height:0.9rem; width:25.45455%; top:-0.22rem;}
.newsAndTopics .img-01 { top:0.25rem;}
.newsAndTopics .listArea { width:95%;}
.newsAndTopics .listArea .list { margin-left:7%; width:64%; display:block;}
.newsAndTopics .listArea .list time { width:100%;}
.newsAndTopics .listArea .list .ttl { margin-top:0.15em; width:100%;}
.products .ttl-01 { background-position:right -20% center;}
.products .ttl-01 img { margin-right:calc((126.0126% - 90.009%) / 2 * -1); width:126.0126%;}
}

@media (max-width:500px) {
.newsAndTopics .ttl-01 { padding-top:0.5rem; height:1rem; top:-0.3rem;}
}

@media (max-width:450px) {
.newsAndTopics .ttl-01 { width:30.90909%;}
.newsAndTopics .img-01 { top:0.6rem;}
.products .ttl-01 { background-position:right -45% center;}
.products .ttl-01 img { margin-right:calc((153.0153% - 90.009%) / 2 * -1); width:153.0153%;}
.products .productsArea > .exp-01 .txt-01 > strong { letter-spacing:0.05em;}
}

@media (max-width:400px) {
.newsAndTopics .img-01 { top:0.7rem;}
.products .productsArea > * { margin-top:1.5em;}
.products .productsArea > *:nth-child(3) { margin-top:1.5em;}
.products .productsArea > .exp-01 .txt-01 > strong { width:85%; left:calc(15% / 2); text-align:left; /* 均等配置-> */text-align:justify; text-justify:inter-ideograph; word-break:break-all; /* <-均等配置 */}
.products .productsArea > .exp-01 .txt-01 > strong br { display:none;}
.products .productsArea > .exp-01 .txt-01 > strong { -webkit-transform:scale(0.9); -moz-transform:scale(0.9); -ms-transform:scale(0.9); -o-transform:scale(0.9); transform:scale(0.9); width:94.44444%; line-height:1.8; -webkit-transform-origin:left center; -moz-transform-origin:left center; -ms-transform-origin:left center; -o-transform-origin:left center; transform-origin:left center;}
.products .productsArea > figure figcaption { line-height:1.6; letter-spacing:0.05em; padding-top:0.28em;}
}

@media (max-width:350px) {
.newsAndTopics .inner { font-size:10px;}
.products .productsArea,
.products .productsArea > .exp-01 { font-size:10px;}
.newsAndTopics .img-01 { top:auto; bottom:0;}
.newsAndTopics .listArea .list { width:66%;}
.products .productsArea > * { margin-top:1.2em;}
.products .productsArea > *:nth-child(3) { margin-top:1.2em;}
.products .productsArea > .exp-01 .txt-01 > strong { line-height:1.7;}
.products .productsArea > figure figcaption { padding-top:0.22em;}
}

@media (min-width:769px) and (max-width:1222px) {
.newsAndTopics .inner { font-size:calc(12px + ((1vw - 7.68px) * 0.8811));}
.products .productsArea { font-size:calc(13px + ((1vw - 7.68px) * 1.1013));}
.products .productsArea > .exp-01 { font-size:calc(11px + ((1vw - 7.68px) * 1.5419));}
}

@media (min-width:351px) and (max-width:768px) {
.newsAndTopics .inner { font-size:calc(10px + ((1vw - 3.5px) * 0.4785));}
.products .productsArea,
.products .productsArea > .exp-01 { font-size:calc(10px + ((1vw - 3.5px) * 0.9569));}
}

@media (min-aspect-ratio:4 / 5) { .mainVisual-01 { /*background-image:url("../images/top/mainVisual-01.png"); */}
.mainVisual-01 .pc { left:0;}
.mainVisual-01 .sp { left:100%;}
}

@media (max-aspect-ratio:1 / 3) { .mainVisual-01 { height:auto;}
.mainVisual-01 img.spacer-01 { display:block;}
}