/* CSS Document */

body {	-webkit-text-size-adjust:100%; font-family: 'Lato', sans-serif !important; overflow-x: hidden; position: relative; background: #000;}
img {	border:0; }

/* Reset ================================================================================= */

a { text-decoration:none; transition: all 0.4s ease-out 0s; }
a:hover { text-decoration:none; }

* { box-sizing: border-box;}

.content-Box { max-width:1300px; width: 100%; margin:0 auto; text-align:left; position:relative; clear:both;}

#content { font-size: 16px; line-height:1.5; color: #fff; letter-spacing: 0; font-weight: 400; padding-top: 0px; position: relative; background: #1b1b1b;}
#content p{ margin-bottom: 30px; margin-top: 0; font-size: 16px;line-height:1.5;  font-weight: 400;}
p, td, li, label { font-size: 16px;line-height:1.5;  font-weight: 400;}

.photo-fit img { object-fit: cover; width: 100%; height: 100%; position: absolute; z-index: 1; left: 0; top: 0;}

.photo {line-height: 0; height: 0; padding-bottom: 40%; overflow: hidden; position: relative; z-index: 1; margin-bottom: 0px;}
.imgCenter {position: absolute; top: 0; left: 0; right: 0; bottom: 0; line-height: 0; display: flex; flex-wrap: wrap; justify-content: center; align-items: center; z-index: 2;}
.imgCenter img {max-height: 100%;}

.main-content-bg { position: absolute; width: 100%; height: 100%; top: 0; left: 0; z-index: -3; display: flex; flex-direction: row; flex-wrap: nowrap; justify-content: space-around;}
.main-content-bg > div { background: #ededed; width: 1px;}

.demo-section { padding-left: 5%; padding-right: 5%;}

.banner { position: relative;}
.banner img { width: 100%;}
.banner-pc {}
.banner-mobile { display: none !important;}

#path { padding-top: calc(10px + 1%); padding-bottom: calc(15px + 3%);}
#path ul { margin: 0; padding: 0; }
#path li { display: inline-block; vertical-align: top; font-size: 14px; line-height: 1.2; letter-spacing: 0rem; position: relative;}
#path li:after { content:"|"; display: inline-block; padding: 0 4px;}
#path li:last-child { pointer-events: none;}
#path li:last-child:after { display: none;}
#path li a { color: #fff; }
#path li a:hover { color: #b29763;}
#path li:last-child a { color: #b29763;}

/*about*/
.title01 { border-bottom: 1px solid #b29763; line-height: 1.3; padding: 0 0 calc(10px + 1.5%) 0; margin: 0 0 calc(10px + 1.5%) 0; font-weight: 900;font-size: clamp(25px, 3.5vw, 48px);}

.aside-menu-1 { display: flex; flex-direction: row; flex-wrap: wrap; /*justify-content: space-between;*/ padding-bottom: calc(20px + 2.5%); margin: 0 -6px;}
.aside-menu-1 > a { display: block; width: calc(25% - 12px); margin: 0 6px 12px 6px; text-align: center; background: #898989; color: #fff; font-size: 16px; font-weight: 700; line-height: 1.2; padding:13px 5px;}
.aside-menu-1 > a:hover, .aside-menu-1 > a.current { background: #b29763;}

.about-section { position: relative; display: flex; flex-direction:column; flex-wrap: nowrap; padding-bottom: calc(10px + 1%);}
.about-section > div { position: relative; z-index: 2; display: flex; flex-direction:row; flex-wrap: wrap; align-items: flex-start; padding-bottom: calc(20px + 5%);}
.about-section > div > div:nth-of-type(1) { width: 36%; padding: 5% 5% 0 0;}
.about-section > div > div:nth-of-type(2) { width: 64%; background: #fff;border-radius: 0 0 60px 0; box-shadow:inset 0px -10px 0px 0 #71c7d1; }
.about-section > div:nth-child(even) > div:nth-of-type(1) { order: 2; padding: 5% 0 0 5% ;}
.about-section > div:nth-child(even) > div:nth-of-type(2) { order: 1; border-radius: 0 0 0 60px; }
.about-section > div > div:nth-of-type(2) img { width: 100%; }
.about-section:after { position: absolute; content: ""; border-radius: 150px 0 0 0; height: 760px; width: 400%; left: 0; top:35%; background: #313131; }

.about-title { font-size: clamp(25px, 3.5vw, 48px); font-weight: 700; padding-bottom: calc(20px + 3.5%); line-height: 1.2;}
.about-title span { color: #b29763; font-weight: 900;}
.about-title-2 { color: #71c7d1; font-weight: 700; line-height: 1.2; font-size:clamp(20px, 1.5vw, 28px);}

.about-data { padding: calc(15px + 2%) calc(20px + 2%) calc(20px + 2%) calc(20px + 2%); color: #000;}
.about-data { padding: calc(15px + 2%) calc(20px + 2%) calc(20px + 2%) calc(20px + 2%); color: #000;}
.about-title-3 { color: #515151; font-weight: 700; line-height: 1.2; font-size:clamp(20px, 1.5vw, 28px); padding-bottom: calc(10px + 1%);}
.about-title-3 span { color: #b29763; font-weight: 900;}

.color-yellow { color: #b29763;}

/*history*/
.history-section { display:flex; flex-direction: column; flex-wrap: nowrap; padding-bottom: calc(10px + 1%); max-width: 1160px; margin: 0 auto;}
.history-section > div { display:flex; flex-direction: row; flex-wrap: wrap; align-items: flex-start; padding-bottom: calc(25px + 5%);}
.history-section > div > div:nth-of-type(1) { width: calc(50% - 20px);}
.history-section > div > div:nth-of-type(2) { width: calc(50% + 20px);}
.history-section > div:nth-child(even) > div:nth-of-type(1) { order: 2;}
.history-section > div:nth-child(even) > div:nth-of-type(1) .history-data { text-align: right;}
.history-section > div:nth-child(even) > div:nth-of-type(1) .line-type-1:before { left: auto; right: 0;}
.history-section > div:nth-child(even) > div:nth-of-type(1) .line-type-1:after { left: auto; right: 47px;}
.history-section > div:nth-child(even) > div:nth-of-type(2) { order: 1;}
.history-year { text-align: center; color: #b29763; font-weight: 900; font-size: clamp(34px, 7vw, 100px); line-height: 1; padding:calc(25px + 2%) 0 calc(15px + 1%) 0; }
.history-data { color: #71c7d1; font-weight: 700; font-size: 18px; padding-bottom:calc(5px + 1%); }

.line-type-1 { position: relative; width: 100%; height: 2px; background: #b29763; margin: calc(10px + 1%) 0  calc(25px + 2%) 0;}
.line-type-1:before, .line-type-1:after { position: absolute; content: ""; background: #b29763; border-radius: 100%; top:50%; transform: translateY(-50%);}
.line-type-1:before { left: 0; width: 10px; height: 10px;}
.line-type-1:after { left: 47px; width: 8px; height: 8px;}

.history-content { background: #313131; box-shadow: inset 0px -10px 0px 0 #71c7d1; border-radius: 120px 0 60px 0; overflow: hidden;}
.history-content-pto { line-height:0;}
.history-content-pto img { width: 100%;}
.history-content-data { padding: calc(20px + 1%) calc(25px + 1%) calc(25px + 2%) calc(25px + 1%)}

/*products*/
.products-box { display: flex; flex-direction: row; flex-wrap: wrap; align-items: flex-start; padding-bottom: calc(20px + 5%);}
.products-box > div:nth-of-type(1) { width: 300px; }
.products-box > div:nth-of-type(2) { width: calc(100% - 300px); padding-left: 4%;}

.aside-title { border-radius: 40px 0 30px 0; background: #71c7d1; padding: calc(25px + 2%) calc(20px + 2%) calc(20px + 2%) calc(20px + 2%); font-weight: 700; color: #fff;font-size:clamp(20px, 1.5vw, 24px); line-height: 1.2; margin-bottom: 2px; }
.aside-title span { font-style: italic; font-weight: 900; color: #000000; font-size: 12px; line-height: 1; padding-bottom: 4px; display: block;}

.products-title { padding: 0 0 5px 0; margin: 0; font-size: clamp(24px, 2.2vw, 36px); line-height: 1.1; font-weight: 700;}

.line-type-2 { position: relative; width: 100%; height: 1px; background: #a0a0a0; margin: calc(15px + 1%) 0 ;}
.line-type-2b { margin: 0 ;}
.line-type-2:before { position: absolute; content: ""; background: #71c7d1; height: 3px; width:96%; left: 50%; top:50%; transform: translate(-50%, -50%);}

.new_pro {position: relative; z-index: 1; padding: 0 0 50px 0; margin: auto; max-width: 948px;}
.new_pro > .img {line-height: 0; font-size: 0; position: relative; z-index: 10;}
.new_pro > .img > img:nth-child(1) {display: block;}
.new_pro > .img > img:nth-child(2) {display: none;}
.new_pro > .lis {position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: 100;}
.ite {position: absolute; z-index: 10;}
.ite::before {content: ''; position: absolute; width: 240px; z-index: 1;}
.ite_01 {top: 65.093%; left: 29.01%;}
.ite_02 {top: 55.273%; right: 36.183%;}
.ite_03 {top: 56.91%; left: 29.114%;}
.ite_04 {top: 63.82%; right: 25.106%;}
.ite_05 {top: 55.091%; left: 48.418%;}
.ite_06 {top: 58.91%; left: 45.465%;}
.ite_07 {top: 51.82%; right: 27.638%;}
.ite_08 {top: 52.364%; left: 28.904%;}
.ite_09 {top: 59.637%; left: 37.659%;}
.ite_poi {width: 16px; height: 16px; border-radius: 50%; position: relative; z-index: 1; cursor: pointer;}
.ite_poi::before {content: ''; width: 0px; height: 0px; border-radius: 50%; background: #71c7d1; position: absolute; top: 50%; left: 50%; z-index: -10; transform: translate(-50%, -50%);}
.ite_poi::after {content: ''; width: 15px; height: 15px; border-radius: 50%; background: #71c7d1; position: absolute; top: 50%; left: 50%; z-index: -10; transform: translate(-50%, -50%);}
.ite_poi_bg {border-radius: 50%; border: 1px solid #b29763; background: #fff; position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: 50;}
.ite_poi_dot {width: 8px; height: 8px; border-radius: 50%; background: #b29763; position: absolute; top: calc(50% - 4px); left: calc(50% - 4px); z-index: 100;}
.ite_con {position: absolute; z-index: 100; width: 200px; opacity: 0; visibility: hidden; transition: all 0.4s ease-out 0s;}
.ite_01 .ite_con {top: 0; right: 30px;}
.ite_02 .ite_con {bottom: 40px; left: -5px;}
.ite_03 .ite_con {bottom: 47px; right: -10px;}
.ite_04 .ite_con {top: 10px; left: 33px;}
.ite_05 .ite_con {top: 38px; left: -87px;}
.ite_06 .ite_con {bottom: 43px; left: -5px;}
.ite_07 .ite_con {bottom: 0; left: 25px;}
.ite_08 .ite_con {bottom: 40px; right: -9px;}
.ite_09 .ite_con {top: 42px; right: -9px;}
.ite_con > .img {width: 196px; height: 140px; display: flex; flex-flow: wrap; justify-content: center; align-items: center; line-height: 0; font-size: 0; margin: 0 auto 20px auto;}
.ite_con > .img img {max-width: 100%; max-height: 100%;}
.ite_con > .tit {width: 100%; max-width: 174px; font-size: clamp(12px, 1.5vw, 18px); color: #fff; font-weight: 600; line-height: 1.33333; letter-spacing: 0; padding: 0; margin: 0 auto; position: relative; z-index: 1; transition: all 0.4s ease-out 0s;}
.ite_con > .tit::before {content: ''; width: 32px; height: 2px; background: #fff; position: absolute; top: -5px; left: 0; transition: all 0.4s ease-out 0s;}
.ite_con > a {position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: 100; font-size: 0; line-height: 0;}

@keyframes zoom15 {from{width: 15px; height: 15px; opacity: 1;}to{width: 30px; height: 30px; opacity: 0.7;}}
@-webkit-keyframes zoom15 {from{width: 15px; height: 15px; opacity: 1;}to{width: 30px; height: 30px; opacity: 0.7;}}
.zoom15 {-webkit-animation: zoom15 600ms linear infinite; animation: zoom15 600ms linear infinite;}
@keyframes zoom30 {from{width: 0px; height: 0; opacity: 1;}to{width: 30px; height: 30px; opacity: 0.7;}}
@-webkit-keyframes zoom30 {from{width: 0px; height: 0; opacity: 1;}to{width: 30px; height: 30px; opacity: 0.7;}}
.zoom30 {-webkit-animation: zoom30 1200ms linear infinite; animation: zoom30 1200ms linear infinite;}
@keyframes topmove_b5 {from{transform:translateY(0px);}25%{transform:translateY(-2.5px);}50%{transform:translateY(0);}75%{transform:translateY(2.5px);}to{transform:translateY(0);}}
@-webkit-keyframes topmove_b5 {from{transform:translateY(0px);}25%{transform:translateY(-2.5px);}50%{transform:translateY(0);}75%{transform:translateY(2.5px);}to{transform:translateY(0);}}
.topmove_b5 {-webkit-animation: topmove_b5 3000ms linear infinite; animation: topmove_b5 3000ms linear infinite;}

.ite_01:hover::before, .ite_01.pick::before {top: 0; right: 0; height: 200px;}
.ite_02:hover::before, .ite_02.pick::before {bottom: 0; left: -20px; height: 240px;}
.ite_03:hover::before, .ite_03.pick::before {bottom: 0; right: -25px; height: 240px;}
.ite_04:hover::before, .ite_04.pick::before {top: 0; left: 0; height: 200px;}
.ite_05:hover::before, .ite_05.pick::before {top: 0; left: -107px; height: 240px;}
.ite_06:hover::before, .ite_06.pick::before {bottom: 0; left: -26px; height: 230px;}
.ite_07:hover::before, .ite_07.pick::before {bottom: 0; left: 5px; height: 210px;}
.ite_08:hover::before, .ite_08.pick::before {bottom: 0; right: -20px; height: 240px;}
.ite_09:hover::before, .ite_09.pick::before {top: 0; right: -20px; height: 240px;}
.ite:hover, .pick {z-index: 3;}
.ite:hover .ite_poi::before, .pick .ite_poi::before {background: #71c7d1; -webkit-animation: zoom30 1200ms linear infinite; animation: zoom30 1200ms linear infinite;}
.ite:hover .ite_poi::after, .pick .ite_poi::after {background: #71c7d1; -webkit-animation: zoom15 600ms linear infinite; animation: zoom15 600ms linear infinite;}
.ite:hover .ite_poi .ite_poi_bg, .pick .ite_poi .ite_poi_bg {border: 1px solid #71c7d1;}
.ite:hover .ite_poi .ite_poi_dot, .pick .ite_poi .ite_poi_dot {background: #71c7d1;}
.ite:hover .ite_con, .pick .ite_con {opacity: 1; visibility: visible;}
.ite:hover .ite_con > .img, .pick .ite_con > .img {-webkit-animation: topmove_b5 2000ms linear infinite; animation: topmove_b5 2000ms linear infinite;}
.ite_con:hover > .tit {color: #71c7d1;}
.ite_con:hover > .tit::before {width: 100%; background: #71c7d1;}
@media only screen and (max-width: 980px) {
    .new_pro {max-width: 690px;}
    .ite_con {width: 160px;}
    .ite::before {width: 200px;}
    .ite_con > .img {width: 150px; height: 107px;}
    .ite_01 {top: 62%;}
    .ite_01 .ite_con {top: -20px; right: 20px;}
    .ite_01:hover::before {top: -30px; height: 160px;}
    .ite_02 {top: 53%;}
    .ite_02:hover::before, .ite_03:hover::before, .ite_08:hover::before {height: 200px;}
    .ite_03 {top: 55%;}
    .ite_04 {top: 61%;}
    .ite_04 .ite_con {top: 0; left: 0;}
    .ite_04:hover::before {height: 160px;}
    .ite_05 {top: 53%;}
    .ite_05 .ite_con {top: 20px; left: -67px;}
    .ite_05:hover::before {height: 180px;}
    .ite_06 {top: 56%;}
    .ite_06:hover::before {height: 190px;}
    .ite_07 {top: 49%;}
    .ite_07:hover::before {height: 150px;}
    .ite_08 {top: 50%;}
    .ite_09 {top: 57%;}
    .ite_09 .ite_con {top: 22px; right: -130px;}
    .ite_09:hover::before {right: -150px; height: 180px;}
}
@media only screen and (max-width: 576px) {
    .new_pro {max-width: 324px;}
    .new_pro > .img > img:nth-child(1) {display: none;}
    .new_pro > .img > img:nth-child(2) {display: block;}
    .ite_con {width: 120px;}
    .ite::before {width: 160px;}
    .ite_con > .img {width: 110px; height: 79px;}
    .ite_01 {top: 61%; left: 16%;}
    .ite_01 .ite_con {top: 20px; right: -100px;}
    .ite_01:hover::before {top: 0; right: -120px; height: 160px;}
    .ite_02 {top: 51%; right: 27%;}
    .ite_02 .ite_con {left: -51px;}
    .ite_02:hover::before {left: -70px; height: 170px;}
    .ite_03 {top: 53%; left: 16%;}
    .ite_03 .ite_con {right: -100px;}
    .ite_03:hover::before {right: -120px; height: 170px;}
    .ite_04 {top: 60%; right: 9%;}
    .ite_04 .ite_con {top: 30px; left: -110px;}
    .ite_04:hover::before {left: -130px; height: 160px;}
    .ite_05 {top: 51%; left: 47%;}
    .ite_05 .ite_con {top: 30px; left: -47px;}
    .ite_05:hover::before {left: -67px; height: 160px;}
    .ite_06 {top: 55%; left: 42%;}
    .ite_07 {top: 47%; right: 14%;}
    .ite_07 .ite_con {bottom: 30px; left: -105px;}
    .ite_07:hover::before {left: -125px;}
    .ite_08 {top: 48%; left: 15%;}
    .ite_08 .ite_con {bottom: 30px; right: -100px;}
    .ite_08:hover::before {right: -120px; height: 160px;}
    .ite_09 {top: 55%; left: 30%;}
    .ite_09 .ite_con {top: 30px; right: -100px;}
    .ite_09:hover::before {right: -120px; height: 160px;}
}

/*products-list*/
.products-list-section {padding-top: calc(10px + 1%); padding-bottom: calc(20px + 2%); margin-right: -25px; display: flex; flex-direction: row; flex-wrap: wrap;}
.products-list-section > a { width: calc(25% - 25px); margin-right: 25px; margin-bottom: 25px; }
.products-list-link { background: #313131; position: relative;border-radius: 40px 0 0 0; overflow: hidden; display: block;}
.products-list-link:after { position: absolute; content: ""; width: 100%; bottom: 0; right: 0; height: 3px; background: #71c7d1;transition: all 0.4s ease-out 0s;}
.products-list-link:hover:after { width: 0%; left: 0; }
.products-list-link:hover { transform: scale(1.03);}
.products-list-pto { padding-bottom: 68%; }
.products-list-pto img { transition: all 1.4s ease-out 0s;}
.products-list-data { padding: 18px 12px 25px 12px;}
.products-list-title { border-bottom: 1px solid #cacaca; font-weight: 700; font-size: 18px; line-height: 1.2; padding-bottom: 10px; margin-bottom: 10px;}
.products-list-btn { font-size: 14px;line-height: 1;}

#page { display: flex; flex-direction: row; flex-wrap: wrap; justify-content: center; padding:0px 0 0px 0;}
#page a { font-size: 16px; color: #fff; font-weight: 700; width: 36px; height: 36px; line-height: 34px; text-align: center; border-radius: 100%; display: inline-block; border: 1px solid #fff; margin: 0 6px 8px 8px;}
#page a:hover, #page a.current { background: #d2d2d2; color: #3f3f3f; border-color:#d2d2d2;  }
.page-prev, .page-next { }
.page-prev:hover, .page-next:hover { }
.page-prev { }
.page-next { }

/*products-detail*/
.products-detail-top { display: flex; flex-direction: row; flex-wrap: wrap; align-items: flex-start; padding-bottom: 15px;}
.products-detail-top > div { width: 50%; padding-bottom: 20px;}
.products-detail-top > div:nth-of-type(1) { padding-right: 5%;}

.products-detail-tool { position: relative;}
   .swiper-slide {
      text-align: center;
      font-size: 18px;
      display: flex;
      justify-content: center;
      align-items: center;
    }

    .swiper-slide  {
      display: inline-block;
      max-width: 800px; width: 100%; 
      /*height: 100%;
      object-fit: cover;*/
    }

    .swiper {
      width: 100%;
      height: 300px;
      margin-left: auto;
      margin-right: auto;
    }

    .swiper-slide {
      background-size: cover;
      background-position: center; padding: 0 5px;
    }

    .mySwiper2 {
      height: 80%;
      width: 100%; margin-bottom: 10px;
    }
	.mySwiper2 a { position: relative; border-radius: 100px 0 0 0; overflow: hidden; display:block; line-height: 0;}
	.mySwiper2 a:after { content: ""; position: absolute; width:  100%; height: calc(100% - 0px); box-shadow: inset 0px 3px 0px 0 #71c7d1, inset 0px -3px 0px 0 #71c7d1; left: 0; top: 0;border-radius: 100px 0 0 0;  }
	.mySwiper2 .swiper-slide { padding: 0;}
	.mySwiper2 img { width: 100%;}

    .mySwiper {
      height: auto;
      box-sizing: border-box;
    }
	.mySwiper img { border-radius: 15px 0;}
	
    .mySwiper .swiper-slide {
      width: 25%;
      height: 100%;
      opacity: 0.4;
    }

    .mySwiper .swiper-slide-thumb-active {
      opacity: 1;
    }

.swiper-next, .swiper-prev { width: 30px !important; height: 30px !important; border-radius: 100%; background: #3e3a39; border: 0px solid #074151; position: absolute; z-index: 2; display: flex; flex-direction: row; flex-wrap: nowrap; justify-content: center; align-items: center; top:43%; transform: translateY(-50%);}
.swiper-next:hover, .swiper-prev:hover { opacity: 0.6 !important;}
.swiper-next:after, .swiper-prev:after { content: ""; display: block; width: 12px; height: 12px ; border-width: 1px 1px 0 0; border-color: #fff; border-style: solid; position: relative; top:5px;}
.swiper-prev:after { transform: rotate(-135deg); left: 3px;}
.swiper-next:after { transform: rotate(45deg); right: 3px;}
.swiper-prev { left: -10px;}
.swiper-next { right: -10px;}

.zoom-tool { position: absolute; width: 32px; height: 32px; border-radius: 100%; background: #71c7d1; text-align: center; line-height: 32px; color: #fff; z-index: 3; right: 3%; top:5%;}
.zoom-tool img { filter: invert(1) brightness(100%); width: 15px;}

.line-type-3 { position: relative; width: 100%; height: 1px; background: #a0a0a0; margin: 20px 0 calc(15px + 1%) 0 ;}
.line-type-3:before { position: absolute; content: ""; background: #71c7d1; height: 3px; width:125px; left: 0%; top:50%; transform: translateY(-50%);}

.products-detail-title { line-height: 1.2; padding: 0 0 5px 0; margin: 0; font-size: clamp(24px, 2.2vw, 36px); font-weight: 700;}
.products-detail-serial { font-size: clamp(16px, 1vw, 20px);}
.products-detail-data-box { padding-bottom: 25px; min-height: 270px;}
.products-detail-data { list-style: none; margin: 0; padding: calc(20px + 2%) 0;}
.products-detail-data li { padding-left: 22px; margin-bottom: 6px; position: relative;}
.products-detail-data li:before { content:""; position: absolute; width: 10px; height: 10px; border-radius: 100%; background: #6cb4bc; left: 2px; top:8px;}

.products-detail-tool { display: flex; flex-direction: row;flex-wrap: wrap; justify-content: space-between; align-items: center; margin-bottom: 20px;}
.products-detail-tool > div { padding-bottom: 10px;}

.btn-inquiry { border-radius: 20px 0 20px 0; background: #313131; width: 200px; line-height: 50px; text-align: center; font-weight: 500; font-size: 18px; display: block;}
.btn-inquiry:hover { transform: scale(0.9);}
.btn-inquiry img { display: inline-block; margin-right: 8px;}


.products-detail-btn { display: flex; flex-direction: row;flex-wrap: wrap; justify-content: space-between; align-items: center;padding: 20px;}
.products-detail-btn > a { display: inline-block; font-weight: 500; font-size: 18px; text-transform: uppercase;}
.products-detail-btn > a:hover { transform: scale(0.9);}
.products-detail-btn > a img { display: inline-block; margin: 0 10px;}

.idx-client-list { padding-bottom: calc(20px + 4%);}

.p-detail-title {font-size:clamp(20px, 1.5vw, 24px); line-height: 1.2; font-weight: 700; padding-bottom: calc(5px + 1%); text-transform: uppercase;}
.p-detail-title-2{font-size: clamp(24px, 2.2vw, 36px); line-height: 1.1; font-weight: 700;padding-bottom: calc(10px + 1%); text-align: center;}


.title02 {font-size: clamp(24px, 2.2vw, 36px); line-height: 1.1; font-weight: 700;padding-bottom: calc(10px + 1%); margin-bottom: calc(10px + 1%); text-align: center; border-bottom: 1px solid #fff; text-transform: uppercase;}

.loop3 { position: relative; padding-top: 15px; padding-bottom: calc(50px + 4%);}
.loop3 .owl-dots { }
.loop3 .owl-item {position: relative; padding: 10px; }
.loop3 .owl-item:nth-child(even) .idx-pro-data { background: #07517d;}
.loop3 .owl-nav { position: absolute; top:calc(50% - 40px); left: 0; width: 100%; z-index: 11;}
.loop3 .owl-prev, .loop3 .owl-next { position:absolute; z-index:100; top:calc(50% - 0px); width: 50px !important; height: 50px !important; border-radius: 100% !important; background: rgba(255,255,255,.2) !important; border: 0px solid #fff !important;}
.loop3 .owl-prev { left:15px; }
.loop3 .owl-next { right:15px;}
.loop3 .owl-prev:before, .loop3 .owl-next:before { font-family: 'Font Awesome 5 Free';font-weight: 900 !important;font-size:70px; color: #fff; opacity: 1;transition: all 0.4s ease-out 0s;width: 13px; height: 13px; background-size: contain; display: block; border-width: 1px 1px 0 0; border-style: solid; border-color: #fff;}
.loop3 .owl-prev:before { content: ""; transform: rotate(-135deg); margin-left: 20px; }
.loop3 .owl-next:before { content: ""; transform: rotate(45deg); margin-left: 15px;}
.loop3 .owl-prev:hover:before, .loop3 .owl-next:hover:before { opacity: 1;}
.loop3 .owl-stage-outer {z-index: 2;}
.loop3 .owl-dots { position: absolute; z-index: 100; bottom:40px; width: 100%; text-align: center !important; padding: 0 0px; }
.loop3 .owl-dots .owl-dot { border: 0px solid #c10000; background: transparent; margin-left: 6px;  margin-right: 6px; border-radius: 100%;}
.loop3 .owl-dots .owl-dot.active {  }
.loop3 .owl-dots .owl-dot span, .loop3  .owl-dots .owl-dot span { background: #898989 !important; width: 12px !important; height: 12px !important; margin: 0 auto!important;transition: all 0.4s ease-out 0s !important; }
.loop3 .owl-dots .owl-dot.active span/*, .loop3  .owl-dots .owl-dot:hover span*/ {  background: #6cb4bc !important; }

/*solution*/
.aside-menu-2 > a:nth-of-type(7n + 1), .aside-menu-2 > a:nth-of-type(7n + 2), .aside-menu-2 > a:nth-of-type(7n + 3) { width: calc(33.33% - 12px);}
/*.aside-menu-2 > a:nth-of-type(7n + 4), .aside-menu-2 > a:nth-of-type(7n + 5), .aside-menu-2 > a:nth-of-type(7n + 6), .aside-menu-2 > a:nth-of-type(7n + 7) { width: 24.3%;}*/

.solution-section { max-width: 1180px; margin: 0 auto;; padding-bottom: calc(25px + 4%);}
.solution-section-top { display: flex; flex-direction: row; flex-wrap: wrap; align-items: flex-start; padding-bottom: calc(20px + 3%);}
.solution-section-top > div { width: 50%}
.solution-section-top > div:nth-of-type(1) { padding-right: 5%;}

.idx-solution-item-title { display: flex; flex-direction: row; flex-wrap: nowrap; align-items: flex-end; justify-content: flex-start;padding-bottom: calc(20px + 3%); }
.idx-solution-item-title > div:nth-of-type(1) img { max-width: 105px; margin-right: 30px;}
.idx-solution-item-title > div:nth-of-type(2) { font-weight: 700;font-size: clamp(25px, 3.5vw, 48px); padding-right: 44px; position: relative; background: url("../images/item-arrow.png") no-repeat right center / 26px 24px; line-height: 1; margin-bottom: 10px;}

.idx-solution-title { font-size: clamp(24px, 2.2vw, 36px); line-height: 1.3; font-weight: 700; padding-bottom: calc(20px + 2%); text-transform: uppercase;}
.idx-solution-title-b { text-transform:inherit;}
.idx-solution-title span { color: #b29763;}
.idx-solution-title-2 { font-size:clamp(20px, 1.5vw, 28px);line-height: 1.3; font-weight: 700; color: #71c7d1; padding-bottom: 10px;}

.solution-pto { border-bottom: 10px solid #363636; line-height: 0;}
.solution-data { border-radius: 0 0 60px 0; padding: calc(10px + 2%) calc(20px + 2%) calc(30px + 2%) calc(20px + 2%); background: #fff;color: #000; box-shadow:inset 0px -10px 0px 0 #b29763;}

.solution-content { background: #313131; border-radius:150px 0 0 0; padding: calc(20px + 4%) calc(20px + 8%) calc(20px + 4%) calc(20px + 8%); box-shadow:inset 0px 3px 0px 0 #b29763;}

/*application*/
.application-list { margin-bottom: calc(20px + 5%); display: flex; flex-direction: row; flex-wrap: wrap; background: #000;}
.application-list:hover > a { opacity: 0.2;}
.application-list > a { width: 25%; display: flex; flex-direction: column; flex-wrap: wrap; background: #313131;}
.application-list > a:hover { opacity: 1;}
.application-list > a:hover .btn-more { background: #fff; color: #000;}
.application-list > a > div { height: 354px;}
.application-list > a > div > img { object-fit: cover; width: 100%; height: 100%;}
.application-list-data { display: flex; flex-direction: column; flex-wrap: wrap; justify-content: center; align-items: center; padding: 0 2%;}
.application-list-data-title { font-size:clamp(18px, 1.5vw, 24px);  font-weight: 700; padding-bottom: 20px; text-transform: uppercase; text-align: center}
.btn-more { display: block; border-radius: 0 15px; width: 100px; line-height: 30px; text-align: center; border: 1px solid #fff; font-size: 16px; font-weight: 700; transition: all 0.4s ease-out 0s;}
.btn-more:hover { background: #fff; color: #000;}

.application-list > a:nth-child(even) > div:nth-of-type(1) { order: 2;}
.application-list > a:nth-child(even) > div:nth-of-type(2) { order: 1;}

.application-bottom-pto { background: url("../images/application-bottom-pto.jpg") no-repeat center center / cover; height: 140px;}

/*news*/
.aside-menu-3 > a { width: 19.4%;}
.news-section { padding-bottom: calc(20px + 4%);}
.news-list { margin-bottom: calc(25px + 1%); background: #313131; box-shadow:inset 8px 0px 0px 0 #71c7d1; border-radius: 100px 0 0 0; position:relative; display: flex; flex-direction: row; flex-wrap: nowrap; padding-left: 5%;}
.news-list:hover  .news-list-pto img { transform: scale(1.05);}
.news-list:after { content: ""; position: absolute; z-index: 2; top: 0; right: 0; width: 8px; height: 100%; background: #71c7d1}
.news-list-date { width: 85px; height: 85px; margin-top: 4%; border-radius: 100%; font-weight: 700; font-size: 16px; display: flex; flex-direction: row; flex-wrap: nowrap; align-items: center; justify-content: center; background: #71c7d1;}
.news-list-content { width: 60%; padding:0 5%; margin-top: 4%;}
.news-list-pto { width: calc(40% - 85px); line-height: 0; overflow: hidden; min-height: 290px;}
.news-list-pto img { transition: all 1.4s ease-out 0s;object-fit: cover; width: 100%; height: 100%}

.news-tag { font-size: 16px; font-weight: 700; color: #898989; line-height: 1.2; padding-bottom: 20px;}
.news-title { font-size:clamp(20px, 1.5vw, 24px); line-height: 1.2; font-weight: 700; color: #71c7d1; padding-bottom: 20px; display: block;}
.news-data { font-size:14px; line-height: 1.2; font-weight: 700; color: #b8b8b8; padding-bottom: 20px;white-space:nowrap; text-overflow : ellipsis; overflow:hidden; }

@media only screen and (max-width: 1279px) {
	#content { }
	#content, #content p, p, td, li, label { font-size: 15px; }

	.products-box > div:nth-of-type(1) { width: 100%; padding-bottom: 20px; }
	.products-box > div:nth-of-type(2) { width: calc(100% - 0px); padding-left: 0%;}
	
	.aside-title  { display:none;}
	
}

@media only screen and (max-width: 980px) {
	.banner-pc { display: none !important}
	.banner-mobile { display: block !important;}
	
	.about-section > div > div:nth-of-type(1) { width: 100%; padding: 0 0 20px 0;}
	.about-section > div > div:nth-of-type(2) { width: 100%; }
	.about-section > div:nth-child(even) > div:nth-of-type(1) { order: 1; padding: 0 0 20px 0 ;}
	.about-section > div:nth-child(even) > div:nth-of-type(2) { order: 2; }
	.about-section:after { display: none;}
	.about-title { padding-bottom: calc(10px + 1%);}
	
	.history-section > div > div:nth-of-type(1) { width: 100%;}
	.history-section > div > div:nth-of-type(2) { width: 100%;}
	.history-year { text-align: left; padding:0 0 calc(15px + 1%) 0; }
	.history-content { border-radius: 60px 0 60px 0;}
	
	.history-section > div:nth-child(even) > div:nth-of-type(1) { order: 1;}
	.history-section > div:nth-child(even) > div:nth-of-type(1) .history-data { text-align: left;}
	.history-section > div:nth-child(even) > div:nth-of-type(1) .line-type-1:before { right: auto; left: 0;}
	.history-section > div:nth-child(even) > div:nth-of-type(1) .line-type-1:after { right: auto; left: 47px;}
	.history-section > div:nth-child(even) > div:nth-of-type(2) { order: 2;}
	
	.products-list-title { font-size: 16px;}
	
	.products-detail-top > div { width: 100%; }
	.products-detail-top > div:nth-of-type(1) { padding-right:0%;}
	.products-detail-data-box { min-height: inherit;}
	
	.idx-solution-item-title > div:nth-of-type(1) img { max-width: 65px; margin-right: 20px;}
	
	.application-list > a { width: 50%; }
	.application-list > a > div { height: 290px;}
	
	.news-list { flex-wrap: wrap; padding-right: 5%; border-radius: 50px 0 0 0;}
	.news-list-date { }
	.news-list-content { width: calc(100% - 85px); padding:0 5%; margin-top: 4%;}
	.news-list-pto { width: 100%; padding: 30px 0; }
	
}
@media only screen and (max-width: 768px) {
	.aside-menu-1 > a { width: calc(50% - 12px);}
	
	.products-list-section { margin-right: 0; justify-content: space-between; }
	.products-list-section > a { width: 48%; margin-right: 0; }
	
	#page a { margin: 0 3px 8px 3px;}
	
	
	.aside-menu-2 > a { width: calc(50% - 12px) !important;}
}
@media only screen and (max-width: 640px) {
	.solution-section-top > div { width: 100%}
	.solution-section-top > div:nth-of-type(1) { padding-right: 0%; padding-bottom: 25px;}
	.solution-content { border-radius:60px 0 0 0; padding: calc(20px + 3%) calc(20px + 4%) calc(20px + 3%) calc(20px + 4%); }
	
	.application-list > a { width: 100%; flex-direction: row; }
	.application-list > a > div { width: 50%; height: 220px; }
	.btn-more { font-size: 14px;}
}
@media only screen and (max-width: 570px) {
	.products-detail-btn { padding-left: 0; padding-right: 0;}
	.products-detail-btn > a { margin: 5px 0;}
	.products-detail-btn > a.btn-back { text-align: center; width: 100%; order: 1;}
	.products-detail-btn > a.btn-prev { text-align: left; width: 50%; order: 2;}
	.products-detail-btn > a.btn-next { text-align: right; width: 50%; order: 3;}
	
	.news-list-date { }
	.news-list-content { width: calc(100% - 0px); padding:0 0%; }
}
@media only screen and (max-width: 430px) {
    .aside-menu-1 > a, .aside-menu-2 > a { width: calc(100% - 12px) !important; margin: 0 6px 6px 6px;}
}
@media only screen and (max-width: 414px) {
	.products-list-section > a { width: 100%; }
	

}

@media only screen and (max-width: 320px) {
	

}