main {overflow-x: hidden; font-family: 'Rajdhani', sans-serif, 'Microsoft JhengHei', Arial;}
main h1 {font-size: 3rem; line-height: 3rem; padding-top: 10px;}
main p {font-size: 1.18rem; font-weight: 500; line-height: 1.8; margin: 0;}

main section:not(.section-header, .section-nv, .section-performance) {padding: 60px 0;}
main .section-header img {width: 100%;}
main .section-performance img {max-width: 90%; transform: scale(1); transition: .2s; margin-top: 15px;}
main .section-performance img:hover {transform: scale(1.04);}
main .section-performance .row p {text-align: center; line-height: 1.4; margin-top: 10px; white-space: nowrap;}
main .section-performance .products-3080 {max-width: 1000px; margin: 0 auto;}
main .section-performance .products-3070 {max-width: 1000px; margin: 0 auto; display: none;}
main .section-forum .row .col-12 img {max-width: 100%; display: block; margin: auto;}
main .section-presentation {padding-top: 0;}
main .section-nv .row:nth-child(1) {z-index: 1;}
main .section-nv > div > div.row.flex-center > div:nth-child(1) {margin-right: -10rem;}
main .section-nv .nvFont1 {font-weight: 400; font-size: 1.4rem !important; line-height: 2.4rem;}
main .section-nv .nvFont2 {font-weight: 600; font-size: 1.8rem !important; line-height: 1.8rem;}
main .section-nv .row.flex-center .col-6:nth-child(2) img {transform: scale(1.4);}

