@charset "utf-8";
/* CSS Document */
.side, .main{padding:1em;}
.innerhtml{line-height:200%;}
.content{padding:3em 0; min-height:55vh;}
/*nav*/
.nav{background: rgba(150,229,255,1.00); margin-top:0.5em;}/*rgba(0,120,180,1.00) 20210319*/
.nav ul{position:relative;}
.nav ul::before{content:""; display:inline-block; width:320px; height:100%; position:absolute; left:0; top:0; background:#004d73; transform:skewX(-30deg);}
.nav ul::after{content:"Everskilled International Co., Ltd."; font-size: 18px; color:#fff; position:absolute; left:0; top:30%;  display:inline-block; width:320px; height:100%; text-align: center; letter-spacing: 0.5px;}
.nav ul li a{color:#004074; font-size:20px; padding:1em;}
.nav ul li a:hover{background:#004d73; color: #fff;}/*#004d73 20210319*/
.nav ul li a.icon{padding-left:0.3em; padding-right:0.3em;}
#header{padding-top:20px; transition:.3s; background:#fff;}
#header .page{padding:0;}
#header.show{}

.nav ul li a.hit{background:#006699;}
.searchbar{text-align:right; color:#999; font-size:15px;}
.searchbar div input{border:none; margin:0; padding:0; outline:none; line-height:25px;}
.searchbar div{display:inline-block; border:1px solid #ccc; margin-right:10px; font-size:14px;}
.searchbar div a{display:inline-block; background:#666; color:#fff; line-height:23px; padding:2px 5px; margin:0;}
.searchbar a{color:#404040;}
/*list*/
.list{padding:1em;}
.list h3.subject{font-weight:normal; margin:0; color:#226EB5;}
.list .frm{width:100%; diaplay:block; float:left; color:#333; padding:10px; transition:.3s;}
.list .frm:hover{color:#014283;}
.list figure img{transition:.3s;}
.list .frm:hover img{transform:scale(1.05, 1.05);}
.list .innerhtml{font-size:16px; line-height: 160%;}
.list .frm:hover p.more{color:#f00;}
.list .frm:hover figcaption{opacity:1;}
.list figure{diaplay:block; line-height:0; overflow: hidden; position:relative;}
.list figcaption{position:absolute; top:0; left:0; width:100%; height:100%; opacity:1; text-align: center; color:#fff; background:rgba(1,66,131,0.6); z-index: 100; font-size: 14px; padding-top:30%; opacity:0; transition:.3s;}
.list .more{text-align:right; margin:0; color:#333; font-size:12px;}
.list .more span{display:inline-block; color:#ccc;}
.list figcaption span{position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%);}
/*#defaultimg{background:linear-gradient(#fff,#ccc); padding:1em 0;}*/
#defaultimg{padding:1em 0;}
/*default use*/
.dapplication{padding:3em 0;}
.dapplication .list a.frm{padding:0; border:1px solid #ccc;}
.dapplication .list section{padding:0.5em; background:#666; color:#fff;}
.dapplication .list h3.subject{text-align:left;}
.dapplication .list .more{vertical-align:middle;}
.dapplication .list .more span{color:#fff; position:relative; vertical-align:middle;}
.dapplication .list .more span::before{content:""; width:15px; height:15px; display:inline-block; margin-right:5px; border-radius:100%; background:#fff; vertical-align:middle;}
.dapplication .list .more span::after{content:""; width:9px; height:9px; display:inline-block; position:absolute; background:linear-gradient(45deg,#666 50%, rgba(255,255,255,0) 50%); transform:translateY(4px) rotate(-135deg) ; left:0;}
.dnews{padding-right:1em;}
.dpop{padding-left:1em;}
.dnews h2.title, .dpop h2.title, .dproduct h2.title{font-size:20px; color:#000; border-bottom:1px solid #069bcd; padding: 0;}
.dnews h2.title span, .dpop h2.title span, .dproduct h2.title span{display:inline-block; border-bottom:3px solid #069bcd; line-height: 2em; margin:0;}
.dnews h2.title{border-bottom:1px solid #cc0033;}
.dnews h2.title span{border-bottom:3px solid #cc0033;}
.dnews .btn, .dpop .btn, .dproduct .btn{float:right; text-align: right;}
.dnews .btn a, .dpop .btn a, .dproduct .btn a{font-size:13px; font-weight:normal; color:#fff; padding:0.3em; border-radius:1em; background: #069bcd;}
.dnews .btn a{background: #cc0033;}
.dnews .innerhtml{font-size:13px; line-height:1.5em;}
.dnews .list h3.subject{color:#0099cc;}
.dproduct .list, .dapplication .list{padding:0.5em;}
.dproduct .list a.frm{background:#fff; box-shadow:none; border:1px solid #ccc; text-align: center;}
.dproduct .list h3.subject{color:#333;}
.dpop h3.subject{color:#017dbd; font-weight:bold; font-size:18px; border-left:5px solid #017dbd; padding-left:1em; margin:0.5em 0;}
/*content*/
.sidetit{font-weight:normal; color:#163f92; background:#efefef; padding:0.5em 0.3em;}
h1.subject{font-size:24px;}
/*news*/
.news .list a.frm{color:#333; padding:0;}
.news .list a.frm:hover .innerhtml{color:#333;}
.news .list a.frm:hover h3.subject{color:#006699;}
.news .list h3.subject{color:#0099cc; padding:0.5em 0;}
.news .list .innerhtml{font-size:14px; color:#333; line-height:160%;}
.news .list .path{text-align:left;}
/*product*/
.list.proall .frm{padding:0; border:1px solid #ccc; text-align:center;}
.list.proall .frm:hover{box-shadow: 0 5px 10px rgba(0,0,0,0.2);}
.list.proall h3.subject{ font-size:18px; color:#333; padding:0.5em;}
.pro1 .frm{border:1px solid #ccc; padding:0.5em; background:#fff;}
.pro1 .frm:hover{box-shadow:0 5px 10px rgba(0,0,0,0.1);}
.pro1 .frm:hover .btn span{background:#006699;}
.pro1 h3.subject{color:#000; font-weight:bold;}
.pro1 .innerhtml{font-size:16px; line-height: 160%;}
.pro1 figure{padding:1em;}
.pro1 a.childlist{display:block; padding:0.3em; color:#333; width:50%; float:left;}
.pro1 a.childlist::before{content:"+"; display:inline-block; font-weight:bold; color:#00b3ef; font-size:16px; margin-right:3px; line-height: 0; transform:translateY(2px); transition:.3s;}
.pro1 a.childlist:hover{color:#000; text-decoration:underline;}
.pro1 a.childlist:hover::before{color:#006699;}
.pro1 .btn{text-align:right;}
.pro1 .btn span{display:inline-block; background:#00b3ef; color:#fff; border-radius:1em; padding:0.5em 0.8em; font-size:16px; cursor:pointer;}
/*prodetail*/
.list.propic a{border:1px solid #ccc; background:#fff; overflow:hidden; line-height: 0;}
.prodetail h1.subject{font-size:22px; margin-top:0; color:#226EB5;}
.prodetail .col-6, .prodetail .col-12{padding:0 1em;}
.prodetail .col-6 img{border:10px solid #fff; filter: drop-shadow(0 -7px 5px rgba(0,0,0,0.1));}
.prodetail h4.subtit{margin-bottom:0.5em; color:#999; border-bottom:1px solid #ccc;}
.prodetail h4.subtit span{display:inline-block; padding:0.3em 1em; border-radius:0.5em 0.5em 0 0; border:1px solid #ccc; border-bottom:none; transform:translateY(2px); background:#fff;}
.prodetail .innerhtml img{border: 0;box-shadow: 0;}



/*faq*/
.qa .box{display: none;}
.qa .box-open{display:block;}

/*footer*/
#footer{font-size:18px; color:#333; background:#efefef; word-break: break-all; line-height: 1.5em; padding:1em ; border-bottom:5px solid #0099cc;}
#footer p{margin:0.3em 0; }
#footer a{color:#333; padding:0.5em 0; text-align: center;}
#footer a:hover{text-decoration:underline;}