@charset "UTF-8";
/* CSS Document */
@font-face {
    font-family: 'Alexandria';
    src: url('fonts/Alexandria-Regular.eot');
    src: url('fonts/Alexandria-Regular.eot?#iefix') format('embedded-opentype'),
        url('fonts/Alexandria-Regular.woff2') format('woff2'),
        url('fonts/Alexandria-Regular.woff') format('woff'),
        url('fonts/Alexandria-Regular.svg#Alexandria-Regular') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}


body,html{ font-size:15px;  color:#fff; background-color: #333b39; overflow-x:hidden;line-height:1.9;font-family: 'Noto Sans TC', sans-serif;font-weight: 400; scroll-behavior: smooth;}
a{ color:#fff;outline: none;}
a:hover{ text-decoration: none;color: #f4cf5c;}
a:focus{ text-decoration:none;outline: none;}
::selection{ background:#f4cf5c; color:#333b39;}
a, *:link, *:visited, *:hover, *:active, *:focus , *,*::before, *::after {transition: all  300ms linear;}
input, button, select, textarea,.btn{font-family:  'Noto Sans TC', sans-serif;font-size: 15px;}
table{font-family: Arial, Helvetica, sans-serif;font-size: 16px; line-height: 30px; ;}

/* common setting */
.wrap{overflow-x: hidden;}
.fs_70{font-size: 45px;line-height: 1.2;font-weight: 700;}
.fs_50{font-size: 36px;line-height: 1.2;font-weight: 700;}
.fs_40{font-size: 30px;line-height: 1.2;font-weight: 700;}
.fs_24{font-size: 22px;line-height: 1.16;}
.fs_21{font-size: 18px;line-height: 1.16;}
.fs_18{font-size: 17px; line-height: 1.66;}
.fs_16{font-size: 15px;}
.fs_14{font-size: 14px;}

.ff_Alex *,.ff_Alex{font-family: 'Alexandria';font-weight: normal;}
.color_yellow{color: #f4cf5c;}
.color_white{color: #fff;}
.color_gray{color: #333b39;}
.bg_yellow{background-color: #f4cf5c; color: #fff;}
.bg_white{background-color: #fff;color: #333b39;}
.bg_gray{background-color: #333b39;color: #fff;}
.sns_link a:hover{opacity: .7;}
.sns_link img{display: block;}
.btn{background: #e10052; color: #fff;height: 40px;padding: 10px; line-height: 20px;border-radius: 0;border: none;}
.btn .fa{margin-left: 10px; }
.btn:focus, .btn:active:focus, .btn.active:focus, input:focus, input:active, button:focus, button:active, button:active:focus{outline: none;}
.btn:hover, .btn:focus, .btn:active, .btn.active, .open>.dropdown-toggle.btn{background: #f5cc30; color: #000;}
.btn-noline{border-color: transparent;}
.form-control{border-color: #fff; border-radius: 0;font-size: inherit;height: 48px;line-height: 46px;color: #fff;box-shadow: none; background: none;border-width: 0.5pt;}
.form-control:focus{border-color: #f4cf5c;box-shadow: none;}
.input-group-addon{padding: 0; background: none;border: none; padding: 0;border-radius: 0;}

.navbar{  width: 100%; position:absolute; top: 0; left: 0;right: 0; z-index: 101;background:rgba(0, 0, 0, 0.2);}
.navbar-toggle .icon-bar{background-color: #fff;}
.navbar-brand,.navbar-nav>li{min-height: 12vh;}
.navbar-nav{display: flex;width: 100%;float: none;justify-content: center;}
.navbar-nav>li{margin: 0;; float: none;display: flex; min-width: 8.12vw; }
.navbar-nav>li>a{color: #fff;padding: 0 15px; display: flex;width:100%;height: 100%;  justify-content: center; align-items: center;color: #fff;;} 
.navbar-nav.nav>li>a:hover, .navbar-nav.nav>li>a:focus, .navbar-nav.nav>li.active>a{background: none;color: #f4cf5c;}
.content, .sub_content{position: relative; z-index: 1;}
.footer{padding: 55px 0 25px;background-color: rgba(0, 0, 0, 0.2);position: relative; z-index: 0;font-size: .8125rem;}
.foot_name{margin-bottom: 20px;}
.foot_logo{margin-bottom: 30px; }
.foot_logo img{max-height: 50px;;}
.footer .logo_text_bg{position: absolute;top: calc(40px + 50px + 55px);}
.foot_nav ul{display: flex; flex-direction: row; justify-content: space-between;}
.foot_nav li a:hover{color: inherit; opacity: .7;;}
.footer .sns_link{ display: flex; flex-direction: row;}
.footer .sns_link li+li{margin-left: 20px;;}
.foot_company{margin-top: 30px;}
.footer .copyright{margin-top: 20px;}
#btn-top{width: 40px; height: 40px; background: #f4cf5c url(../images/icon/arrow_grey.png) no-repeat center; background-size: cover; border-radius: 50%; transform: rotate(-90deg);display: block;position:fixed;z-index: 999;bottom: 70px; right: 70px;}

.company_add strong{display: block;margin-bottom: 10px;font-weight: normal;letter-spacing: 2px;}
.company_add strong span{margin-left: 15px; letter-spacing: 0;}
.company_add address{line-height: 1.875;}
.title_area *:first-child{margin-top: 0;}
.title_area *:last-child{margin-bottom: 0;}
.contact_list{line-height: 24px;letter-spacing: .5px;margin-bottom: 20px;}
.contact_list strong{margin-right: 10px;letter-spacing: 3px;}
.contact_zone{margin-top: 15px;flex-direction: column; display: flex;letter-spacing:1px}
.btn_contact{display: flex; align-items: center;width: 160px;font-weight: bold; letter-spacing: 0;}
.btn_contact .arrow {width: 56px; display: inline-block;padding: 0;position: relative;line-height: 1;margin-left: 20px;}
.btn_contact i{display: block;height: 14px;position: relative;}
.btn_contact i:before, .btn_contact i:after {content: '';display: block;height: 100%;position: absolute;bottom: 0;z-index: 1;width: 0;background: url(../images/icon/line_arrow.png) no-repeat left center; background-size: auto 100%;}
.btn_contact i:before {width: 100%;right: 0;-webkit-transition: none;transition: none; -webkit-transform-origin: left; -ms-transform-origin: left; transform-origin: left; }
.btn_contact i:after {width: 0;left: 0;-webkit-transition: width .5s cubic-bezier(.215, .61, .355, 1);transition: width .5s cubic-bezier(.215, .61, .355, 1);-webkit-transform-origin: right;-ms-transform-origin: right;transform-origin: right; }
.btn_contact:hover i:before {width: 0;-webkit-transition: width .5s cubic-bezier(.215, .61, .355, 1);transition: width .5s cubic-bezier(.215, .61, .355, 1);}
.btn_contact:hover i:after {width: 100%;-webkit-transition-delay: .3s;transition-delay: .3s;}
[data-aos][data-aos][data-aos-duration="400"], body[data-aos-duration="400"] [data-aos]{    transition-duration: 1s;}

/*bootstrap carousel-fade*/
.carousel-fade .carousel-inner .item {  opacity: 0;  -webkit-transition-property: opacity;  -moz-transition-property: opacity;  -o-transition-property: opacity;  transition-property: opacity;}
.carousel-fade .carousel-inner .active {  opacity: 1;}
.carousel-fade .carousel-inner .active.left,
.carousel-fade .carousel-inner .active.right {  left: 0;  opacity: 0;  z-index: 1;}
.carousel-fade .carousel-inner .next.left,
.carousel-fade .carousel-inner .prev.right {  opacity: 1;}
.carousel-fade .carousel-control {  z-index: 2;}

.arrow_btn{background: url(../images/icon/arrow_white.png) no-repeat center;       width: 100%; height: 100%; display: block; }
.arrow_btn.left{transform: rotate(180deg);}

/* owl */
.owl-theme .owl-nav{margin:0;}
.owl-carousel .owl-nav .owl-next, 
.owl-carousel .owl-nav .owl-prev{width: 60px; height: 60px;position: absolute;border-radius: 0;margin: 0;cursor: pointer;top: calc(50% - 30px);opacity: 1;display: block;}
.owl-carousel .owl-nav button.owl-prev{left: -80px;    }
.owl-carousel .owl-nav button.owl-next{right: -80px;}
.owl-theme .owl-nav [class*=owl-]:hover{background-color: transparent;}                
.owl-theme .owl-nav [class*=owl-]:hover .arrow_btn{background-image: url(../images/icon/arrow_yellow.png);}
.owl-theme .owl-nav [class*=owl-].disabled .arrow_btn{ cursor:not-allowed;}
.owl-theme .owl-dots .owl-dot{padding:8px 0 !important;}
.owl-theme .owl-dots .owl-dot span{width: 50px; height: 4px; background: #ccc; border-radius: 0;margin: 0 5px;}
.owl-theme .owl-dots .owl-dot.active span, .owl-theme .owl-dots .owl-dot:hover span{background:  #f4cf5c;}
.logo_text_bg{width: 100vw;height: 10.94vw;background: url(../images/bg/bg_LogoText.png) no-repeat;background-size: 100%;}

/* index */
.container_lg{min-width: 87.5vw;}
#home_banner{overflow: hidden;width: 100vw;height: 100vh;;}
#home_banner .container_lg{position: relative;z-index: 99;}
#home_banner .photo{width: 76vw; height: 100vh;background: no-repeat center; background-size: cover;top:0;left: 24vw;position:absolute;;}
#home_banner .carousel-text{position: relative;z-index: 9;}
.banner_content{height: 100vh;display: flex; flex-direction:column; justify-content: center;}
#home_banner .banner_content{line-height: 2.22;}
#home_banner .title{font-size: 60px;font-weight: bold; line-height: 1.2;margin: 0 0 40px;}
#home_banner .carousel-indicators{margin: 0;top: 0;width: auto;display: flex; flex-direction: column;height: 100vh;justify-content: center;left: 0;position:absolute;}
#home_banner .carousel-indicators li{width:auto; height:auto;margin:0;padding:20px;border: none; display: block;background: none;}
#home_banner .carousel-indicators li::before{content: '';display: block;width: 8px;height: 8px;background-color: #fff ;border-radius: 50%;}
#home_banner .carousel-indicators li:hover::before,#home_banner .carousel-indicators .active::before{border: none;background: #f5cc30;}
#home_banner .sns_link{margin: 0;top: 0;width: auto;display: flex; flex-direction: column;height: 100vh;justify-content:flex-end;left: 0;position:absolute;;}
#home_banner .sns_link{}
#home_banner .sns_link li{margin-bottom:25px;;}
.home_zone{padding: 4.25vw 0;}
.home_zone .title_area{letter-spacing: 1px;}
.home_zone .title_area .fs_70{margin: 0 0 10px; letter-spacing: 3px;}
.home_service{position: relative;}
.home_service .container{position: relative; z-index:1;}
.home_service .title_area{margin-bottom: 40px;}
.home_service ul{display: flex; flex-direction: row; justify-content: space-between; text-align: center;}
.home_service li{max-width: 110px;}
.home_service .logo_bg{position: absolute;left: 0;top: 120px;z-index: 0;width: 100vw;display: flex;}
@keyframes scroll {    from {      transform: translateX(100%);    }    to {     transform: translateX(-100%);    }  }
@keyframes scroll2 {    from {      transform: translateX(0%);   }    to {      transform: translateX(-200%);    }  }
.logo_move1{    animation: scroll 40s linear infinite;  }
.logo_move2{    animation: scroll2 40s linear infinite;    animation-delay: -20s;  }
.home_intro{padding-top: 0;}
.home_intro .intro_bg{width: 100%; height: 20vw;background:url(../images/bg/bg_dark01.jpg) no-repeat fixed center; background-size: cover;margin-bottom: -150px;}
.home_intro .item + .item{margin-top: 50px;}
.home_intro .item{margin: 0;}
.home_intro .box_photo{padding: 0;box-shadow: 10px 10px 10px rgba(0, 0, 0, 0.5); position: relative}
.home_intro .box_photo img{position: relative;z-index: 1;}
.home_intro .box_photo::before, .home_intro .box_photo::after{content: '';display: block;width: 17%; height:42.58%; background: #f4cf5c; right: -8.5%; top:100px;position: absolute;}
.home_intro .box_photo::before{ background: #f4cf5c; z-index: 9;}
.home_intro .box_photo::after{ z-index: 0;box-shadow: 10px 10px 10px rgba(0, 0, 0, 0.5); background: transparent;}
.home_intro .box_text{ position:relative; z-index: 11;padding: 130px 0 0;}
.home_intro .box_text .title{margin: 0;}
.home_intro .box_text .text{margin: 40px 0 0 90px;}
.home_customers{padding-bottom: 0;}
.customers_list{background-color: rgba(0, 0, 0, 0.2);margin-top: 40px;padding: 35px;}
.customers_list ul{display: flex; flex-direction: row; justify-content:space-around; text-align: center;}
.customers_list .icon_circle{margin: 0 auto 25px;;max-width: 75px;background-color: #f4cf5c; border-radius: 50%;position: relative;}
.customers_list .icon_circle::before{content: '';display: block; left: 0; top: 0; width: 100%; height: 100%; border-radius: 50%; background-color: rgba(0, 0, 0, 0.2);position: absolute;opacity: 0;}
.customers_list a:hover .icon_circle::before{opacity: 1;}
.home_news #news_list{margin-bottom: 30px;}
.home_news .owl-carousel .owl-nav .owl-next, .home_news .owl-carousel .owl-nav .owl-prev{    top: calc(378px/2 - 30px);}
.home_news .box_photo{margin-bottom: 30px;}
.home_news .box_info{display: flex;flex-direction: row; justify-content: space-between; align-items: center;margin-bottom: 30px;}
.home_news .box_date{width: 6.5em;font-weight: bold;text-align: right; letter-spacing: 1px;}
.home_news .box_title{margin: 0;white-space:nowrap;    text-overflow:ellipsis;    -o-text-overflow:ellipsis;    overflow: hidden;font-weight: normal;}
.home_news .title_area{margin-bottom: 45px;}
.home_contact{background: #fff url(../images/pic/index_zone05.jpg) no-repeat 0 80%; background-size: 75%; color: #333b39;min-height: 24vw;font-weight: bold;padding:40px 0 0;}
.home_contact .contact_zone{ align-items: flex-end;}
.home_contact .btn_contact{color: #333b39; }
.home_contact .bear_icon {display: flex; justify-content: flex-end;margin: 20px 0 -45px;}
.home_contact .bear_icon img{display: flex;height: 280px; }
/* inside */
.sub_content{}
.sub_content .banner{margin-bottom: 40px;background: no-repeat center; background-size: cover; padding-top: 12vh;overflow: hidden;}
.headline{margin: 0;display: flex; min-height: 10vw; flex-direction: column;justify-content: center;padding: 20px 0;}
.headline span{ display: block; font-size: .72em;font-weight: normal;margin-bottom:0;letter-spacing: 1px;}
.headline span small{font-size: 14px;margin-left:20px; color: #fff;}
.breadcrumb{padding: 0;background: none;text-transform: uppercase;color: #fff;display: flex; flex-direction: row;justify-content: flex-start; flex-wrap: wrap;margin-bottom: 40px;;}
.breadcrumb>li+li:before,.breadcrumb>.active,.breadcrumb a{color: inherit;}
.breadcrumb>li+li:before{padding: 0;content: '\003e';}
.breadcrumb a:hover{color: #f4cf5c;}
.contact_btm{padding: 70px 0 80px;}
.sub_content .contact_btm .title_area{letter-spacing: 1px;}
.sub_content .contact_btm .title_area .fs_70{letter-spacing: 3px;}
.sub_content .contact_btm{font-weight: bold;}
.sub_content .contact_zone{ align-items: center; ;}
.sub_content .btn_contact:hover,.sub_content .btn_contact:focus{color: inherit;}
.sub_content .btn_contact i:before, .sub_content .btn_contact i:after{ background-image: url(../images/icon/line_arrow_white.png);}
/* service */
.service .contact_btm{background: url(../images/bg/service_contact01.jpg) no-repeat fixed;background-size: cover; font-weight: bold;}
.service_list li{padding: 50px 0 70px;position: relative;}
.service_list li::before{content: ''; display: block; width: 112px; height: 56px; border-radius: 56px 56px 0 0;background-color: #333b39;position:absolute; top: -36px; left: calc(50% - 56px);;}
.service_list li:nth-child(odd),.service_list li:nth-child(odd)::before{background-color: #fff; color: #333b39;}
.service_nav ul{display: flex; flex-direction: row; justify-content:space-around; text-align: center;margin-bottom: 70px;}
.service_nav li{max-width: 120px;padding:12px; border: 1px solid #fff ; border-radius: 50%;}
.service_nav li:hover{border-color: #f4cf5c;}
.service_nav .icon_circle{margin: 0;;background-color: #f4cf5c; border-radius: 50%;position: relative;}
.service_nav .icon_circle img{border-radius: 50%;;}
.service_list .service_text{display: flex; flex-direction: column; justify-content: center;}
.service_list .service_text .title{margin: 0 0 15px;}
/* company */
.company1 {padding:70px 0 70px;}
.company_intro{padding: 0;}
.company_intro .box_text{background: #fff;color: #333b39;padding: 30px}
.company_intro .article_box{ box-shadow: 10px 10px 10px rgba(0, 0, 0, 0.5);position: relative;;}
.company_intro .box_title{position: absolute; bottom: 100%;}
.company_intro .box_title h4{margin: 0 30px;}
.company_intro .bear_pc{position: absolute; bottom:calc(100% - 20px) ; right: 0;}
.company_intro.intro2{margin-top: -200px;}

.company_customers .title_area{margin-bottom:30px ;}
.customers_intro li{padding: 0;position: relative;}
.customers_intro .box_intro{position: absolute; width: 100%; height: 100%; top: 0; left: 0;padding: 6.5vw 3.5vw 10px;}
.customers_intro .box_icon{margin: 0 auto 30px;;max-width: 90px;background-color: #f4cf5c; border-radius: 50%;position: relative;}
.customers_intro .box_title{margin-bottom: 30px;}
.customers_intro .article_box .box_photo{overflow: hidden; }
.customers_intro .article_box .box_photo img{width: 100%;}
.customers_intro .article_box .box_photo{position: relative;}
.customers_intro .article_box:hover .box_photo img, .customers_intro .article_box:hover .box_photo .photo{transform: scale(1.1) ;}
.company_customers .btm_bg{width: 100%; height: 20vw;background:url(../images/bg/bg_dark01.jpg) no-repeat fixed center; transform:none;margin-top: -100px;}
/*logistic*/
.logistic_area{position: relative;margin-bottom: 5rem;}
.logistic_cube{display: flex; flex-direction: row; justify-content: center;position: relative; z-index: 9;}
.logistic_text{position: relative;width: 66.666%; height: 530px; display: flex; flex-direction: column; justify-content: center;}
.logistic_text h3{letter-spacing: 2px;margin-bottom: 10px;}
.logistic_text h3 small{color: inherit;font-weight: bold; margin-left: 20px;font-size: 48%;letter-spacing: 0;}
.logistic_text .title_area{margin-bottom: 25px;}
.logistic_photo{width: 33.333%;}
.logistic2 .logistic_cube{ flex-direction: row-reverse;}
.logistic_bg{position: absolute;width: 66.666%; height: 100%; background: #fff no-repeat center;background-size: cover;top:0;z-index: 0;;}
.logistic1 .logistic_bg{left: 0; background-image:url(../images/pic/logistic_zone1-01.jpg);}
.logistic1 .logistic_bg,.logistic1 .logistic_photo{box-shadow: 10px 10px 10px rgba(0, 0, 0, 0.5); }
.logistic2 .logistic_bg{right: 0;background-image:url(../images/pic/logistic_zone2-001.jpg);}
.logistic2 .logistic_bg,.logistic2 .logistic_photo{box-shadow: -10px 10px 10px rgba(0, 0, 0, 0.5);}
.logistic .contact_btm{ background: url(../images/icon/logistic_contact.png) no-repeat right center; background-size: auto 100%;padding:40px 0 60px;margin-bottom: 40px;}
/*location*/
.location_tab {padding-bottom: 60px;}
.location_tab .nav{display: flex; flex-direction: row;}
.location_tab .nav>li>a{margin-right: 30px;border: 2px solid #fff;padding:0; width: 132px; line-height: 35px; text-align: center;font-weight: bold;}
.location_tab .nav>li:hover>a,.location_tab .nav>li.active>a,.location_tab .nav>li>a:focus{background: none; border-color: #f4cf5c; color: #f4cf5c;}
.location .logo_zone img{margin: 0 auto 25px;max-height: 50px;}
.location_info .title_area {margin-bottom: 45px;}
.location_info .title_area .fs_40{margin-bottom: 25px;}
.location_info .tab-content{min-height:450px;display: flex; justify-content:  center;width: 100%;flex-direction: column; }
.location_info .company_add address{ line-height: 2;}
.map_nav{max-width: 300px;margin: 0 auto;}
.cls-1,.cls-2,.cls-3,.cls-4{stroke:#333b39;stroke-miterlimit:10;}
.north-area{fill:#fff;}
.east-area{fill:#fff;}
.south-area{fill:#fff;}
.middle-area{fill:#fff;}
.map_nav svg .map-btn:hover path ,
.map_nav svg .map-btn.active path { fill:#f4cf5c; }

/* contact */
.contact{padding: calc(12vh + 40px) 0 40px; background: url(../images/bg/bg_contact.png)  no-repeat; background-size: 50%; background-position: 30px bottom;}
.contact .headline{height: auto; min-height: 0;}
.contact .breadcrumb{margin: 60px 0;}
.contact_form label{font-weight:normal;}
.contact_form .btn_contact{background: none; border: none;}
.contact_form .control-label{display: block; margin-bottom: 10px;letter-spacing: 2px;}
.contact_form .form-group{margin-bottom: 35px;}
.contact_form textarea.form-control{ height: 16rem;max-width: 100%;}
.contact_form .btn_upload{margin-top: 10px; cursor: pointer;line-height: 30px;}
.contact_form .btn_upload .fa{margin-right: 5px; font-size: 24px;}
.contact_form .btn_upload:hover,.btn_upload:focus{color: #f4cf5c;}
.contact_form .btn_upload .note_text{letter-spacing: 2px;line-height: 30px;}
.contact_form .code_area .form-control{width: 290px;margin-bottom:30px;}
.contact_form .button_area{display: flex; justify-content: flex-end;}
.contact_text .company_add{margin:14rem 0 20px ;}
.contact_text .company_add strong{margin-bottom: 35px;}
.contact_text .company_add address{line-height: 2;}

@media (min-width: 768px){
.navbar-brand{float: none; display:flex;width: 100%; align-items: center;justify-content: center;}
.navbar-collapse{width: 76%; float: right;;}
.navbar-header{width: 24%;}
}
@media (min-width: 992px){
.logistic1 .logistic_text{padding-right:133px ;}
.logistic2 .logistic_text{padding-left:133px ;}
.company_customers .container{padding-left: 70px;padding-right: 70px;;}
.banner_content{margin-left: -80px;}
}
@media (min-width:1200px){
.container{width:1000px}
.navbar-brand img{max-height: 50px;}
.foot_company .company_add{width:23% ;}
.foot_company .company_tpe,.foot_info{width:30% ;}
.foot_nav{width: 70%;}

/*inside*/
.service_list .service_photo img{width: 480px;}
.service_list .service_text{ min-height:236px;padding-left: 45px;;}
.company_intro.intro1{padding-right: 70px;}
.company_intro.intro2{padding-left: 70px;;}
.company_intro .box_text{padding: 30px 40px;}
.company_intro .box_title h4{margin: 0 40px;}
.logistic1 .logistic_text{padding-right:133px ;}
.logistic2 .logistic_text{padding-left:133px ;}
.contact_left{margin-right: 8.3333%;}
.contact_form{padding-left: 35px;}
}

@media (max-width: 1599px){
.container_lg{min-width: 95vw;}
.home_service ul li img{max-width: 90%;}
}

@media (max-width: 1399px){
.service_list .service_text .title{margin-bottom: 15px;}
}
@media (min-width: 1200px) and  (max-width: 1599px){
.navbar-brand, .navbar-nav>li{min-height: 80px;}
#btn-top{right: 40px; bottom: 40px;}
/* index */
#home_banner .title{font-size: 60px;margin-bottom: 30px;;;}
.home_intro .box_text{padding-top: 125px;}
.home_intro .box_text .text{margin:20px 0 0 70px;;}
.home_contact{background-size: 80%;}
/* inside */
.sub_content .banner{padding-top: 80px;}
.contact{padding-top: calc(80px + 40px);}
.service_list .service_photo img{width: auto}
.service_list .service_text{ min-height:236px;padding-left: 40px;;}
.company_intro.intro1{padding-right: 60px;}
.company_intro.intro2{padding-left: 60px;;}
.company_intro .box_text{padding: 35px 60px;}
.company_intro .box_title h4{margin: 0 60px;}
.company_intro .bear_pc img{height:300px ;}
.logistic_text{height: 531px;}
.contact_left{margin-right: 8.3333%;}
.contact_form{padding-left: 35px;}
.contact_text .company_add{margin-top: 220px;}
}

@media (max-width: 1199px){
.navbar-brand img{max-height: 40px;}
.navbar-brand, .navbar-nav>li{min-height: 70px;}
/* index */
.home_intro .intro_bg{margin-bottom: -100px;}
/* inside */
.sub_content .banner{padding-top: 70px;margin-bottom: 30px;}
.contact{padding-top: 100px}
.breadcrumb{margin-bottom: 30px;;}
.location_tab .nav>li>a{line-height: 40px;;margin-right: 10px;width: auto;padding: 0 20px;;}
.contact_btm{padding: 40px 0;}
.form-control{height: 40px; line-height: 38px;}
.contact_form textarea.form-control{height: 160px;;}
}


@media (min-width: 992px) and  (max-width: 1199px){
.container{width: 860px;}
#btn-top{right: 20px; bottom: 20px;}
/* index */
#home_banner .title{font-size: 60px;margin-bottom: 25px;;;}
.home_intro .box_photo::before, .home_intro .box_photo::after{top: 90px;;}
.home_intro .box_text{padding-top: 110px;}
.home_intro .box_text .text{margin: 20px 0 0 50px;}
.home_contact .bear_icon img{height: 240px;}
/* inside */
.service_list .service_text{ min-height:200px;padding-left: 20px;;}
.service_list li::before{width: 80px; height: 40px;    left: calc(50% - 40px);top: -30px;}
.company_intro.intro1{padding-right: 50px;}
.company_intro.intro2{padding-left: 50px;;}
.company_intro .box_text{padding: 30px 50px;}
.company_intro .box_title h4{margin: 0 50px;}
.customers_intro .box_icon{margin-bottom: 60px;;}
.location_info{padding-left: 40px;}
.location_info .tab-content{min-height: 380px;}
.logistic_text{height: 425px;}
.contact_left{margin-right: 8.3333%;}
.contact_form{padding-left:30px;}
.contact_text .company_add{margin-top: 50px;}
}


@media (max-width: 991px){
#btn-top{right:20px; bottom: 20px;}
/* index */
.home_zone .title_area .fs_70{margin-bottom: 15px;}
/* inside */
.company1{padding: 65px 0 50px;}
.company_intro.intro1{padding-right: 0;;}
.company_intro .bear_pc{width: 20%;}
.company_intro.intro2{padding-left: 0;margin-top: 100px;;}
.company_intro .box_text{padding: 25px 30px;}
.company_intro .box_title h4{margin: 0 30px;}
.customers_intro .box_intro{padding: 50px 30px 10px;}
.customers_intro .box_icon{margin-bottom: 30px;;}
.company_customers .btm_bg,.home_intro .intro_bg{height: 180px;}
.service_list li{padding: 50px 0 60px;}
.contact{background-size: 100%;}
.contact_left{margin-bottom: 50px;;}
.contact_form textarea.form-control{height: 150px;}
}

@media (min-width: 768px) and  (max-width: 991px){
body,html{font-size: 14px;}
input, button, select, textarea,.btn{font-size: 14px;}
.fs_70{font-size: 40px;}
.fs_50{font-size: 30px;}
.fs_40{font-size: 24px;}
.fs_24{font-size: 18px;}
.fs_21{font-size: 16px;}
.fs_18{font-size: 15px;}
.fs_16{font-size: 14px;}
.container{width: 650px;}
.container_lg{width:100%;}
.foot_logo{max-width: 160px;;}
#home_banner .sns_link{margin:0 10px;}
/* index */
#home_banner .title{font-size: 50px;margin-bottom: 25px;;;}
.home_intro .box_photo::before, .home_intro .box_photo::after{top: 60px;;}
.home_intro .box_text{padding-top: 72px;}
.home_intro .box_text .text{margin: 20px 0 0 30px;}
.home_intro .item + .item{margin-top: 30px;}
.customers_list{margin-top: 20px;}
.customers_list .icon_circle{max-width: 100px;}
.home_news .title_area{margin-bottom: 20px;}
.home_news .box_info,.home_news .box_photo{margin-bottom: 15px;;}
.home_contact{background-size: auto 110%;}
.home_contact .bear_icon img{height: 200px;}
/* inside */
.company_intro .bear_pc{width: 80px;}
.service_nav li{max-width: 110px;padding: 9px;;}
.service_list .service_text{ min-height:0;padding-left: 20px;;}
.service_list li::before{width: 80px; height: 40px;    left: calc(50% - 40px);top: -30px;}
.map_nav{max-width: 150px;}
.location_info{padding-left: 40px;}
.location_info .tab-content{min-height: 380px;}
.logistic_text{height: 325px;}
.logistic1 .logistic_text{padding-right: 40px;}
.logistic2 .logistic_text{padding-left: 40px;}
.contact .headline{padding: 0;}
.contact .breadcrumb{margin: 30px 0;}
.contact_text .fs_40{margin-bottom: 0;}
.contact_text .company_add{margin-top: 40px;}
.contact_text .company_add strong{margin-bottom: 10px;}
}
@media (max-width:767px){
body,html{font-size: 15px;}
input, button, select, textarea,.btn{font-size: 14px;}
.fs_70{font-size: 32px;}
.fs_50{font-size: 28px;}
.fs_40{font-size: 24px;}
.fs_24{font-size: 18px;}
.fs_21{font-size: 14px;}
.fs_18{font-size: 16px;}
.fs_16{font-size: 15px;}
.container{width: 100%;padding-left: 15px; padding-right: 15px;}
.container_lg{width:100%;}
[data-aos^=fade][data-aos^=fade].aos-animate.wrap{transform: none;}
.navbar-brand img{height: 50px; max-height: none;}
.navbar-brand, .navbar-nav>li{min-height: auto;}
.navbar-toggle{width: 40px; height: 40px;margin: 20px 15px;}
.navbar-toggle .icon-bar{ background:#fff;position:absolute; width:24px; left:8px; -webkit-transition: all 500ms ease-in-out;    transition: all 500ms ease-in-out; z-index: 88;}
.navbar-toggle.collapsed .icon-bar{ margin:0;left:7px;}
.navbar-toggle .icon-bar+.icon-bar{ margin:0;}
.navbar-toggle.collapsed .icon-bar:nth-child(2){transform: rotate(0); top:12px;}
.navbar-toggle.collapsed .icon-bar:nth-child(3){transform: rotate(0); top:19px;opacity:1;}
.navbar-toggle.collapsed .icon-bar:nth-child(4){transform: rotate(0); top:26px;}
.navbar-toggle .icon-bar:nth-child(2){transform: rotate(45deg); top:19px;}
.navbar-toggle .icon-bar:nth-child(3){opacity:0;}
.navbar-toggle .icon-bar:nth-child(4){transform: rotate(-45deg); top:19px;}
.navbar-collapse{background-color: rgba(0, 0, 0, 0.5);border: none;}
.navbar-nav{flex-direction: column;margin: 0;padding: 10px 0;}
.navbar-nav>li>a{ padding: 10px 0;}
.footer{padding: 50px 0 40px;}
.foot_nav ul{ flex-wrap: wrap;margin: 20px 0;;}
.foot_nav ul li{width: 33%;}
.foot_logo{max-width: 160px;;}
.footer .copyright{margin-top: 0px;;}
#btn-top{width: 30px; height: 30px;;;}
/* index */
#home_banner .photo{width: 100vw;left: 0;;}
#home_banner .banner_content{width: 100%;}
#home_banner .sns_link{margin:0 15px; z-index: 99;}
#home_banner .sns_link li{margin-bottom: 15px;;}
#home_banner .title{font-size: 36px;margin-bottom: 15px;}
#home_banner .banner_content{line-height: 1.5;;}
#home_banner .carousel-indicators{ width: 100vw; flex-direction: row; align-items: flex-end;padding-bottom: 15px;}
#home_banner .carousel-indicators li{padding: 14px;}
#home_banner .carousel-indicators li::before{width: 12px; height: 12px;;}
#home_banner .carousel-text{background-color: rgba(0, 0, 0, 0.5);}
.home_zone{padding: 35px 0;}
.home_service ul,.customers_list ul{flex-wrap:wrap;}
.home_service li{width: 33%;}
.home_intro .intro_bg{height: 60vw;}
.home_intro .box_photo::before, .home_intro .box_photo::after{top: calc(100% - 20px);width: 100px; height: 100px; right:auto; left: 15px;}
.home_intro .box_text{padding-top: 0;padding-left: 30px;}
.home_intro .box_text .title{display: flex; height: 100px; margin-top: -20px; align-items: center;width: 100%;}
.home_intro .box_text .text{margin: 20px 0 ;}
.home_customers{padding-top: 0;}
.customers_list{padding: 30px 0 10px;margin-top: 0;}
.customers_list li{width: 50%;margin-bottom: 20px;;}
.customers_list .icon_circle{max-width: 100px;margin-bottom: 10px;}
.home_news .title_area{margin-bottom: 15px;}
.home_news #news_list{padding: 0 35px;}
.home_news .owl-carousel .owl-nav .owl-next, .home_news .owl-carousel .owl-nav .owl-prev{top: calc(50% - 25px);width: 50px; height: 50px;;;}
.owl-carousel .owl-nav button.owl-prev{left: -15px;;}
.owl-carousel .owl-nav button.owl-next{right: -15px;}
.home_news .box_photo,.home_news .box_info{margin-bottom: 15px;;}
.home_contact{background-image: url(../images/pic/index_zone5_m01.jpg);background-size: 80%; background-position: left bottom;padding:20px 0 0;}
.home_contact .bear_icon{margin: 10px 0 -20px;}
.home_contact .bear_icon img{height: 150px;}
/* inside */
.sub_content .banner{padding-top: 80px;;}
.headline{height: 180px;}
.contact_btm{padding: 50px 0;}
.company_intro .box_title h4{margin: 0 20px;;}
.company_intro .box_text{padding: 20px;}
.company_customers .btm_bg{height: 60vw;;}
.service_nav li{max-width: 80px;padding: 6px;;}
.service_list .service_text{ min-height:0;padding:20px 10px 0;;}
.service_list li::before{width: 40px; height: 20px;    left: calc(50% - 20px);top: -15px;}
.service .contact_btm{background-attachment: unset;}
.map_nav{max-width: 150px;;margin-bottom: 30px;}
.location .logo_zone img{max-width: 200px;}
.location_info{padding-left: 10px;,margin-top: 30px;}
.location_tab .nav{justify-content: space-between;}
.location_tab .nav>li>a{margin-right: 0;padding: 0 10px;;}
.location_info .tab-content{min-height: 0;padding-top: 40px;}
.logistic_cube{flex-wrap: wrap;margin: 0 -15px;}
.logistic_photo{width: 100%; box-shadow: none; display: flex; flex-direction: row;}
.logistic_photo img{ width: 50%;}
.logistic_bg{display: none;}
.logistic_text{min-height: 57vw;width: 100%;padding:40px 20px 20px; height: auto; background:  no-repeat center; background-size: cover;}
.logistic1 .logistic_text{ background-image: url(../images/pic/logistic_zone1-01.jpg);}
.logistic2 .logistic_text{background-image: url(../images/pic/logistic_zone2-001.jpg);}
.logistic .contact_btm{ background-size: auto 65%; background-position: 95% 90%;}
.contact_text .company_add{margin-top: 50px;}

/* index */
/* inside */
}