.slideshow {width: 100%; background: linear-gradient(to bottom, rgba(0,0,0,1) 0%,rgba(255,255,255,0.2) 100%); padding: 3em 5em;}
.slideshow .slick-dots {left: 0; bottom: 30px;}
.slideshow .slick-dots li button::before {font-size: 45px; height: 15px; width: 15px; line-height: 15px; text-align: center; left: 50%; top: 50%; transform: translate(-50%,-52%); vertical-align: middle;}
.slideshow .slick-dots li.slick-active button:before {color: white;}
.slideshow .slick-dots li button:before {color: white;}
.slideshow .item-slick {width: 100%; display: flex !important; justify-content: flex-start; align-items: center; flex-direction: row;}
.slideshow .item-slick .content-item:nth-child(1) {width: 100%; height: 100%; display: contents;}
.slideshow .item-slick .content-item:nth-child(2) {margin-left: 30px;}
.slideshow .item-slick .content-item h1 {font-size: 2.0rem; line-height: 1.1; margin-top: 0.4rem;}
.slideshow .item-slick .content-item p {font-size: 1.0rem; line-height: 1.3; margin-top: 0.6rem;}
.slideshow .item-slick .content-item img {width: 250px; height: 250px; margin: 0;}
.slideshow .slick-current {padding-bottom: 0px;}
.slideshow .slick-arrow {position: absolute; z-index: 3;}
.slideshow .slick-next, .slideshow .slick-prev {width: 30px; height: 30px; border-radius: 50%;}
.slideshow .slick-next {right: 5px;}
.slideshow .slick-prev {left: 5px;}
.slideshow .slick-list {width: 95%; text-align: center; margin-right: auto; margin-left: auto;}
.slideshow .slick-prev:before, .slideshow .slick-next:before {color: #626262; font-size: 30px;}

main .slick-dotted.slick-slider {margin-bottom: 0px;}
main .slider-precision ul {bottom: 0%;}
main .slider-precision ul > li {height: 15px; width: 15px; line-height: 15px; text-align: center; background-color: #666;}
main .slider-precision li button {height: 15px; width: 15px; line-height: 15px; text-align: center;}
main .slider-precision .slick-dots li button::before {font-size: 45px; height: 15px; width: 15px; line-height: 15px; text-align: center; left: 50%; top: 50%; transform: translate(-50%,-52%); vertical-align: middle;}
main .slider-precision .slick-track {width: 100%;}
main .slider-precision .slick-current {padding-bottom: 0px;}
main .slider-precision .slick-arrow {position: absolute; z-index: 3;}
main .slider-precision .slick-next, main .slider-precision .slick-prev {width: 30px; height: 30px; border-radius: 50%;}
main .slider-precision .slick-next {right: 5px;}
main .slider-precision .slick-prev {left: 5px;}
main .slider-precision .slick-list {width: 95%; text-align: center; margin-right: auto; margin-left: auto;}
main .slider-precision .slick-prev:before, main .slider-precision .slick-next:before {color: #626262; font-size: 30px;}

.flex-center {display: flex; align-items: center; justify-content: center;}
.black-box {background-color: #000000ab; padding: 2rem;}
.text-center {text-align: center;}
.text-left {text-align: left;}
.btn-soon {text-decoration: none; color: #FFF; background-color: #818181;	letter-spacing: 1.5px; font-size: 17px;	padding: 12px 25px;	border-radius: 5px;	-moz-border-radius: 5px; -webkit-border-radius: 5px; border: 1px solid rgba(0,0,0,0.3);	border-bottom-width: 3px;	text-shadow: 1px 1px 2px rgba(0,0,0,0.5); cursor: pointer;}
.btn-soon:hover:not(.btn-soon.ac) {background-color: #6c6c6c;	border-color: rgba(0,0,0,0.5);}
.ac {background-color: #3e3e3e; border-color: rgba(0,0,0,0.9);}
.uc {text-transform: uppercase;}
.comingSoon {font-size: 5rem; line-height: 0.9; margin: 3rem auto -4rem;}
footer p {margin-bottom: auto;}

main .section-icx3 .scontainer {max-width: 1600px;}
.explosion {width: 100%; padding: 5px 0rem 50px 0rem; overflow: hidden; box-sizing: border-box; transition: 0.5s; height: initial;}
.explosion * {box-sizing: border-box;}
.explosion-box {width: 100%;}
.explosion-box p, .explosion-box table {width: 70%; margin-right: auto; margin-left: auto; text-align: center; color: #eee; transition: 1s;}
.explosion-box p {width: 70%; max-width: 850px; margin-right: auto; margin-left: auto; min-height: 100px; margin-bottom: 50px; padding: 10px; position: relative; z-index: 5;	font-size: 1.15rem;}
.explosion-box table {width: 100%; border-collapse: collapse; border: solid 1px #444;}
.explosion-box table tr {border-bottom: solid 1px #444;}
.explosion-box table td {padding: 10px; border-left: solid 1px #444; text-align: left;}
.explosion-box table th {padding: 10px 20px; font-size: 1.6rem;}

.pictures {position: relative; margin-right: auto; margin-left: auto; width: 100%; height: 470px; font-size: 1.15rem;}
.pictures .pic {width: 26%; display: inline-block; vertical-align: top; position: absolute; transition: 1.5s; transform-origin: center;}
.pictures .pic img {transition: 1s; filter: brightness(1); transform: scale(1); width: 100%;}
.pictures .number {border: solid 1.2px; width: 30px; height: 30px; text-align: center; border-radius: 50%; color: #5e78eb; font-size: 1.25rem; line-height: 27px;}
.pictures ul {margin: 0px; padding: 0px; height: 100%; position: absolute; left: 31%; top: -33%;}
.pictures .line {height: 45%; border-left: solid 2px #5e78eb;}
.pictures .description {color: #eee; font-weight: bold; cursor: pointer; color: #fff; background-color: rgba(0, 0, 0, 0.8); padding: 2px 8px; font-size: 13px; line-height: 16px;}
.pictures .description pre {white-space: pre-wrap;}
.pictures .data {padding: 8px; color: #fff; position: absolute; width: 500px;  top: -40%; background-color: #5e78eb;}

.bombIcon1 {position: absolute; width: 45px; top: -1px; left: -33px;}
.bombIcon2 {position: absolute; width: 45px; top: -1px; left: -33px;}
.bombIcon3 {position: absolute; width: 45px; top: -1px; left: -33px;}
.bombIcon4 {position: absolute; width: 45px; top: -1px; left: -33px;}
.bombIcon5 {position: absolute; width: 45px; top: -1px; left: -33px;}
.bombIcon6 {position: absolute; width: 45px; top: -1px; left: -33px;}
.bombIcon7 {position: absolute; width: 45px; top: -1px; left: -33px;}

@media (min-width: 1251px) {
  main .section-icx3 {background: center / cover no-repeat url("./icx_bg.jpg");}
  main .icx-icons {max-width: 240px;}
}
@media (max-width: 1200px) {
  .pictures ul {top: -45%;}
  .explosion {padding-top: 0px;}
}
@media (max-width: 1000px) {
  main .section-nv > div > div.row.flex-center > div:nth-child(1) {margin-right: -2rem;}
  .pictures {margin-bottom: 0px;}
  .pictures .pic {width: 30%;}
  .pictures .line {height: 70%;}
  .pictures ul {left: 80%; top: -13%;}
  .explosion-box {margin-top: 0px; padding-bottom: 0px; background: radial-gradient(50% 21%, 75% 30%, #ccc 0%, #000000 70%); background: -moz-radial-gradient(50% 21%, 75% 30%, #ccc 0%, #000000 70%); background: -webkit-radial-gradient(50% 21%, 75% 30%, #ccc 0%, #000000 70%); background: -o-radial-gradient(50% 21%, 75% 30%, #ccc 0%, #000000 70%); background: -ms-radial-gradient(50% 21%, 75% 30%, #ccc 0%, #000000 70%);}
  .bombIcon1, .bombIcon2, .bombIcon3, .bombIcon4, .bombIcon5, .bombIcon6, .bombIcon7 {display: none;}
}
@media (max-width: 800px) {
  .flex-center {display: block;}
  main .section-nv > div > div.row.flex-center > div:nth-child(1) {margin-right: 0rem;}
  main .section-nv > div > div.row.flex-center > div:nth-child(2) > img {width: 75%;}
  main .section-nv .nvFont1 {line-height: 2.0rem; text-align: center;}
  main .section-nv .nvFont2 {line-height: 1.5rem; text-align: center;}
  .slideshow .item-slick {display: block !important;}
  .slideshow .item-slick .content-item h1 {font-size: 1.6rem; line-height: 1.1; margin-top: 0.4rem; letter-spacing: -1.3px;}
  .slideshow .item-slick .content-item p {font-size: 1.0rem; line-height: 1.2; margin-top: 0.6rem;}
  .slideshow .item-slick .content-item img {margin: 0 auto;}
  main .section-performance .col-4 {width: 46%;}
  main .section-performance .row p {margin: 10px 30px;}
  main .section-nv .row.flex-center .col-6:nth-child(2) img {transform: scale(1.0);}
  .comingSoon {font-size: 3rem; line-height: 1.0; margin: 3rem auto -2rem;}
}
@media (max-width: 550px) {
  main section:not(.section-header, .section-performance) {padding: 30px 0;}
  main img.icx3-img {width: 75%;}
  .slideshow {padding: 3em 1em;}
  .explosion {padding: 0px 2rem 0px 2rem;}
  .explosion-box {background: radial-gradient(50% 21%, 75% 25%, #ccc 0%, #000000 70%); background: -moz-radial-gradient(50% 21%, 75% 25%, #ccc 0%, #000000 70%); background: -webkit-radial-gradient(50% 21%, 75% 25%, #ccc 0%, #000000 70%); background: -o-radial-gradient(50% 21%, 75% 25%, #ccc 0%, #000000 70%); background: -ms-radial-gradient(50% 21%, 75% 25%, #ccc 0%, #000000 70%); padding-top: 100px;}
  .explosion-box table {margin-top: 10px; font-size: 1.15rem; line-height: 1.4rem;}
  .pictures .pic {width: 60%;}
  .pictures ul {left: 90%;}
}
@media (max-width: 450px) {
  main .slider-precision ul.slick-dots {bottom: 0px !important;}
}