/* .testFont { font-family:"Times New Roman"; font-size:2rem; } */
/* 共用 */
.title { color:#1d2088; font-size:2rem; line-height:50px; }
.more { padding:7px 30px; border-radius: 50px; border:1px solid #1d2088; color:#1d2088; display: inline-block; background-color: transparent; }
.more.sml { padding:7px 45px; }
.more:hover { background-color:#1d2088; color:#fdd000; text-decoration: none; }
.mh3 { height:30px; }
.mh6 { height:60px; }

.loading { background-color:#fdd000; position: fixed; top:0; left:0; width:100%; height:100%; z-index:10000; }
.loading img { width:auto; padding-top:30vh; }

.logo { height:160px; width:160px; left:120px; }
.logo img { padding-top:15px; width:auto; }

.top { position: relative; }
.top .topbnr .bnr { width:100%; height:100vh; }
/* 圖片放大 */
@keyframes zoomin {
    0% { transform: scale(1); }
    100% { transform: scale(1.1); }
}

.top .topmenu { position: absolute; top:0px; left:0px; width:100%; }
/* .top .topmenu .menu { float:right; } */
.top .topmenu .menu .mbtn { float:left; position: absolute; width:80px; height:80px; color:#ffffff; font-size:1.5rem; border:none; }
.top .topmenu .menu .mbtn:hover { background-color: #bd9f77; }
.top .topmenu .menu .envelope_btn { right:160px; top:0px; }
.top .topmenu .menu .search_btn { right:80px; top:0px; }
.top .topmenu .menu .menu_btn { right:0px; top:0px; z-index:10; }

.top .topmenu .menu .mb1 { background-color:rgba(0,0,0,0.2); }
.top .topmenu .menu .mb2 { background-color:#000000; }

.top .topmenu .subject { position: absolute; top:-100vh; height:100vh; width:100%; background-color:#303030; z-index:9; transition: top 0.3s; overflow:hidden; }
.top .topmenu .subject .toplogo { height:80px; padding:10px 0px; background-color:#66493d; text-align: center; }
.top .topmenu .subject .toplogo img { width:auto; }
.top .topmenu .subject .content { max-width:390px; padding:15px; margin:0 auto; }
.top .topmenu .subject .content ul { text-align: left; padding:60px 0px; }
.top .topmenu .subject .content ul .submenu { border-top: 1px solid #262626; padding:20px 0px; }
.top .topmenu .subject .content ul .submenu a { color:#ffffff; font-size:1.2rem; text-decoration: none; }
.top .topmenu .subject .content ul .submenu .name { color:#8a7457; }
.top .topmenu .subject .content ul .submenu .date { color:#ababab; }


.product { padding:80px 0px; background-color:#f3fafe; }
.product .items { margin:40px 0px; }
.product .pd .des { padding:20px; }
.product .pd .des a { text-decoration: none; }
.product .pd .des a:hover > .pdname { color:#83b938; }
.product .pd .des .pdname { color:#474747; font-size:1.25rem; padding-bottom:10px; }
.product .pd .des .price { white-space: nowrap; font-family:"Helvetica"; }
.product .pd .des .price1 { color:#1d2088; font-size:0.875rem; }
.product .pd .des .offer { font-size:1rem; font-weight: bold; }
.product .pd .des .price2 { color:#ababab; font-size:0.875rem; }

.news { padding:80px 0px; background: url("./images/img_over1.png") repeat-x center top,url("./images/img_over2.png") repeat-x center bottom; }
.news .new { display: flex; margin-top:40px; }
.news .new .newt { flex:5; text-align: left; color:#303030; text-decoration:none; word-break: break-all; }
.news .new .newt:hover { color:#1d2088; }
.news .new .date { flex:3; color:#1b8bba; font-size:0.875rem; }
.news .more { margin-top:40px; }

.epure { padding:80px 0px; background-color:#f3fafe; }
.epure .ytcont { padding:0px 100px; }
.epure .ytcont .name { color:#1d2088; font-size:1.75rem; }
.epure .ytcont .content { padding:40px 0px; text-align: justify; }

.contactus { color:#fff; padding:80px 0px; background: url("./images/img_over3.png") repeat-x center bottom,url("./images/bg_foot.jpg") no-repeat center center; background-size:auto,cover; }
.contactus .name { font-size:1.5rem; margin-bottom:40px; }
.contactus .content { margin-bottom:20px; }
.contactus .more { color:#fff; border:1px solid #fff; }
.contactus .more:hover { color:#fdd000; border:1px solid #1d2088; }

.contactus .linelink img { max-width:110px; }
.contactus .linelink .lineleft { position: relative; }
.contactus .linelink .lineleft .mask { position: absolute; left:0; right:0; top:0; bottom:0; background-color:rgba(255,255,255,0.4); display: none; }
.contactus .linelink .lineleft:hover > .mask { display: block; cursor: pointer; }
.contactus .linecont { padding-left:20px; }
.contactus .linecont > div { margin-bottom:5px; }
.contactus .linecont .lineid { color:#fff; text-decoration: none; }
.contactus .linecont .lineid:hover { color:#1d2088; }

/************************** video rwd **************************/
.video-container {
	position: relative;
	padding-bottom: 56.25%;
	padding-top: 0px;
	height: 0;
	overflow: hidden;
}

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

.video-container-4by3 {
	position: relative;
	padding-bottom: 75%;
	padding-top: 0px;
	height: 0;
	overflow: hidden;
}

.video-container-4by3 iframe, .video-container object, .video-container embed {
	position: absolute;
	top: 0;left: 0;
	width: 100%;
	height: 100%;
}

/* amination area init */
/* .cont, .prod,.btmbnr, .newcont { transform:translateY(100px); opacity: 0; } */
.upslideAni { animation:upslide 2s; transform:translateY(0px); opacity: 1; }
/* animation */
@keyframes upslide {
    0% { transform:translateY(100px); opacity: 0; }
    100% { transform: translateY(0px); opacity: 1; }
}

@media (min-width:1550px){
    .product .container,
    .news .container,
    .epure .container,
    .contactus .container,
    .footer .contrainer { max-width:1520px; }

}

@media (max-width:1199.98px){
    .logo { left:50px; }
}

@media (max-width:1199.98px) and (min-width:992px){
    /* .top .topbnr .bnr { height:50vh; } */
    
    .news .new { margin-top:20px; }
    .epure .ytcont { padding:0px 60px; }
}

@media (min-width:992px){
    .contactus .linelink { display: flex; max-width:300px; margin:0px auto; }
}

@media (max-width:991.98px){
    .news .new { display: block; }
    .news .new .newt { flex:none; }
    .news .new .date { flex:none; text-align:left; margin-top:10px; }
    .news .more { margin:40px 0px; }

    .epure .ytcont { padding:0px 15px; }
    .epure .ytcont .name { margin-top:60px; }
}



@media (min-width:768px) and (max-width:991.98px){
    .logo { height:120px; width:120px; }
    .logo img { padding-top:15px; width:auto; height:80px; }
    /* .top .topbnr .bnr { height:50vh; } */
    .top .logo img { width:45%; }

    .news .new .newt { font-size:1.2rem; }
    .news .new .date { font-size:1rem; }

    .contactus .name { margin-bottom:20px; }

}

/* @media (max-width:991.98px) and (orientation: landscape){
    .top .topbnr .bnr { height:100vh; }
} */

@media (min-width:768px){

    .ashin .cont { width:80%; margin:0 auto; }
    .ashin .cont .ashtxt { width:50%; float:left; height:200px; }
    .ashin .cont .ashimg { width:50%; float:left; }
    .ashin .cont .ashimg img { margin-top:20px; max-width:400px; }
    
    /* .product .pd { position:relative; }
    .product .pd .des { background: url("./images/img_pdbg.png") repeat-x; position: absolute; left:50%; transform:translate(-50%); bottom:0px; color:#ffffff; opacity:0; transition:all .2s ease-in-out; padding-top:40px; }
    .product .pd:hover .des { opacity:1; }
    .product .pd .des .price { margin:10px 0px; } */

}

@media (max-width:767.98px){
    .logo { left:30px; }
    
    .product .pd { margin:10px 0px; }
    .product .pd .des { margin:20px 0px; }

    .contactus .name { margin-bottom:20px; }
}

/* @media (max-width:767.98px) and (min-width:576px){
    .title { font-size:4rem; line-height:70px; }
    .subtitle { font-size:1rem; margin-bottom:60px; }
    .more { padding:15px 70px; font-size:1.5rem; }
    .more.sml { padding:15px 90px; }
    
    .mh6 { height:120px; }
    
    .top .topmenu .menu .mb2 { width:110px; height:110px; font-size:3rem; }
    .top .topmenu .subject .toplogo { height:110px; padding:25px 0px; }

    .top .topmenu .subject .content ul .submenu { padding:25px 0px; }
    .top .topmenu .subject .content ul .submenu a { font-size: 2rem; }

    .product { padding:120px 0px; }
    .product .pd { margin:40px 0px; }
    .product .pd .des .pdname { font-size:2rem; }
    .product .pd .des .price1 { font-size:1.8rem; }
    .product .pd .des .offer { font-size:2.4rem; }
    .product .pd .des .price2 { font-size:1.5rem; }
    .product .row .fullad { margin-bottom:80px; }

    .news { padding:120px 0px; }
    .news .new { margin-top:70px; }
    .news .new .newt { font-size:2rem; }
    .news .new .date { font-size:1.5rem; }
    .news .more { margin:60px 0px; }

    .epure .ytcont .name { margin-top:80px; font-size:3rem; }
    .epure .ytcont .content { padding:50px 0px; font-size:1.5rem; }

    .contactus { padding:120px 0px; }
    .contactus .name { font-size:3rem; }
    .contactus .content { font-size:1.5rem; margin-bottom:40px; }
    .contactus .linecont { font-size:1.5rem; }
} */

@media (max-width:767.98px){
    .title { font-size:2rem; }
    .logo { left:15px; padding:15px; height:100px; width:100px; }
    .logo img { height:50px; padding-top:0px; }

    .top .topmenu .menu .mb2 { width:60px; height:60px; font-size:1rem; }
    .top .topmenu .subject .toplogo { height:60px; padding:15px 0px; }
    .top .topmenu .subject .toplogo img { height:30px; }

    .product .pd .des .pdname { font-size:1.2rem; }
    .product .pd .des .price1 { font-size:1rem; }
    .product .pd .des .offer { font-size:1.2rem; }
    .product .pd .des .price2 { font-size:0.9rem; }

    .epure .ytcont .name { margin-top:40px; }
    .epure .ytcont .content { padding:20px 0px; }

    
}