body {position: relative;  margin: 0; height: 100%; font-family: Arial, Helvetica, sans-serif,'Microsoft JhengHei','微軟正黑體'; font-size: 14.5px; line-height: 1.5;}

h1{font-size: 36px; color: #018a71; font-weight: bold;}
h2{font-size: 32px; color: rgb(165, 116, 116);}
h3{font-size: 28px; color: #333;}
h4{font-size: 24px; color: #333;}
h5{font-size: 20px; color: #333;}
h6{font-size: 16px; color: #333;}
h1, h2, h3, h4, h5, h6 {margin: 6px;}
strong{font-weight: bold;}
div, ul, ol, li, dl, dt, dd, p, span, a, strong,
h1, h2, h3, h4, h5, h6,
table, caption, tr, th, td,
form, input, select, button, textarea, label,
header, footer, article, section, nav, aside, main, time {box-sizing: border-box;}
a{color: inherit;  text-decoration: none; color: #333}
nav ul a{color: #333}
u{text-decoration: none; font-weight: 700; color: #018a71;}
img{width: 100%;}

.pagebox{display: flex; }
.navbarbox{ width: 11%; position: relative; }
.contentbox{ width: 89%; position: relative;  }
.btn, .btn-large, .btn-small{background-color: #018a71;}
.carousel .carousel-item>img {height: 100%; object-fit: cover;}
.breadcrumb_box{height: 42px; line-height: 42px; padding-left: 42px;}
.breadcrumb_box a.breadcrumb{color: #018a71; font-size: 14.5px;}
.breadcrumb_box a.breadcrumb:before{color: #018a71;}
.card .card-reveal .card-title{color: #018a71; position: relative;}
.card .card-reveal .card-title i{position: absolute; top: -16px; right: -16px;}
.card .card-reveal .card-content{line-height: 1.8;}
.card .card-action a:not(.btn):not(.btn-large):not(.btn-small):not(.btn-large):not(.btn-floating){color: initial;}
.card .card-action a:not(.btn):not(.btn-large):not(.btn-small):not(.btn-large):not(.btn-floating):hover{color: initial;}
.back{font-size: 18px; color: #333;}
.border-box{box-sizing: border-box;-moz-box-sizing: border-box; -webkit-box-sizing: border-box; }
.clearfix{display: block; width: 100%; height: 1px; border: 0; background: none; clear: both; padding: 0; margin: 0;} 

.material-icons.md-16 { font-size: 16px; }
.material-icons.md-18 { font-size: 18px; }
.material-icons.md-24 { font-size: 24px; }
.material-icons.md-36 { font-size: 36px; }
.material-icons.md-48 { font-size: 48px; }
.splide{padding: 0.5rem;}
.splide__arrow--prev{left: -1.5rem;}
.splide__arrow--next{right: -1.5rem;}

.owl-carousel .owl-item img{max-height: 530px; object-fit: cover;}
.no-margin-bottom{margin-bottom: 0;}
.margin-top-40{margin-top: 40px;}
.subjectbox .subject{position: relative; margin-bottom: 0px;}
.subjectbox .subject h2{display: inline-block; font-family: Impact,'Microsoft JhengHei','微軟正黑體'; margin: 0; margin-block-start: 0; margin-block-end: 0; color: #018a71;}
.subjectbox .subject b{margin-right: 6px; font-family: Impact;}
.subjectbox .subject span.cn{display: block; color: #333; font-size: 18px; font-weight: bold; margin-left: 1.5rem;}
.subjectbox .more{text-align: center;  color: #018a71; display: inline-block; margin-left:34px; }
.subjectbox .more a{font-size: 14.5px; display: block; border: 1px solid #018a71; padding: 8px 8px 0 8px; margin-top: 8px; color:#018a71;}
.subjectbox .more span{ display:inline-block; vertical-align: top; color: #333;}

.articles_subject h3{display: block; margin-block-start: 0; margin-block-end: 0; margin: initial; color:#018a71; text-align: left;}
.articles_subject span.Uicon{margin-right: 6px; font-family: Impact; color:#018a71; font-size: 26px; line-height: 150%; vertical-align: baseline; }
.articles_subject i{font-size: 26px; vertical-align: top;}
.lineclamp_1{text-overflow: ellipsis; display: -webkit-box; text-overflow: ellipsis; -webkit-line-clamp: 1;  -webkit-box-orient: vertical;}
.lineclamp_2{text-overflow: ellipsis; display: -webkit-box; text-overflow: ellipsis; -webkit-line-clamp: 2;  -webkit-box-orient: vertical;}
.lineclamp_3{text-overflow: ellipsis; display: -webkit-box; text-overflow: ellipsis; -webkit-line-clamp: 3;  -webkit-box-orient: vertical;}
/* .pagebox.product .productbox h3{color:#009774; text-align: left;}
.pagebox.product .productbox h3 span{font-size:26px; font-weight: 700;; margin-right: 8px; font-family: Impact;}
.pagebox.product .productbox h3 i{font-size: 26px; vertical-align: top;} */


.video-container {
  position: relative;
  margin-bottom: 1.5rem;
  padding-bottom: 56.25%;
}

.video-container iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}


@media only screen and (max-width: 1023px) {
    .contentbox{width: 100%;}
    .navbarbox{width: 100%;}
    .pagebox{display: initial; }
    .sidenav-overlay{z-index: 996;}
    h1{font-size: 32px;}
    h2{font-size: 28px;}
    h3{font-size: 24px;}
    h5{font-size: 20px;}
    h6{font-size: 16px;}
    .breadcrumb_box{height: 42px; line-height: 42px; padding-left: 8px; margin-top: 10px;}
    
}

@media only screen and (min-width: 1024px) and (max-width: 1440px) {
    .navbarbox{width: 15%;}
    .contentbox{width: 85%;}
    .card .card-action a:not(.btn):not(.btn-large):not(.btn-small):not(.btn-large):not(.btn-floating){margin-right: 0;}
    
}


/***************
cate border color
****************/
.newscate{font-size: 14.5px; padding: 8px; margin: 0 8px 0 0;}
.newscate.environment{color:#018a71;border: 1px solid #018a71; }
.newscate.company{color:#00AAE1;border: 1px solid #00AAE1; }
.newscate.volunteer{color:#B73E35;border: 1px solid #B73E35; }
.newscate.social{color:#AA7B31;border: 1px solid #AA7B31; }
.newscate.product{color:#018a71;border: 1px solid #018a71; }

/***************
navbar
****************/
nav .brand-logo {position: relative; color: #fff; display: inline-block; font-size: 2.1rem; padding: 0; }
.navbar .nav-wrapper{height: auto; color: #333;}
.navbar{max-width: 11%; background-color: #fff; height: 100vh;}
.navbar .nav-logo{margin: 30px 40px 10px 40px;}
.navbar .nav-hr{width: 150px; margin: 0 auto;  height: 1px; background-color: #f3f3f3; border: none;}
.navbar ul li{float: none;}
.navbar .nav-menu{padding: 20px 0;}
.navbar ul li.nav-menu-li .nav-menu-title{display: block; padding: 12px;  line-height: 1; font-size: 15px; cursor: pointer; text-align: center;}
.navbar ul li.nav-menu-li:hover{background-color: #018a71;}
.navbar ul li.nav-menu-li:hover .nav-menu-title{ color: #fff;}
.navbar ul li.dropdown-trigger{position: relative;}
.navbar .submeunbox {padding: 41px 0; width:100%; background:#018a71; position:absolute; top:0; right: -100%; }
.navbar .submeunbox li {color: #fff;}
.navbar .submeunbox li:hover{background-color: #eee;}
.navbar ul li.nav-menu-li .submeunbox li:hover a span{ color: #333;}
.navbar .line_icon{display: inline-block; text-align: center; width: 100%; padding: 0 15px;}



ul.nav-iconLink { padding:0 30px;  text-align: left; font-family: "游ゴシック", YuGothic, "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", Meiryo, sans-serif;}
.nav-iconLink-li {border-top: 1px solid #f3f3f3;}
.nav-iconLink-li:first-child {border: none;}
.nav-iconLink-a {position: relative; display: block; padding: 15px 0; line-height: 1.6; letter-spacing: 2px; color: #666; font-size: 11px;}
.nav-iconLink-a i{cursor: pointer;}
.nav-iconLink-a .icon {position: absolute; top: 20%; right: 0; margin-top: -17px; letter-spacing: normal; color: #949494; font-size: 25px;}
.nav-iconLink-a .arrow_drop_down {margin-top: -11px; right:-12px; font-size: 48px; }
.nav-iconLink-a:hover .icon { color: #018a71; }
.navbar .languagesite{cursor: pointer;}
.navbar ul.sublang{padding-inline-start:20px; display: none;}
.navbar ul.sublang.show{display: block;}
.navbar ul.sublang li{list-style-type: disc; line-height: initial;;}
.navbar ul.sublang li:hover a{background-color: #fff;  color: #018a71}
.navbar ul.sublang a{font-size: 13px; padding: 10px 0;}

nav .sidenav-trigger{float: right;}
nav .brand-logo{
  left: 0%;
  -webkit-transform: translateX(0%);
  transform: translateX(0%);
}


/* .navbar .sidenav-trigger{color: #333;}
.navbar ul{background: #efefef; font-size: 14.5px; font-weight: 500;}
.navbar li{display: block; width: 100%; text-align: center; float: none;}
.navbar li a{color: #333; }
.brand-logo ul a{color: #333; font-size: 14.5px; letter-spacing: .1rem}

.navbar .brand-logo{width: 95%; margin: 0 auto; padding:40px 15px; display: block; position: relative;}
.navbar .brand-logo img{width: 100%; max-width: 150px; }

.navbar .global_box{text-align: left; background-color: #fff;  line-height: 1.5;}
.navbar .global_box i{font-size: 1.5em;}
.navbar .language_box {text-align: left; background-color: #fff;  line-height: 1.5;}
.navbar .language_box i{font-size: 3em;}
.navbar .language_box li{background-color: #fff; line-height: 1.5;}

.navbar .submeunbox li a{color: #fff;}
.navbar .submeunbox li:hover{background: #018a71;}

ul.sidenav{ font-size: 14.5px; font-weight: 500;}
.sidenav li{display: block; width: 100%; text-align: center; float: none; color: #333; }
.sidenav li a{color: #333; }
.sidenav .global_box{text-align: center; background-color: #fff;}
.sidenav .global_box i{display: inline-block;}
.sidenav .global_box span{display: inline-block; vertical-align: super; margin-left: 8px; font-size: 11px; }
.sidenav .language_box {text-align: center; background-color: #fff;}
.sidenav .language_box a{display: inline-block;width: 54px; height: 54px;  border:2px solid #eee; line-height:52px; border-radius: 50%; text-align: center; margin: 0 4px; padding: 0; color: #aaa; }
.sidenav .language_box a:hover{background: #DFDFDF; color: #222; font-weight: 700; border: #fff; line-height:52px;}
*/

@media only screen and (max-width: 1023px) {
    nav a{color: #333;}
    .navbar{width: 100%; max-width:none; height: auto;} 
    .navbar .brand-logo{padding: 0; display: initial; position: absolute; width: initial; margin: initial;}
    .navbar .brand-logo img{height: 42px; margin-top: 8px; max-width: initial; width: initial;}
    .sidenav .languagesite{cursor: pointer;}
    .sidenav ul.sublang{padding-inline-start:40px; display: none;}
    .sidenav ul.sublang.show{display: block;}
    .sidenav ul.sublang li{list-style-type: disc; line-height: initial;;}
    .sidenav ul.sublang li:hover a{background-color: #fff;  color: #018a71}
    .sidenav ul.sublang a{font-size: 13px; padding: 10px 0;}
    
}

@media only screen and (min-width: 1024px) and (max-width: 1440px) {
    .navbar{width: 15%; max-width:none; height: 100vh;} 
    .navbar ul li.nav-menu-li .nav-menu-title{font-size: 14px; padding: 12px 0;}
    ul.nav-iconLink{padding: 0 12px;}

} 



/***************
footer
****************/
footer{background: #eee;  font-size: 14.5px;}
footer .row{margin-bottom: 0; padding: 8px 0;}
footer .footerbox{margin: 0 auto; padding: 16px 0 0 0;}
footer .footerbox .logo{margin: 6px 0;}
footer .footerbox .logo img{width: 100%; max-width: 150px;}
footer .footerbox .company_info{font-size: 12px; color: #333; margin-block-start: 0;}
footer .footerbox .company_info li{padding: 0; margin-bottom: 0;}
footer .copyright{background: #fff; padding: 15px 0; text-align: right; letter-spacing: .1rem; font-size: 13px; color: #333333; padding-right: 40px;}
footer .footer_menu {font-size: 14.5px; color: #018a71; line-height: 2; letter-spacing: .1rem; margin-block-start: 0;}
footer .footer_menu a{color: #018a71;}

@media only screen and (max-width: 600px) {
  footer .footer_menu li{margin-bottom: 8px; }
  footer .footerbox .logo img{max-width: 100%;}
  footer .copyright{margin-right: 0;}
    
}


/***************
pagebox.home 
****************/
.pagebox.home .contentbox .titlebox{text-align: center; font-weight: 700; margin-bottom: 36px;}

.pagebox.home .contentbox .sliderbox .carousel{min-height: 675px;}
.pagebox.home .contentbox .sliderbox .carousel .fixed-bottom{position: fixed; width: 100%; height: 60px; bottom: 0; line-height: 60px; font-size: 14.5px; background:rgba(0,0,0,0.6)}
.pagebox.home .contentbox .sliderbox .carousel .fixed-bottom span{color:#018a71; font-weight: 700; }
.pagebox.home .contentbox .sliderbox .carousel .fixed-bottom span::after{content: "▎"; padding: 0 0 0 8px; font-weight: bold;}
.pagebox.home .contentbox .sliderbox .carousel .fixed-bottom h6{color: #fff; display: inline-block; font-size: 14.5px; }
.pagebox.home .contentbox .sliderbox .carousel .indicators{left:auto; right: 5%;}

.pagebox.home .contentbox .newsbox_product{height: 270px; background: #018a71; font-size: 14.5px;}
.pagebox.home .contentbox .newsbox_product ul{margin-block-start: 0; margin-block-end: 0; padding-inline-start: 0;}
.pagebox.home .contentbox .newsbox_product li{background: #fff; padding:20px 50px; height: 160px; margin-top: 50px; border-right: 1px solid #018a71;}
.pagebox.home .contentbox .newsbox_product li:last-child{border:none;}
.pagebox.home .contentbox .newsbox_product .label span{font-size: 13px; font-weight: 500; color: #018a71; border: 1px solid #018a71; padding: 2px 8px;}
.pagebox.home .contentbox .newsbox_product .datetime{font-size: 14.5px;}
.pagebox.home .contentbox .newsbox_product .desc{font-size: 14.5px; overflow: hidden; height: 5rem; line-height: 1.8;}


.pagebox.home .contentbox .productbox .searchbox{position: relative; text-align: center; height: 665px; }
.pagebox.home .contentbox .productbox .searchbox h2,.pagebox.home .contentbox .productbox .searchbox h5{color: #fff;}
.pagebox.home .contentbox .productbox .searchbox .mask{position: absolute; width: 100%; height: 100%; background:rgba(255,255,255,0.3) }
.pagebox.home .contentbox .productbox .searchbox .col .row{position: relative; padding: 0; margin-bottom: 0;}
.pagebox.home .contentbox .productbox .searchbox .by_category{padding: 0; position: relative; height: 50%; background: url('https://www.ushio.com.tw/assest/img/search_by_category.jpg') no-repeat  ;}
.pagebox.home .contentbox .productbox .searchbox .by_function{padding: 0; position: relative; height: 50%; background: url("https://www.ushio.com.tw/assest/img/search_function_img.jpg") no-repeat ;}
.pagebox.home .contentbox .productbox .searchbox .by_industry{padding: 0; position: relative; height: 50%; background: url('https://www.ushio.com.tw/assest/img/taipei.jpg') no-repeat center center;}
.pagebox.home .contentbox .productbox .searchbox .by_wavelenght{padding: 0; position: relative; height: 100%; background: url('https://www.ushio.com.tw/assest/img/Light_Hand.jpg') no-repeat; background-size: cover;}
.pagebox.home .contentbox .productbox .searchbox .title{color: #fff; margin-top: 10%; font-size: 18px;}
.pagebox.home .contentbox .productbox .searchbox .by_wavelenght .title{ margin-top: 30%;}
.pagebox.home .contentbox .productbox .chevron_right{position: absolute; right: 5%; bottom: 5%;  border: 1px solid #eee; padding: 4px; color: #eee; }
.pagebox.home .contentbox .productbox .icon{border: 1px solid #eee; padding: 8px; border-radius: 50%; color: #222; background:rgba(255,255,255,0.6) }
.pagebox.home .contentbox .product-searchbox li{margin-bottom: 16px;}
.pagebox.home .contentbox .product-searchbox li a{display: table; width: 100%; max-height: 140px; padding: 35px 20px; text-align: center;  border: 1px solid #999;  transition: .3s;}
.pagebox.home .contentbox .product-searchbox li a:hover{background-color: #018a71; transition: 0.5s;}
.pagebox.home .contentbox .product-searchbox li:hover a,.pagebox.home .contentbox .productbox li:hover a h2{ border-color: #018a71; transition: 0.5s; color: #fff;}





.pagebox.home .contentbox .newsbox {margin: 48px auto;}
.pagebox.home .contentbox .newsbox .divider{margin-bottom: 30px;}

/* pagebox.home .contentbox .newsbox .subject {position: relative;  font-weight: 700; margin-bottom: 0px;}
.pagebox.home .contentbox .newsbox .subject h2{display: inline-block; font-family: Impact; margin: 0; margin-block-start: 0; margin-block-end: 0; color: #018a71;}
.pagebox.home .contentbox .newsbox .subject b{margin-right: 6px;}
.pagebox.home .contentbox .newsbox .subject span.cn{display: block; color: #333; font-size: 18px; font-weight: bold; text-align: right;} 

.pagebox.home .contentbox .newsbox .more{text-align: center;  color: #018a71; }
.pagebox.home .contentbox .newsbox .more a{font-size: 14.5px; display: block; border: 1px solid #018a71; padding: 8px 8px 0 8px; margin-top: 8px; color:#018a71;}
.pagebox.home .contentbox .newsbox .more span{ display:inline-block; vertical-align: top; color: #333;}*/
.pagebox.home .contentbox .newsbox ul{margin-block-start: 8px; line-height: 1.8rem;}

/* .pagebox.home .contentbox .newsbox li {margin-bottom: 8px;} */
.pagebox.home .contentbox .newsbox li .datetime{font-size: 14.5px; display: inline-block; margin: 0 16px 0 0;}
.pagebox.home .contentbox .newsbox li .catergroy{font-size: 13px; display: inline-block; }
.pagebox.home .contentbox .newsbox li .catergroy span{border: 1px solid #018a71; color: #018a71; padding: 2px;}
.pagebox.home .contentbox .newsbox li .desc{font-size: 14.5px; height: 3.5rem; overflow: hidden; line-height: 1.8; }


.pagebox.home .contentbox .servicebox .row{position: relative; text-align: center; height: 460px;  }
.pagebox.home .contentbox .servicebox .by_service{position: relative; padding: 0; height: 100%; background: url('https://www.ushio.com.tw/assest/img/internet-use-policy.jpg') no-repeat; background-size: cover;}
.pagebox.home .contentbox .servicebox .by_contact{position: relative; padding: 0; height: 100%; background: url('https://www.ushio.com.tw/assest/img/contactus.png') no-repeat; background-size: cover;}
.pagebox.home .contentbox .servicebox .mask{position: absolute; left: 0; top: 0; width: 100%; height: 100%; background:rgba(0,0,0,0.1) }
.pagebox.home .contentbox .servicebox .title{ color: #fff; margin-top: 15%; }
.pagebox.home .contentbox .servicebox h2,.pagebox.home .contentbox .servicebox h5{color: #fff;}
.pagebox.home .contentbox .servicebox .chevron_right{position: absolute; right: 5%; bottom: 5%;  border: 1px solid #eee; padding: 4px; color: #eee; }
.pagebox.home .contentbox .servicebox .icon{border: 1px solid #eee; padding: 8px; border-radius: 50%; color: #222; background:rgba(255,255,255,0.6) }


.pagebox.home .contentbox .linkebox {margin: 50px auto; font-size: 14.5px;}
.pagebox.home .contentbox .linkebox ul{background-color: #eee; padding: 16px 8px 0 8px;}
.pagebox.home .contentbox .linkebox li {margin-bottom: 16px;}
.pagebox.home .contentbox .linkebox li img{width: 100%; object-fit: fill;}
.pagebox.home .contentbox .linkebox li .titlebox{background-color: #7f7f7f; color: #fff; padding: 8px; font-weight: normal; letter-spacing: .1rem;margin-bottom:0;}
.pagebox.home .contentbox .linkebox li .titlebox i{vertical-align: bottom; }

.pagebox.home .contentbox .whatcare222 {padding: 48px 0;}
/*.whatcare222 .desc{font-size: 1.25rem;}*/
.whatcare222 .desc{line-height:1.8rem}
.whatcare222 .acc-content{display: none;}
.whatcare222 .isborder{ border-top: 2px solid #018a71;}
.whatcare222 .accordion_tool{padding:1rem 0;}
.whatcare222 .accordion_tool .acc_tool_btn{cursor: pointer;}
.whatcare222 i{vertical-align: middle; font-size: 2rem;}
.whatcare222 .video{text-align: right;}

.whatcare222 .video {
  position: relative;
  padding-bottom: 56.25%;
}

.whatcare222 .video iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}


/* .banner-container {
    overflow: hidden;
    position: relative;width:1024px;
    margin:25px auto;
}
  
  .banner-container ul { height: 639px; }
  
  .banner-container li {
    float: left;
    overflow: hidden;
    cursor: pointer;
    position: relative;
    z-index: 9;
  }
  
  .banner-container li a {
    display: block;
    padding: 0px;
    margin: 0px;
  }
  
  .banner-container li span.overlay {
    background: url('/tw/assest/img/bg-overlay.png') repeat;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0px;
    left: 0px;
  } */

@media only screen and (max-width: 600px) {
    .pagebox.home .contentbox .sliderbox .carousel{min-height: 400px;}
    .pagebox.home .contentbox .newsbox_product li{margin: 0;}
    .pagebox.home .contentbox .newsbox_product .desc{height: 4rem; font-size: 13px; line-height: 1.5; }
    .pagebox.home .contentbox .productbox .searchbox{height: auto;}
    .pagebox.home .contentbox .productbox .searchbox .by_category,.pagebox.home .contentbox .productbox .searchbox .by_function,.pagebox.home .contentbox .productbox .searchbox .by_industry { background-size: cover; height: 200px;}
    .pagebox.home .contentbox .productbox .searchbox .by_wavelenght{height: 200px;}
    .pagebox.home .contentbox .productbox .searchbox .by_wavelenght .title{margin-top: 16px ; }
    .pagebox.home .contentbox .productbox .searchbox .title{margin-top: 0 ; padding-top: 48px;}
    .pagebox.home .contentbox .productbox .searchbox .title h3{margin: 8px 0;}
    .pagebox.home .contentbox .productbox .searchbox i{width: 36px; height: 36px; font-size: 1.3rem;}
    .pagebox.home .contentbox .productbox .searchbox i.small{width: 24px; height: 24px; font-size: 1rem;}
    .pagebox.home .contentbox .product-searchbox li a{max-height: 140px; padding: 35px 5%; text-align: center;  border: 1px solid #999;  transition: .3s;}
    .pagebox.home .contentbox .product-searchbox li h2{font-size:22px;}

    .pagebox.home .contentbox .newsbox {margin: 50px auto;}
    .pagebox.home .contentbox .newsbox .subject{margin: 0;}
    .pagebox.home .contentbox .newsbox .subjectbox .more{margin-left:0;}
    .pagebox.home .contentbox .newsbox li .desc{margin-top: 0px; }
    
    .pagebox.home .contentbox .servicebox .row{position: relative; text-align: center; height:200px; }
    .pagebox.home .contentbox .servicebox .title{margin-top: 16px;}
    .pagebox.home .contentbox .linkebox li{height: 200px;}
    .pagebox.home .contentbox .linkebox li img{width: 100%; object-fit: cover;}
}

@media only screen and (min-width: 1024px) and (max-width: 1440px) {
    
    .pagebox.home .contentbox .sliderbox .carousel{min-height: 475px; }
    .pagebox.home .contentbox .newsbox_product li{padding: 20px;}
    .pagebox.home .contentbox .newsbox_product .label span{font-size: 11px;}
    .pagebox.home .contentbox .newsbox_product .desc{height: 4rem; font-size: 13px; line-height: 1.5; }
    .pagebox.home .contentbox .newsbox_product .img{padding: 0;}
    .pagebox.home .contentbox .newsbox {margin: 50px auto;}
    .pagebox.home .contentbox .newsbox .subject{margin: 0; }
    .pagebox.home .contentbox .newsbox li .desc{margin-top: 0px;}
    .pagebox.home .contentbox .newsbox li .catergroy{font-size: 11px;}
}

/***************
news
****************/
.pagebox.news .banner{position: relative; width: 100%; height: 420px; background: url('https://www.ushio.com.tw/assest/img/banner/news.jpg') no-repeat center; background-size: cover; border: 1px solid #fff; }
.pagebox.news .banner .titlebox{margin:8% 5%;}
.pagebox.news .banner .titlebox h3{color: #018a71; font-weight: bold;}

.pagebox.news .news_header .subject {position: relative;  font-weight: 700; margin: 16px 0; }
.pagebox.news .news_header .subject h2{display: inline-block; font-family: Impact; margin-block-start: 0; margin-block-end: 0;}
.pagebox.news .news_header .subject span{ font-size: 36px; line-height: 150%; margin-left:8px; vertical-align: bottom;}
.pagebox.news .news_header .subdesc{font-size: 22px;}
.pagebox.news .news_header .desc{font-size: 18px; line-height: 1.8em;}
.pagebox.news .news_header .imgbox img{width: 100%;}

.pagebox.news .news_tabs{padding-top: 18px;}
.pagebox.news .news_tabs li{display: inline-block; font-size:20px;}
.pagebox.news .news_tabs li a{display: inline-block; color: #018a71;}
.pagebox.news .news_tabs li a::after{content: '｜';  padding:0 8px;}
.pagebox.news .news_list{padding-top: 24px;}


.pagebox.news li .card .cate {border: 1px solid #018a71; font-size:13px; padding: 4px 8px; margin: 0 2rem;}
.pagebox.news li .card .datetime{color:#333; font-size: 14.5px; text-align: left;}
.pagebox.news li .card .datetime i{color:#018a71; vertical-align: sub; margin: -4px 4px; display: inline-block;}
.pagebox.news li .card .card-content{padding: 4px; line-height: 1.8rem;}
.pagebox.news li .card .desc{font-size: 14.5px;  height:auto ; max-height: 3.6rem; overflow: hidden;}


.pagebox.news li .card .card-image{height: 250px;}
.pagebox.news li .card .card-image img{width: 100%; height: 100%; object-fit: cover;}
.pagebox.news li .card .card-reveal .card-title{line-height: 2rem; font-size:20px;}
.pagebox.news li .card .card-reveal .card-content{padding: 0; font-size: 14.5px;}
/* .pagebox.news li:hover .card-content {box-shadow: 0 2px 2px 0 rgb(0 0 0 / 14%), 0 3px 1px -2px rgb(0 0 0 / 12%), 0 1px 5px 0 rgb(0 0 0 / 20%);} */
.pagebox.news .news_content .select-wrapper{padding-top: 18px;}
.pagebox.news .news_content .select-wrapper input.select-dropdown{border: none;}

.pagebox.news.detail .newscontent{border-top:2px solid #4D4D4D; padding:36px 0;}
.pagebox.news.detail h3{font-weight: bold; color: #4D4D4D; line-height:2.3rem;}
.pagebox.news.detail .back{display: block; text-align: right;}
.pagebox.news.detail .back i{vertical-align: bottom;}
.pagebox.news.detail .notebox{padding: 16px 0; margin-bottom: 2em;}
.pagebox.news.detail .datetime{font-size: 18px;}
.pagebox.news.detail .descbox{font-size: 14.5px; line-height: 2;}

#newstabbox{border-top:2px solid #018a71;}
@media only screen and (max-width: 600px) {
  .pagebox.news .news_tabs li {font-size: 18px;}
  .pagebox.news .banner{height: 250px;}
  .pagebox.news .banner .titlebox{margin:20% 5%;}
  .pagebox.news .newcontent{border: none; padding-top: 0;}
  .pagebox.news li .card .desc{margin: 1rem 0; padding: 4px; width: 100%; display: block;}
  
}


@media only screen and (min-width: 1024px) and (max-width: 1680px) {
  .pagebox.news li .card .cate span{font-size: 12px; padding: 4px;}
  .pagebox.news li .card .datetime{font-size: 14px; padding: 4px; text-align: left;}
  .pagebox.news li .card .desc{padding:2px 4px; height:auto ; max-height: 3.6rem;}
  .pagebox.news li .card .datetime i{display: none;}
  .pagebox.news li .card .card-content{padding: 4px;}
  .pagebox.news.detai .row .col{padding: 0;}
}




/***************
tech
****************/
.pagebox.tech .banner{position: relative; width: 100%; height: 420px; background: url('https://www.ushio.com.tw/assest/img/banner/technical.jpg') no-repeat center; background-size: cover; border: 1px solid #fff;}
.pagebox.tech .banner .titlebox{margin:8% 5%;}
.pagebox.tech .banner .titlebox h3{color: #018a71; font-weight: bold;}
.pagebox.tech .banner .titlebox h6{color: #000;}
.pagebox.tech .newsbox {margin: 100px auto 50px auto;}
.pagebox.tech .newsbox .divider{margin-bottom: 30px;}

/* .pagebox.tech .subject {position: relative;  font-weight: 700; }
.pagebox.tech .subject h2{display: inline-block; font-family: Impact; margin-block-start: 0; margin-block-end: 0; color: #018a71;}
.pagebox.tech .subject span{vertical-align: super; font-size: 18px; position: absolute; top: 4px; margin-left:8px;  }
.pagebox.tech .subject span b{display: block; font-size: 24px; color: #018a71;}
.pagebox.tech .subject {position: relative;  font-weight: 700; margin-bottom: 0px;}
.pagebox.tech .subject h2{display: inline-block; font-family: Impact; margin: 0; margin-block-start: 0; margin-block-end: 0; color: #018a71;}
.pagebox.tech .subject b{margin-right: 6px;}
.pagebox.tech .subject span.cn{display: block; color: #333; font-size: 18px; font-weight: bold; text-align: right;}
.pagebox.tech .newsbox .subject{margin:60% 0 0 0}
.pagebox.tech .newsbox .subject {position: relative;  font-weight: 700; margin-bottom: 25px;}
.pagebox.tech .newsbox .subject h2{display: inline-block; font-family: Impact; margin: 0; margin-block-start: 0; margin-block-end: 0; color: #018a71;}
.pagebox.tech .newsbox .subject span{vertical-align: super; font-size: 18px; position: absolute; top: 2px; margin-left:8px;  }
.pagebox.tech .newsbox .subject span b{display: block; font-size: 24px; color: #018a71;}
.pagebox.tech .newsbox .more{text-align: center;  color: #018a71; }
.pagebox.tech .newsbox .more a{font-size: 14.5px; display: block; border: 1px solid #018a71; padding: 8px 8px 0 8px; margin-top: 8px; color:#018a71;}
.pagebox.tech .newsbox .more span{ display:inline-block; vertical-align: top; color: #333;} */

.pagebox.tech .newsbox ul{margin-block-start: 8px; line-height: 1.8rem;}
.pagebox.tech .newsbox li .datetime{font-size: 14.5px; text-align: right;}
.pagebox.tech .newsbox li .datetime i{vertical-align: text-bottom; margin-right: 8px; display: inline-block;}

.pagebox.tech .newsbox li .catergroy{font-size: 13px; }
.pagebox.tech .newsbox li .catergroy span{border: 1px solid #018a71; color: #018a71; padding: 2px;}
.pagebox.tech .newsbox li .desc{font-size: 14.5px; height: 5.5rem; overflow: hidden;}
.pagebox.tech .newsbox li .card-image{height: 250px;}
.pagebox.tech .newsbox li .card-image img{max-height: 250px; height: 100%; object-fit: cover;}
.pagebox.tech .newsbox li .card-content .card-title{height: 4.5rem; overflow: hidden; font-size: 20px; }
.pagebox.tech .newsbox li .card-content .cate span{border: 1px solid #018a71; font-size: 13px; padding: 4px 8px;}
.pagebox.tech .newsbox li .card .datetime i{color: #018a71; vertical-align: sub;  margin: -4px 4px;}

.pagebox.tech .article {margin: 50px auto 0 auto;}
.pagebox.tech .article ul{margin-block-start: 8px; line-height: 1.8rem;}
.pagebox.tech .article li .datetime{font-size: 14.5px;}
.pagebox.tech .article li .desc{font-size: 14.5px; line-height: 1.8rem; letter-spacing: .1rem; height: 3.5rem; overflow: hidden;}
.pagebox.tech .article li .card-image{height: 250px;}
.pagebox.tech .article li .card-image img{max-height: 250px; height: 100%; object-fit: cover;}
.pagebox.tech .article li .card-content .card-title{height: 2.5rem; overflow: hidden; font-size: 20px;}

.pagebox.tech .article li .catergroy {border-top:1px solid #018a71 ; padding: 16px 0;}
.pagebox.tech .article li .catergroy li{font-size: 16px; color: #018a71; list-style: square; margin-left: 1.5em; }

.pagebox.tech.detail .banner{position: relative; width: 100%; height: 420px; background: url('https://www.ushio.com.tw/assest/img/banner/all01.jpg') no-repeat center; background-size: cover; border: 1px solid #fff;}
.pagebox.tech.detail .banner .titlebox{margin:8% 5%; text-align: center;}
.pagebox.tech.detail .banner .titlebox h1,.pagebox.tech.detail .banner .titlebox h3{color: #fff; margin: 12px 0;}
.pagebox.tech.detail .banner .titlebox h3{font-weight: normal;}

/* .pagebox.tech.detail .subject {position: relative;  font-weight: 700; }
.pagebox.tech.detail .subject h2{display: inline-block; font-family: Impact; margin-block-start: 0; margin-block-end: 0; padding-top: 10px; color: #018a71; }
.pagebox.tech.detail .subject span{font-size: 32px; line-height: 150%;} */

.pagebox.tech.detail .article_header .subject{margin: 60px 0;}
.pagebox.tech.detail .article_header .desc{font-size: 16px; line-height: 2;}
.pagebox.tech.detail .article_header .imgbox{margin: 180px 0 0 0;}
.pagebox.tech.detail .article_header .imgbox img{width: 100%;}
.pagebox.tech.detail .article_body {margin: 0 auto; padding: 64px 0;}
.pagebox.tech.detail .article_body .content{font-size: 16px; line-height: 2;}

@media only screen and (max-width: 600px) {
  .pagebox.tech .newsbox li .card-content .card-title{ font-size: 20px; }
  .pagebox.tech .newsbox li .card-content .cate span{font-size: 11px;}
}


@media only screen and (min-width: 1024px) and (max-width: 1680px) {
  .pagebox.tech .newsbox li .card-content .card-title{font-size: 18px; height: 3.5rem; line-height: 1.5; overflow: hidden; }
  .pagebox.tech .newsbox li .card-content {padding: 12px;}
  .pagebox.tech .newsbox li .card-content .cate span{font-size: 11px;}
  .pagebox.tech .newsbox li .card .datetime i {display: none;}
}



/***************
contactus
****************/

.pagebox.contactus .banner{position: relative; width: 100%; height: 420px; background: url('https://www.ushio.com.tw/assest/img/banner/contact.jpg') no-repeat center; background-size: cover; border: 1px solid #fff;}
.pagebox.contactus .banner .titlebox{margin:8% 5%;}
.pagebox.contactus .banner .titlebox h3{color: #018a71; font-weight: bold;}
.pagebox.contactus .contactus_header .subject {position: relative;  font-weight: 700; margin: 16px 0; }
.pagebox.contactus .contactus_header .subject h2{display: inline-block; font-family: Impact; margin-block-start: 0; margin-block-end: 0; color:#018a71; margin: initial;}
.pagebox.contactus .contactus_header .subject span{color:#018a71; font-size: 32px; line-height: 150%; vertical-align: baseline;}
.pagebox.contactus .contactus_header .subdesc{font-size: 20px; line-height: 1.5;}
.pagebox.contactus .contactus_header .desc{font-size: 18px; line-height: 1.8em;}
.pagebox.contactus .contactus_header .imgbox img{width: 100%;}



/***************
faq
****************/

.pagebox.faq .banner{position: relative; width: 100%; height: 420px; background: url('/tw/assest/img/banner/faq.jpg') no-repeat center; background-size: cover; border: 1px solid #fff;}
.pagebox.faq .banner .titlebox{margin:8% 5%;}
.pagebox.faq .banner .titlebox h3{color: #018a71; font-weight: bold;}
.pagebox.faq .banner .titlebox h6{color: #000;}

.pagebox.faq .faq_header .subject {position: relative;  font-weight: 700; margin: 16px 0; }
.pagebox.faq .faq_header .subject h2{display: inline-block; font-family: Impact; margin-block-start: 0; margin-block-end: 0;}
.pagebox.faq .faq_header .subject span{ font-size: 36px; line-height: 150%; margin-left:8px; vertical-align: bottom;}
.pagebox.faq .faq_header .subdesc{font-size: 22px;}
.pagebox.faq .faq_header .desc{font-size: 18px; line-height: 1.8em;}
.pagebox.faq .faq_header .imgbox img{width: 100%;}

.pagebox.faq .faq_tabs{padding-top: 18px;}
.pagebox.faq .faq_tabs li{display: inline-block; font-size:22px;}
.pagebox.faq .faq_tabs li a{display: inline-block; color: #018a71; font-weight: bold; }
.pagebox.faq .faq_tabs li a::after{content: '｜';  padding:0 8px;}
.pagebox.faq .faq_list{border-top:2px solid #018a71; padding-top: 24px;}

.pagebox.faq .faq_subject {display: block; clear: both; padding: 0; margin: 60px 0;}
.pagebox.faq .faq_subject .subject {position: relative;  font-weight: 700; margin: 16px 0; }
.pagebox.faq .faq_subject .subject h2{display: inline-block; font-family: Impact; margin-block-start: 0; margin-block-end: 0;}
.pagebox.faq .faq_subject .subject span{ font-size: 36px; line-height: 150%; margin-left:8px; vertical-align: bottom;}
.pagebox.faq .faq_subject .subdesc{font-size: 22px;}


/***************
about
****************/
.pagebox.about .banner{position: relative; width: 100%; height: 420px; background: url('https://www.ushio.com.tw/assest/img/about/about_banner.jpg') no-repeat center; background-size: cover; border: 1px solid #fff; margin-bottom: 50px; }
.pagebox.about .banner .titlebox{margin:8% 5%;}
.pagebox.about .banner .titlebox h3 {color: #018a71; font-weight: bold;}

.pagebox.about .about_content{padding-top: 18px; max-width: 1300px; margin: 0 auto;}
.pagebox.about .about_content .expect{line-height: 1.6em; color: #333; font-size: 1.1em;}
.pagebox.about .about_content .philosophy {max-width: 100%;}
.pagebox.about .about_content .signname{text-align: right; font-size: 1.2em;}
.pagebox.about .about_content .signimg{width: 150px; display: inline-block;  margin-left: 16px;}
.pagebox.about .about_content .signimg img {vertical-align: middle;}


/* company */
.company-pageList { margin: 20px auto; letter-spacing: -0.4em; text-align: center;}
.company-pageList-li {display: inline-block; letter-spacing: normal; font-size: 16px; border-left: 1px solid #ccc;}
.company-pageList-li:last-child { border-right: 1px solid #ccc;}
.company-pageList-a { display: block; padding: 7px 20px;}
.company-pageList-a.is-current {color: #009a74;}

.pagebox.about .compony_content{padding-top: 18px; max-width: 1300px; margin: 0 auto;}

@media only screen and (max-width: 600px) {
  .pagebox.about .banner{height: 150px; width: 100%; background-size: cover; margin-bottom: 0;}
}


@media only screen and (min-width: 1024px) and (max-width: 1680px) {
 
  
} 



/* .pagebox.about .about_tabs{padding-top: 18px;}
.pagebox.about .about_tabs li{display: inline-block; font-size:20px;}
.pagebox.about .about_tabs li a{display: inline-block; color: #018a71; font-weight: 500; }
.pagebox.about .about_tabs li a::after{content: '｜';  padding:0 8px;}


.pagebox.about .newsbox {margin: 50px auto 25px auto;}

.pagebox.about .newsbox .divider{margin-bottom: 30px;}
.pagebox.about .newsbox ul{margin-block-start: 8px; line-height: 1.8rem;}
.pagebox.about .newsbox li .datetime{font-size: 14.5px; text-align: right;}
.pagebox.about .newsbox li .datetime i{vertical-align: text-bottom; margin-right: 8px;}
.pagebox.about .newsbox li .catergroy{font-size: 13px; }
.pagebox.about .newsbox li .catergroy span{border: 1px solid #018a71; color: #018a71; padding: 2px;}
.pagebox.about .newsbox li .desc{font-size: 14.5px; height: 5.5rem; overflow: hidden;}
.pagebox.about .newsbox li .card-image{height: 250px;}
.pagebox.about .newsbox li .card-image img{max-height: 250px; height: 100%; object-fit: cover;}
.pagebox.about .newsbox li .card-content .card-title{height: 4.5rem; overflow: hidden; font-size: 20px; }
.pagebox.about .newsbox li .card-content .cate span{border: 1px solid #018a71; font-size: 13px; padding: 4px 8px;}
.pagebox.about .newsbox li .card .datetime i{color: #018a71; vertical-align: sub;  margin: -4px 4px;}

.pagebox.about .companybox {background-color: #f8f8f8;}
.pagebox.about .companybox .imageList {overflow: hidden; position: relative;  }
.pagebox.about .companybox .imageList li{padding-top: 20px; padding-left: 20px; }
.pagebox.about .companybox .imageList-a {overflow: hidden; position: relative; display: block; width: 100%;  }
.pagebox.about .companybox .imageList-a:hover .imageList-photo { transform: scale(1.2);  }
  
.pagebox.about .companybox .imageList-photo {
    position: relative;
    transition: all 0.3s ease;
    z-index: 9;
    width: 100%;
    max-height: 270px;
}
  
.pagebox.about .companybox .imageList-over {
    position: absolute;
    bottom: 0;
    left: 0;
    display: table;
    padding: 10px 40px 10px 15px;
    width: 100%;
    min-height: 40px;
    line-height: 1.3;
    color: #fff;
    font-size: 14px;
    background-color: rgba(0, 0, 0, 0.65);
    z-index: 10;
  }
  
.pagebox.about .companybox .imageList-txt {
    display: table-cell;
    vertical-align: middle;
  }
  
.pagebox.about .companybox   .imageList .icon-angle-right {
    position: absolute;
    top: 50%;
    right: 10px;
    margin-top: -9px;
    font-size: 18px;
  }
  
.contents-mainImage.mb25 + .pagebox.about .companybox .imageList {
    margin-top: -25px;
}


.pagebox.about .companybox .opacity a:hover {
    filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=55);
    opacity: 0.55;
}


@media only screen and (max-width: 600px) {
  .pagebox.about .newsbox li .card-content .card-title{ font-size: 20px; }
  .pagebox.about .newsbox li .card-content .cate span{font-size: 11px;}
}


@media only screen and (min-width: 1024px) and (max-width: 1680px) {
  .pagebox.about .newsbox li .card-content .card-title{font-size: 18px; height: 3.5rem; line-height: 1.5; overflow: hidden; }
  .pagebox.about .newsbox li .card-content {padding: 12px;}
  .pagebox.about .newsbox li .card-content .cate span{font-size: 11px;}
  .pagebox.about .newsbox li .card .datetime i {display: none;}
  
} */


/***************
info
****************/
.pagebox.info .banner{position: relative; width: 100%; height: 420px; background: url('/assest/img/banner/info2.jpg') no-repeat center center ; background-size: cover; border: 1px solid #fff; margin-bottom: 50px; }
.pagebox.info .banner .titlebox{margin:8% 5%;}
.pagebox.info .banner .titlebox h3 {color: #018a71; font-weight: bold;}

@media only screen and (max-width: 600px) {
  .pagebox.info .banner{height: 150px; width: 100%; background-size: cover; margin-bottom:0}
}

.pagebox.info .info_content{padding-top: 18px;  margin: 0 auto;}
.pagebox.info .info_content .intro{line-height: 2em; font-weight: 400; color: #2D2D2D; font-size:1.4rem/1.714;}
.pagebox.info .info_content h1{font-size: 42px; letter-spacing: .1em; text-align: center;}
.pagebox.info .info_content h1 span{font-size: 76px;}
.pagebox.info .info_content .threemin{
  padding: 100px 0 50px 0; 
  background: #f3f3f3; /* fallback for old browsers */
  background: -webkit-linear-gradient(to right,  #f3f3f3, #fff); /* Chrome 10-25, Safari 5.1-6 */
  background: linear-gradient(to bottom, #f3f3f3, #fff); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
}
.pagebox.info .info_content .threemin .titleicon {max-width: 96px; max-height: 96px; margin-right: 1rem; vertical-align: sub;}
.pagebox.info .info_content .threemin .titleicon img{max-width: 96px; margin: 0 auto; }

.pagebox.info .info_content .card .card-icon{max-width: 96px; margin: 0 auto; padding: 50px 0 25px 0;}
.pagebox.info .info_content .card .card-title{font-size: 32px; font-weight: 400; text-align: center; letter-spacing: .1em; color: #018B71;}
.pagebox.info .info_content .card .card-title span{font-size: 72px;}
.pagebox.info .info_content .card .card-arrow{
  position: absolute;
  bottom: 10px;
  right: 10px;
  width: 25px;
  height: 25px;
  background: url(https://www.ushio.co.jp/images/company/about/img_arrow.png) no-repeat;
}

.white-popup{
  position: relative;
  background: #FFF;
  padding: 40px;
  width: auto;
  max-width: 1366px;
  margin: 35px auto;
  text-align: center;
}



.white-popup h2{font-size: 56px; text-align: center; color: #018B71; border-bottom: 1px solid #ccc; position: relative;}
.white-popup h2 span{font-size: 78px; font-family:'Courier New', Courier, monospace; font-weight: 800;}
.white-popup h2 i{width: 90px; position: absolute; left: 0px; bottom: 0px;}
.white-popup h2 i img{width:auto; max-width: 100%;}
.white-popup h5{padding: 15px 0; color: #018B71; font-size: 32px;}
.white-popup img.mfp-avatarUrl{max-width: 100%; width:auto; padding: 30px 0;}
.white-popup hr.mfp-dot{background: -svg-linear-gradient(to right,#b8b8b8,#b8b8b8 25%,transparent 25%,transparent 100%);
  background: -owg-linear-gradient(to right,#b8b8b8,#b8b8b8 25%,transparent 25%,transparent 100%);
  background: linear-gradient(to right,#b8b8b8,#b8b8b8 25%,transparent 25%,transparent 100%);
  background-size: 4px 4px;
  height: 1px;
  border: none;
  margin-top: 10px;
  margin-bottom: 20px;
}

.white-popup .mfp-title{line-height:normal;}
.white-popup .mfp-desc{ text-align: left; font-size: 14px;  font-size: 1rem;  font-family: Noto Sans JP,"游ゴシック",YuGothic,Hiragino Kaku Gothic ProN,Hiragino Kaku Gothic Pro,Meiryo,sans-serif; background-color: #fff;}
.white-popup .mfp-linktext{margin: 40px auto; color: #009a74;}

/***************
charitable
****************/

.pagebox.charitable .banner{position: relative; width: 100%; height: 420px; background: url('https://www.ushio.com.tw/assest/img/banner/charitable.jpg') no-repeat center; background-size: cover; border: 1px solid #fff;}
.pagebox.charitable .banner .titlebox{margin:8% 5%;}
.pagebox.charitable .banner .titlebox h3{color: #018a71; font-weight: bold;}
.pagebox.charitable .banner .titlebox h6{color: #000;}
.pagebox.charitable .charitable_header .subject {position: relative;  font-weight: 700; margin: 16px 0; color: #018a71;}
.pagebox.charitable .charitable_header .subject h2{display: inline-block; color: #018a71; font-family: Impact; margin-block-start: 0; margin-block-end: 0; vertical-align: super;}
.pagebox.charitable .charitable_header .subject span{ font-size: 28px; line-height: 150%; vertical-align: bottom;}
.pagebox.charitable .charitable_header .subdesc{font-size: 18px; line-height: 1.5;}
.pagebox.charitable .charitable_header .desc{font-size: 18px; line-height: 1.8em;}
.pagebox.charitable .charitable_header .imgbox img{width: 70%; }


.pagebox.charitable .charitable_tabs{padding-top: 18px;}
.pagebox.charitable .charitable_tabs li{display: inline-block; font-size:22px; margin: 8px 0;}
.pagebox.charitable .charitable_tabs li a{display: inline-block; color: #018a71; font-weight: bold; }
.pagebox.charitable .charitable_tabs li a::after{content: '｜';  padding:0 8px;}
.pagebox.charitable .charitable_content .select-wrapper{padding-top: 26px;}
.pagebox.charitable .charitable_content .select-wrapper input.select-dropdown{border-bottom: 1px solid #9e9e9e; padding-left: 6px;}
.pagebox.charitable .charitable_list{border-top:2px solid #018a71; padding-top: 24px;}
.pagebox.charitable li .card .cate span{border: 1px solid #018a71; font-size:13px; padding: 4px 8px;}
.pagebox.charitable li .card .datetime{color:#333; font-size: 14.5px;}
.pagebox.charitable li .card .datetime i{color:#018a71; vertical-align: sub; margin: -4px 4px; display: inline-block;}
.pagebox.charitable li .card .desc{font-size: 14.5px; line-height: 1.8rem; height: 3.6rem; overflow: hidden;}

#charitabletabbox{border-top:2px solid #018a71;}

.pagebox.charitable .news_tabs{padding-top: 18px;}
.pagebox.charitable .news_tabs li{display: inline-block; font-size:22px;}
.pagebox.charitable .news_tabs li a{display: inline-block; color: #018a71; font-weight: bold; }
.pagebox.charitable .news_tabs li a::after{content: '｜';  padding:0 8px;}
.pagebox.charitable .news_list{padding-top: 24px;}


.pagebox.charitable li .card .card-image{height: 250px;}
.pagebox.charitable li .card .card-image img{width: 100%; height: 100%; object-fit: cover;}
.pagebox.charitable li .card .card-reveal .card-title{line-height: 2rem;}
.pagebox.charitable li .card .card-reveal .card-content{padding: 0; font-size: 14.5px;}


@media only screen and (max-width: 600px) {
    .pagebox.charitable .charitable_header .imgbox img{width: 100%;}
    .pagebox.charitable .charitable_header .desc{font-size: 14.5px;}
    .pagebox.charitable .news_tabs li {font-size: 18px;}
    .pagebox.charitable .charitable_tabs{padding-top: 0;}
    .pagebox.charitable .charitable_tabs li{font-size: 18px;}
    .pagebox.charitable .charitable_content .select-wrapper{padding-top: 0;}
    .pagebox.charitable .banner{height: 250px;}
    .pagebox.charitable .banner .titlebox{margin:20% 5%;}
    .pagebox.charitable .banner .titlebox h3{color: #018a71; font-weight: bold;}
    .pagebox.charitable .banner .titlebox h6{color: #fff;}
    .pagebox.charitable .newcontent{border: none; padding-top: 0;}
    
    .pagebox.charitable li .card .cate span{font-size: 11px; padding: 4px;}
    .pagebox.charitable li .card .datetime{font-size: 11px; padding: 4px;}
    
}

@media only screen and (min-width: 1024px) and (max-width: 1680px) {
  .pagebox.charitable .charitable_header .imgbox{margin-block-start: 1em;}
  .pagebox.charitable .charitable_header .imgbox img{width: 100%; }
  .pagebox.charitable .charitable_header .desc{font-size: 14.5px;}
  .pagebox.charitable li .card .cate span{font-size: 11px; padding: 4px;}
  .pagebox.charitable li .card .datetime{font-size: 11px; padding: 4px;}
  .pagebox.charitable li .card .datetime i{display: none;}
}
/***************
product
****************/
.pagebox.product .banner{position: relative; width: 100%; height: 420px; background: url('https://www.ushio.com.tw/assest/img/banner/product.jpg') no-repeat center; background-size: cover; border: 1px solid #fff; }
.pagebox.product .banner .titlebox{margin:8% 5%;}
.pagebox.product .banner .titlebox h3 {color: #018a71; font-weight: bold;}
.pagebox.product .bottomline{border-bottom:2px solid #018a71 ; padding: 30px 0;}

.pagebox.product .product_anchor{padding-top: 18px;}
.pagebox.product .product_anchor li{display: inline-block; font-size: 20px; position: relative; text-align: center;}
.pagebox.product .product_anchor li a{display: inline-block; color: #018a71; }
.pagebox.product .product_anchor li a::after{content: '｜';  padding:0 ;  position: absolute; right: -12px;}

/* .pagebox.product .productbox h3{color:#009774; text-align: left;}
.pagebox.product .productbox h3 span{font-size:26px; font-weight: 700;; margin-right: 8px; font-family: Impact;}
.pagebox.product .productbox h3 i{font-size: 26px; vertical-align: top;} */

.pagebox.product #productcate li .card-image{height: 230px; overflow: hidden;}
.pagebox.product #productcate li .card-image img{width: 100%; height: 100%; object-fit: cover;}
.pagebox.product #productcate li .card-content{font-size:18px; line-height: 2rem; height: 150px; overflow: hidden;}
.pagebox.product #productcate li .card-content .cate{font-size: 22px; color: #333333; font-weight: 700; margin-bottom: 8px; }
.pagebox.product #productcate li .card-content .cate span{color:#018a71;}
.pagebox.product #productcate li:hover .card-content .cate{color: #018a71; transition: 0.5s;}

.pagebox.product #productcate .collapsible{border: none; box-shadow:none;}
.pagebox.product #productcate li .cate{font-size: 22px; color: #333333; font-weight: 700; margin-bottom: 8px; }
.pagebox.product #productcate li .cate span{color:#018a71;  font-size:36px; font-weight: normal; }
.pagebox.product #productcate li:hover .cate{color: #018a71; transition: 0.5s;}
.pagebox.product #productcate .collapsible-body li{line-height: 2; font-size: 18px; list-style:disc;}



.pagebox.product #productfunc li{display: inline-block; min-width:10%; margin:16px 1%; padding:8px 0; border: 1px solid #333; border-radius: 20px; text-align: center; cursor: pointer; font-size: 14.5px; font-weight: 500;}
.pagebox.product #productfunc li:last-child{border: 0; cursor: default;}
.pagebox.product #productfunc li:hover{border-color: #018a71; color: #fff; background-color:#018a71 ; transition: 0.5s;}
.pagebox.product #productfunc li:last-child:hover{background-color: transparent;}

.pagebox.product #productfield li .card-content{font-size:15px; line-height: 2rem; height: 5rem; overflow: hidden; text-align: center; font-weight: 700;}
.pagebox.product #productfield li:hover .card-content{color: #018a71; transition: 0.5s;}


.pagebox.product #productwave {text-align: center;}
#productwave li{list-style: none; text-align: center; height: 26px; line-height: 26px;}
#productwave li.clearfix{display: block; width: 100%; height: 1px; border: 0; background: none; clear: both; padding: 0; margin: 0;} 
#productwave .waveheader{margin-bottom: 10px; line-height: 26px; height: 26px; text-align: center; text-decoration: underline;}
#productwave .wavebody li{ text-decoration: underline;}
#productwave .VUV{background-color: #8787af;}
#productwave .UV-A{background-color:#d8d8ea;}
#productwave .UV-B{background-color:#cccae0;}
#productwave .UV-C{background-color:#99c7ea ;}productwave .IR-A{background-color:#f5c08b ;}
#productwave .IR-B{background-color:#f2a39f ;}
#productwave .IR-C{background-color:#ea7171 ;}
#productwave .IR-A{background-color:#f5c08b ;}
#productwave .vlight{background-color:#d0ecd7 ;}
#productwave .wavebody ul.waveflex{flex: 1; }


#productwave .mod-waveband-childEuv .waveheader{height: 52px; background-color: #e6e6e6; line-height: 52px; }
#productwave .mod-waveband-childEuv .wavebody li{ background-color: #e6e6e6;}

#productwave .mod-waveband-childUvr .waveheader{background-color: #2c3995; border-left-width: 1px; color: #fff; margin-bottom: 0; }
#productwave .mod-waveband-childUvr .waveheader ul{display: flex; padding-inline-start: 0; margin-block-start: 0em; margin-block-end: 0em;}
#productwave .mod-waveband-childUvr .waveheader li{color: #333; flex :1;}
#productwave .mod-waveband-childUvr .wavebody{display: flex; margin-top: 26px;}

#productwave .mod-waveband-childVL .waveheader{height: 52px; background: #2aa840 url('https://www.ushio.com.tw/assest/img/bg_waveband_vlight.png') no-repeat 0 0; line-height: 52px; color: #fff;}

#productwave .mod-waveband-childIR .waveheader{background-color: #e43530; border-left-width: 1px; color: #fff; margin-bottom: 0; }
#productwave .mod-waveband-childIR .waveheader ul{padding-inline-start: 0; margin-block-start: 0em; margin-block-end: 0em;}
#productwave .mod-waveband-childIR .waveheader li{color: #333; }
#productwave .mod-waveband-childIR .wavebody { margin-top: 26px;}
#productwave .mod-waveband-childIR .wavebody ul.col{padding: 0;}
#productwave .mod-waveband-childIR .wavebody ul.col.s6 li{width: 50%; float: left;}




.pagebox.product.search .product_content{padding:0 5%;}
.pagebox.product.search .product_content h1{padding:0 0 0 10px; margin: 0; vertical-align: middle;  font-weight: normal;  font-size: 22px;  border-left: 6px solid #018a71;}
.pagebox.product.search .search_overview{position: relative; margin-top: 15px; padding: 20px; background-color: #eee; font-size: 14.5px;}


.search_overview .row{ margin: 0;}
.search_overview .search_subtotal {margin-top: 1em;}
.search_overview .search_subtotal b{font-size: 32px; color: #018a71; padding:0 8px;}
.search_overview .search_subtotal span{color: #018a71; padding:0 2px;}
.search_overview .search_tools ul{padding: 0; padding-inline-start: 0; margin-block-start: 0;  margin-block-end: 0;}
.search_overview .search_tools li{position: relative; float: right; margin:0 10px; width: 80px; height: 80px;  color: #949494;  text-align: center; background-color: #fff;  padding:8px;}
.search_overview .search_tools li:first-child {margin-left: 0;}
.search_overview .search_tools li i{margin-right: -3px; font-size: 27.5px;}
.search_overview .search_tools li.clearfix{display: block; width: 100%; height: 1px; border: 0; background: none; clear: both; padding: 0; margin: 0;} 

#search_product_box i{color: #018a71; cursor: pointer;}
.search_result{font-size: 14px; color: #333; line-height: 1.4;}
.search_result .phoneview{display: none;}

.search_header li.col{text-align: center; padding: 10px 0; background-color: #e5f4f0;}

.search_body li{font-size: 14px; min-height: 170px; overflow: hidden; line-height:1.5; margin: 16px 0; padding: 16px 0;}
.search_body li:nth-child(even){background-color: #f3f3f3;}
.search_body .img {height: 170px; overflow: hidden;}
.search_body .img img{width: 170px; height: 100%; object-fit: contain;}
/* .search_body .title{padding-top: 60px;} */
.search_body .application{text-align: center;}
.search_body .application li{min-height: auto; height: auto; width: 48%; float: left; background-color: #949494; color: #fff; text-align: center; padding: 4px 0; margin: .5%;}
.search_body .application li:nth-child(even){background:#949494;}
.search_body .wave li{text-align: center; min-height: auto; height: auto; width: 49%; display:inline-block; padding: 0; margin: 0%; line-height: 1; }
.search_body .wave li:nth-child(even){background: none;}


.pagebox.product.detail .product_content {padding: 18px 0;}
.pagebox.product.detail .product_header h3 {color: #018a71; font-weight: 700; text-align: left; line-height: 1.5; border-bottom:2px solid #018a71;}
.pagebox.product.detail .product_header .desc{font-size: 14.5px; line-height: 1.8em; color: #333; margin: 2em 0; ;}
.pagebox.product.detail .product_header .desc ul > li{list-style-type: initial;}
.pagebox.product.detail .product_header .download{margin: 4.5em 0 0 0;}
.pagebox.product.detail .product_header .download a{margin: 0 1em 0 0; font-size: 18px;}
.pagebox.product.detail .product_header .thumbnail{padding:48px 0;}
.pagebox.product.detail .product_body .product_tabs{padding: 18px 0; border-top: 1px solid #018a71; border-bottom: 1px solid #018a71;} 
.pagebox.product.detail .product_body .product_tabs li{display: inline-block; font-size:20px;}
.pagebox.product.detail .product_body .product_tabs li a{display: inline-block; color: #018a71;}
.pagebox.product.detail .product_body .product_tabs li a::after{content: '｜';  padding:0 8px;}
.pagebox.product.detail .product_body .productcontent{padding: 18px 0;}
.pagebox.product.detail .product_body .productcontent img{width: auto; max-width: 100%;}
.pagebox.product.detail .product_body .productcontent ul{list-style-type: initial;  padding-left: 16px}
.pagebox.product.detail .product_body .productcontent ul:not(.browser-default)>li{list-style-type: initial;}

#lineup{overflow-x: auto;}
.splide__slide img {width : 100%; height: auto;}

.pagebox.product.type .banner{position: relative; width: 100%; height: 420px; background: url('https://www.ushio.com.tw/assest/img/banner/all01.jpg') no-repeat center; background-size: cover; border: 1px solid #fff;}
.pagebox.product.type .banner .titlebox{margin:8% 5%; text-align: center;}
.pagebox.product.type .banner .titlebox h3{color: #fff; font-weight: bold;}
.pagebox.product.type .banner .titlebox h6{color: #fff;}


.pagebox.product.type .product_list li .card-image{height: 230px; overflow: hidden;}
.pagebox.product.type .product_list li .card-image img{width: 100%; height: 100%; object-fit: cover;}
.pagebox.product.type .product_list li .card-content{height: 200px; font-size:15px; line-height: 2rem;  overflow: hidden;}
.pagebox.product.type .product_list li .card-content .cate{height: 4rem; overflow: hidden;  font-size: 20px; color: #333333; font-weight: 700; margin-bottom: 8px; }
.pagebox.product.type .product_list li .card-content .cate span{color:#018a71;}
.pagebox.product.type .product_list li .card-content .desc{height: 6rem; overflow: hidden;}
.pagebox.product.type .product_list li:hover .card-content .cate{color: #018a71; transition: 0.5s;}

@media only screen and (max-width: 600px) {
    .pagebox.product .product_anchor li {padding: 8px 0;}
    .pagebox.product .product_anchor li a::after{content: '';  padding:0 ;}
    .pagebox.product #productfunc li{width: 30%;}
    .pagebox.product #productfield li .card-content{padding: 8px;}
    .search_header {display: none;}
    .search_result .phoneview{display: block;}
    .search_result .search_body .img img{width: 100%;}
    .search_result .search_body .wave li{padding: 0;}
    .pagebox.product.detail .product_body .product_tabs{padding: 18px 6px 0 0;}
    .pagebox.product.detail .product_body .product_tabs li  {padding: 8px; text-align: center;}
    .pagebox.product.detail .product_body .product_tabs li a::after{content: '';  padding:0 ;}
}

@media only screen and (min-width: 600px) and (max-width: 1199px)  {
    .search_body .img img{width: 100%;  object-fit: contain;}
    .search_body .application li{width: 100%;}
    .search_body .wave li{width: 100%;}
    .pagebox.product #productfield li .card-content{padding:8px;}
}

@media only screen and (min-width: 1200px) {
  .pagebox.product #productfield li .card-content{padding:8px; height: 3rem; }

}