@charset "utf-8";

body {
    font-family: 'Arial'/*英文*/, 'Noto Sans TC'/*思源繁中*/, sans-serif ;
    color:#333;font-size:16px;
}

header{position:absolute;top:0;width:100%;z-index: 2;}
.header_in{width:95%;margin: 0 auto;padding:20px 3%;}
.LOGO{width:20%;max-width:300px;}
nav{float:right;}
nav>ul>li{float:left;}
nav>ul>li>a{display: inline-block;padding:15px 20px 15px 20px;color:#fff;}
nav>ul>li:nth-of-type(1)>a{padding-top: 20px;}


.BANNER{background: #eee}
.BANNER img{margin:0 auto;}
.BANNER .bx-next{display: none;}

footer{padding:40px 10px;background: #eee;text-align: center;}
footer ul{display: inline-block;}
footer li{float:left;border-right:1px solid #ccc;}
footer ul>li:last-of-type{border-right:none;}
footer li a{padding:0 15px;}
.footer_contact{display: inline-block;margin:1em auto 0;text-align: left;}
.footer_contact p{clear:both;}


/*--首頁 index--*/
.HOME_TITLE{margin-bottom:20px;font-size:1.7em;}

.bg-img{ background-size: cover !important; background-position: center}
.black{
    -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
    -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
    transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0);
    text-align: center;
}

.HOME_CONTAINER{text-align: center;}

#HOME_SERVICE{padding:3em 0;}
#HOME_SERVICE .COLUMN3{width:80%;margin:0 auto;}
#HOME_SERVICE .HOME_TITLE{font-weight:bold;margin-bottom:2em;}
#HOME_SERVICE .HOME_TITLE h2{color:#35a6dc;font-family:'Montserrat';font-size: 1.3em;font-weight: 700;}
#HOME_SERVICE .HOME_TITLE h3{font-size: 1.5em;font-weight: bold;margin-top:8px;margin-bottom:4px;}
#HOME_SERVICE .HOME_TITLE p{font-weight:normal;color:#666;font-size: 18px;}
#HOME_SERVICE li{line-height: 25px;}
#HOME_SERVICE li h3{letter-spacing: 1.5px;font-size: 1.5em; font-weight: 500;margin: 10px 0 8px;}

#HOME_SERVICE .MORE{background: #35a6dc;color:#fff;padding:15px 35px; margin-top: 2em; display: inline-block;}


#HOME_HOW{background: url(../images/home_how_bg.jpg) center center no-repeat;    padding: 10em 0;background-size: cover;}
#HOME_HOW h2{ font-size: 2.5em; margin-bottom: 0.6em; font-weight: bold;}
#HOME_HOW .MORE{background: #ff7f17;color:#fff;padding:15px 35px; margin-top: 2em; display: inline-block;}

#HOME_HOW .box, #HOME_COOPER .box{width:80%;margin:0 auto;}

#HOME_COOPER{padding:3em 0;}
#HOME_COOPER h2{font-size: 2.5em; margin-bottom: 0.5em; font-weight: bold;}



/*--內頁--*/
.CONTAINER{line-height:1.5;padding:2.5em 0;width:80%;max-width: 1170px; margin: 5em auto 0;}
.BANNERS{
    position: relative;
    text-align: center;
    background: url(../images/banners.jpg) center center no-repeat;
    background-size:cover;
    height: 250px;
    /*width: 100%;
    height: 310px;
    text-shadow: 1px 1px 5px rgba(0,0,0,0.3);
    font-size: 28px;
    padding-left:10%;
    padding-top:9%;
    letter-spacing: 3px;
    background-attachment: fixed;*/
}

.TITLE{position: absolute;top:60%;width:100%;text-align: center;}
.TITLE h1{
    background: #fff;
    border-radius: 100%;
    width:200px;
    height:200px;
    display: inline-block;
    font-size:28px;
    padding-top: 60px;
    box-shadow: inset 0 0 10px 3px rgba(0,0,0,0.15);
}

.TITLE h1>span:last-of-type{
    color: #ff7f17;
    font-size: 22px;
    margin-top: 5px;
    display: inline-block;
    font-family: Arial;
    font-style: italic;
}
.TITLE span{ display:block;}

.DETAIL_TITLE{ font-size:1.4em; margin-bottom:25px; letter-spacing: 1px;color:#1a79b5; padding-left:12px;border-left:3px solid #1a79b5;line-height: 100%;}
.DETAIL_DATE{color:#1a79b5;}

.LEFT_MENU{
    float:left;
    width: 230px;
    box-shadow: 0 0 2px #aaa;
    border-top: 3px solid #56b1e6;
    background: #fff;
    margin-bottom: 20px;
    overflow: hidden;
}
.RIGHT_PAGE{float:right;width:calc(100% - 280px);}
.LEFT_MENU>li{border-bottom:1px solid #ccc;}
.LEFT_MENU>li>a{padding:15px;background: #efefef;display: block;transition: background 0.3s, color 0.3s;color:#666;}
.LEFT_MENU>li>a:hover{background: #ddd;color:#333;}



.HTML{line-height: 1.7;color:#444;}
.RIGHT_PAGE .HTML{padding:0}


.ABOUT .HTML>.box{padding:40px 10%;}
.ABOUT .HTML>.box:nth-of-type(even){background:#eaeaea url(../images/about_bg2.jpg) right top no-repeat;}
.ABOUT .HTML>.box:nth-of-type(odd) .PHOTO{float:left;width:45%;padding:5px;border:1px solid #ccc;}
.ABOUT .HTML>.box:nth-of-type(odd) .PHOTO img{display: block}
.ABOUT .HTML>.box:nth-of-type(odd) .WORD{float:right;width:48%;}
.ABOUT .HTML>.box:nth-of-type(even) .PHOTO{float:right;width:45%;}
.ABOUT .HTML>.box:nth-of-type(even) .WORD{float:left;width:48%;}

.SERVICE .COLUMN2{margin-top:40px;}
.SERVICE .COLUMN2>li {text-align: center;line-height: 1.7;border:1px solid #9bd0ef;padding:10px; box-shadow: 0 0 7px #eee;}
.SERVICE .img-contain{padding-bottom:75%;}
.SERVICE li h3{font-size:20px;font-weight:bold;padding:5px 0;}
.SERVICE li p{margin-bottom:15px;}
.SERVICE li:hover{border:1px solid #ccc;}
.SERVICE li .BTN:hover{background: #1a79b5;}
.SERVICE .COLUMN2 .box{padding: 10px 0 15px 0;background: #f5f5f5 url(../images/service_box.jpg);}



#menu2>li>ul>li{
    position: relative;
    border: none;
    background: none;
    color: #555;
    width: 100%;
    text-align: left;
    outline: none;
    -moz-transition: all .3s ease;
    -o-transition: all .3s ease;
    -webkit-transition: all .3s ease;
    transition: all .3s ease;

    background: #fefefe; /* Old browsers */
    background: -moz-linear-gradient(top, #fefefe 0%, #f7f7f7 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top, #fefefe 0%,#f7f7f7 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, #fefefe 0%,#f7f7f7 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fefefe', endColorstr='#f7f7f7',GradientType=0 ); /* IE6-9 */
}
#menu2>li>ul>li>ul{background: #ececec;}




.flexslider .slides > li{cursor: pointer;}
.flexslider .slides img{margin:0 auto;}



/*--常見問題 faq--*/
.FAQ #qaContent{width:800px;max-width:100%;margin:0 auto;}
.FAQ #qaContent ul li{padding:10px;border-bottom:1px solid #ccc;}
.FAQ #qaContent ul li:last-of-type{border-bottom:none;}

.FAQ .qa_title{cursor:pointer;}
.FAQ .qa_title>span,
.FAQ .qa_content>span{
    color: #fff;
    font-weight: bold;
    margin-right: 10px;
    display: inline-block;
    background: #35a6dc;
    width: 30px;
    height: 30px;
    line-height: 30px;
    text-align: center;
    font-size: 14px;
	vertical-align:top;
}
.FAQ .qa_content>span{
    background: #ff7f17;
}
.FAQ .qa_content{padding:10px;}
.FAQ .qa_content .HTML{color:#444;display: inline-block;}






/*--最新消息 news--*/
.LIST_NEWS{width:1000px;max-width: 100%; margin:2em auto 0;}

.LIST_NEWS .BTN{border-radius: 3px;display: inline-block;background: #ddd;color:#666;border:1px solid #ccc;    margin-top: 1.5em;}
.LIST_NEWS .LEFT{width:40%;}
.LIST_NEWS .RIGHT{width:55%;}

.NEWS2 .r-share{float:right;}
.NEWS2 .SUBTITLE{font-size:1.2em;font-weight:700;margin-bottom:20px;}



.BLUE{color:#35a6dc;}
.BLUE2{color:#1a79b5;}
.ORANGE{color:#ff7f17}
.RED{color:red;}


/*--聯絡我們 contact--*/
.CONTACT .HTML{width:100%; max-width:520px; margin: 1em auto 2em;}

.LIST_CONTACT input,
.LIST_CONTACT textarea{background: #eaeaea;border:none;padding:6px 1.5%;}
.CONTACT #contactform{width:100%; max-width:520px; margin:0 auto}
#contactform .LIST_LEFT{width:80px; color: #666; text-align: right;}
.LIST_CONTACT>li{padding:10px 0;}

.BTN_QA{background:#ff7f17;color:#fff !important;padding:0 15px;display:inline-block;border-radius:5px;font-size:15px;text-decoration: none !important;}



/*--如何使用--*/
.HOWTOUSE .title{margin:2em 0 1em 0;border-bottom: 1px solid #ffbb17; font-size: 24px; font-weight: bold; color: #555;}
.HOWTOUSE .title>span{
    color:#fff;
    background: #ffbb17;border-radius: 5px 5px 0 0;
    font-size:22px;font-weight:bold;letter-spacing: 1px;
    display: inline-block;
    padding:0 10px;
    margin-right:10px;
    /*background: url(../images/icon.png) left center no-repeat;
    background-size: contain;
    display: inline-block;
    padding:10px 20px 10px 10px;
    margin-right:10px;
    color: #fff;
    letter-spacing: 0;*/
}
.HOWTOUSE .box{padding-left:70px;}
.HOWTOUSE .LIST_PRICE .box{padding-left:0;margin-bottom:0;}


/*--價格方案 price--*/
.LIST_PRICE li{text-align: center;border:1px solid #ccc;padding:15px;}
.LIST_PRICE li:hover{border:1px solid #fbb83a;}
.LIST_PRICE .box{margin-bottom:10px;line-height: 26px;}
.LIST_PRICE .box a{font-size:15px;}
.LIST_PRICE .size{color:#43a1cf;font-size:1.3em;}
.LIST_PRICE .price{color:#666;}
.LIST_PRICE .BTN{background:#fbb83a; border-radius:30px; line-height:15px; display:block;}
.LIST_PRICE li.selected{background: #fbf7e7;border:1px solid #fbb83a;}
.LIST_PRICE li.selected .BTN{background: none;border:1px solid #666;}
.LIST_PRICE .BTN img{height:16px;}
.LIST_PRICE .img-contain{padding-bottom:80%;}

.monthly_price{display:flex; flex-wrap:wrap; font-size:0; width:100%; margin:0 auto; align-content:flex-start; justify-content:flex-start;}
.monthly_price>span{
    display:inline-block;
    padding:13px;
    width:70%;
    color:#43a1cf;
    background:#eee;
    font-size:18px;
	text-align:right;
	line-height:36px;
	vertical-align:middle;
}
.monthly_price>.price{
    padding:10px 15px;
    color:#43a1cf;
    border:1px solid #43a1cf;
    font-size:24px;
    width:30%;
    text-align:center;
}

@media screen and (max-width:768px){
	.monthly_price>span,
	.monthly_price>.price{
		padding:8px;
		line-height:30px;
		text-align:center;
		display:block;
		width:100%;
	}
}





.options .LEFT{width:30%;}
.options .RIGHT{width:70%;}
.options .COLUMN4>li{border:1px solid #ddd;text-align: center; padding: 20px 10px;}
.options .COLUMN4>li p{line-height: 30px;}
.options .COLUMN4>li p.free{/* color:#fbb83a; */}
.options .COLUMN4>li input{
    width: 90px;
    text-align: center;
    border: solid 1px #333;
    font-size: 2em;
    padding: 5px;
}

.options .qa_title{color:#666;font-size:1.2em;padding:15px;padding-left:30px;border-bottom:1px solid #ddd;background: url(../images/icon_arrow.png) left center no-repeat;}
.qa_content{padding:1em;}
.options .LIST .LEFT{line-height: 25px;}
.options .LIST h4{font-weight:bold;color:#35a6dc;}



/*網誌 news*/
.lpp-item {
    display: inline-block;
    margin: 0 1% 20px 1%;
    width: 98%;
    padding: 20px 20px 10px 20px;
    border: #dedede 1px solid;
    box-shadow: #ccc 2px 2px 5px;
}
.lpp-item .r-info {
    display: inline-block;
    width: calc(100% - 150px);
    padding: 0 10px;
    vertical-align: top;
}
.lpp-item .r-date {
    display: inline-block;
    width: 100px;
    padding: 0;
    vertical-align: top;
    text-align: left;
}
.l-date {
    display: inline-block;
    width: 80px;
    background: #fff;
    text-align: center;
    font-size: 0;
    box-shadow: #999 1px 1px 2px;
}

.service-blk-lpp.commons .l-date > h3 {
    background: #7392c2;
}
.l-date > h3 {
    display: block;
    padding: 2px;
    font-size: 15px;
    font-weight: bold;
    color: #fff;
    background: #e7564c;
    line-height: 24px;
}
.l-date > p {
    display: block;
    padding: 2px;
    font-size: 24px;
    font-weight: bold;
    color: #000;
    background: #fff;
    line-height: 40px;
    border-right: #ccc 1px solid;
    border-bottom: #ccc 1px solid;
    border-left: #ccc 1px solid;
}

.lpp-item .r-info .r-title {
    display: block;
    margin: auto auto 4px auto;
    font-size: 24px;
    font-weight: bold;
    text-align: left;
    color: #000;
    line-height: 30px;
    height: 60px;
    overflow: hidden;
}

.lpp-item .b-funt {
    display: flex;
    flex-wrap: wrap;
    margin: 10px auto;
    padding: 0;
    width: 100%;
    vertical-align: top;
    font-size: 0;
    justify-content: flex-start;
}

.lpp-item .l-pic {
    display: inline-block;
    margin: 5px 0;
    width: 40%;
    vertical-align: top;
}

.lpp-item .l-funt {
    position: relative;
    display: inline-block;
    margin: 5px 0;
    padding: 4px;
    width: 60%;
    vertical-align: top;
}

.r-share{float:right;}

.LIST_NEWS .HTML{color:#666;}
.LIST_NEWS .img-contain{padding-bottom:75%;}




/*會員*/
#MEMBER_LOGIN #contactform{
    width: 390px;
	max-width:100%;
    margin: 2em auto;
    padding: 1.5em;
    border: 1px solid #ddd;
    box-shadow: 0 0 5px #ccc;
    background: #efefef;
    font-size:15px;
}
#MEMBER_LOGIN .BTN{padding:10px;display: block;width:100%;margin:15px 0;border-radius: 5px;font-size:1.1em;}
#MEMBER_LOGIN #contactform li input{border:none !important;background: #efefef;}
.custom-radio{float:left;margin-right:8px;}

/*
#MEMBER_LOGIN #contactform li{display:inline-flex; border-bottom:1px solid #aaa; margin-bottom:10px; width:100%;}
*/

#MEMBER_LOGIN #contactform li{display:block; border-bottom:1px solid #aaa; margin-bottom:10px; width:100%;}

.c-input-box{display:block; margin:0 auto; width:100%;}

#MEMBER_LOGIN .LIST li .emailMobileRadio{
}
#MEMBER_LOGIN .LIST li #area-code-link{
}





#country-list-picker {
    position: relative;
    height: 100%;
    margin-top: 0;
    margin-left: 10px;
}
#country-list-ctn span.icon-dropdown {
    margin-left: -5px;
    width: 10px;
    font-size: 20px;
}
.icon-dropdown:before {
    content: "\e91c";
}

.country-list-menu-box.active {
    display: inline-block;
    z-index: 999;
    padding: 0;
    width: 140px!important;
}

.flt-r {
    float: right;
}
.country-list-menu-box {
    display: none;
    font-size: 14px;
    top: 29px;
    left: 5px;
    padding: 15px 0;
    box-shadow: 0 2px 11px 0 rgba(136,136,136,.91);
}
.flt-l{margin-left:5px;}


#MEMBER .LIST>li{padding:10px 0;}

.recom_box{background: #eee;padding:1.5em;border:1px solid #ccc;border-radius: 7px;margin-top:1.5em;display: inline-block;}
.recom_box input[type="text"]{width:250px;margin-top:15px;display: block;}


#MEMBER  #contactform .LIST_LEFT{width:100px;text-align: left;}
.MEMBER_DATA .LIST{margin-bottom:1em;}
.MEMBER_DATA .LIST>div{
    color: #56b1e6;
    border-bottom: 1px dotted;
    padding-bottom: 5px;
    margin-bottom: 5px;
}
.MEMBER_DATA .LIST_LEFT{margin-right:5px;}

.search_number{margin-bottom:2.5em;}
.search_number>div{
    float: left;
    width: 50%;
    text-align: center;
}
.search_number>div>div{
    padding-left: 40px;
    width: 200px;
    display: flex;
    font-size: 15px;
    line-height: 20px;
    text-align: left;
    margin: 0 auto;
}
.search_number>div>div:before{
    content:url(../images/icon_home.png);
    margin-right: 10px;
}
.search_number>div .num{
    color: #56b1e6;
    font-size: 35px;
    font-weight: bold;
    margin-right: 10px;
    display: inline-block;
    line-height: 35px;
}


.MEMBER_SEARCH>ul{color:#666;}
.MEMBER_SEARCH>ul>li{margin-bottom:2em;}
.MEMBER_SEARCH>ul .title{padding-bottom:5px;border-bottom:2px solid #555;color:#000;margin-bottom:0.8em;}


/*會員 推薦結果*/
.RESULT .title{font-weight:500;border-bottom:1px dotted #ccc;margin-bottom:1em;font-size:1.1em;letter-spacing: 0.5px;padding-bottom:5px;}
.RESULT .box{margin-bottom:2em;}
.RESULT>.box:first-of-type .bg{background: #f5f3e1;padding:10px 15px;}
.RESULT>.box:first-of-type button{background: #ff7f17;color:#fff;float:right;border:none;padding:5px 10px;border-radius: 30px;}
.RESULT .TABLE{width:500px;}
.RESULT .TABLE th{color:#888;font-weight:normal;text-align: left;}
.RESULT .TABLE tr>th:nth-of-type(1){width:50%;}
.RESULT .TABLE tr>th:nth-of-type(2){width:30%;}
.RESULT .TABLE tr>th:nth-of-type(3){width:20%;}


/*會員 即時運送*/
ul.VEHICLE{border:1px solid #ddd;padding:1em;display: flex;}
ul.VEHICLE li{width:33.3%;text-align: center;}
ul.VEHICLE li a{color:#666;}
ul.VEHICLE li a.active{color:#ff7f17;}


.place-order-wrapper{font-size:14px;color:#ff7f17;margin-bottom:1em}
.place-order-wrapper>span{color:#777;}
.place-order-wrapper .box-link{border:1px solid #ff7f17;padding:0 5px;}
.place-order-wrapper>a{float:right;margin-left:10px;}
.place-order-list li{margin-bottom:1em;padding-left:20px;}
.place-order-list li.place-a{background: url(../images/place_order_a.png) left center no-repeat;}
.place-order-list li.place-b{background: url(../images/place_order_b.png) left center no-repeat;position: relative;}
.place-order-list input{border:none;border-bottom:1px solid #ddd;line-height: 30px;width:100%;}

.truck-select{margin-bottom:1em;}
.truck-select a{width:49%;display: inline-block;text-align: center; border: 1px solid;padding:3px;color:#888;font-size:15px;}
.truck-select a.active{color:#ee6c35;}

.icon_delete{
    width: 25px;
    height: 25px;
    right: 0;
    top: 5px;
    cursor: pointer;
    position: absolute;
    background: url(../images/icon_delete.png) no-repeat;
    display:none;
}

.place-order-list>li.place-b:hover .icon_delete{display: inline-block;}
.place-order-button{display: flex;margin-top:1em;}
.place-order-button a.BTN{border-radius: 0;width:50%;margin:0 5px;text-align: center;padding:7px;}
#price-total{ text-align: right;display: block;color:#666;font-weight:bold;font-size:1.5em;margin-right:10px;}



.MEMBER_TRANSPORT2>.LEFT{width:120px;}
.MEMBER_TRANSPORT2>.RIGHT{width:calc(100% - 130px);}
.MEMBER_TRANSPORT2>.RIGHT input{width:100%;border:none;border-bottom:1px solid #ccc;line-height: 30px;}
.order-overlay-time-month {
    font-size: 14px;
    color: #58595B;
    text-align: center;
    font-weight: 400;
}
.order-overlay-time-day {
    font-size: 30px;
    color: #58595B;
    text-align: center;
    font-weight: 500;
}
.order-overlay-time{border:1px solid #ddd;padding:5px 10px;}
.order-overlay-time-other {
    font-size: 12px;
    color: #58595B;
    text-align: center;
}

.MEMBER_TRANSPORT2{font-size:15px;color:#444;}
.MEMBER_TRANSPORT2 .choose{margin:1em 0;}
.MEMBER_TRANSPORT2 .choose li{
    display: flex;
    padding: 5px 10px;
    font-size:14px;
    color:#666;
}
.MEMBER_TRANSPORT2 .choose>li:nth-of-type(1){background: #efefef;}
.MEMBER_TRANSPORT2 .choose>li:nth-of-type(2){background: rgba(241,102,34,.1);color:#f16622;}
.MEMBER_TRANSPORT2 .subtitle{color:#888;font-size:13px;margin-bottom:7px;}
.MEMBER_TRANSPORT2 .pay_btn ul{display: flex;border:1px solid #ddd;padding:10px;}
.MEMBER_TRANSPORT2 .pay_btn li{width:50%;display: block;text-align: center;}
.MEMBER_TRANSPORT2  a.active{color: #ee6c35;}
.promo-code{width:100%;line-height: 30px;margin:1em 0;}

.invoice-info-text{display: inline-block;margin-left:10px;}
.invoice-payment{margin-bottom:1em;}
.invoice-payment ul{display: flex;}
.invoice-payment li{width:33.3%;text-align: center;}
.invoice-payment a{color:#888;}
.invoice-payment a.active{color:#ee6c35;}

.wallet>span{float:right; margin-right: 10px; color: #777;}

.MEMBER_TRANSPORT .place-order-button>.BTN:first-of-type,
.MEMBER_TRANSPORT2 .place-order-button>.BTN:first-of-type{
    background: none;color:#56b1e6;border:1px solid;
}

.MEMBER_TRANSPORT2 #price-total{margin-top:2em;}




/*----------------RWD----------------*/

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

}

@media screen and (max-width:1200px){
    #HOME_SERVICE .COLUMN3{width:95%;}
}


@media screen and (max-width:1024px) {
    .header_in { width: 100%;text-align: center;}
    header{position: relative;}
    .LOGO, nav{float:none;margin:0 auto;}
    .LOGO{width:350px}

    .RIGHT_PAGE {width: calc(100% - 250px);}
    .TITLE{
        /* height: 150px;
        padding-top: 4%;
        background-position: center center; */}
    .CONTAINER{width:90%;}


    nav>ul{display:inline-block;}
    nav>ul>li>a{color:#333;}

}


@media screen and (max-width:980px) {
    .nav, .PAGES{display:none}
    footer{padding:25px 10px;}
}


@media screen and (max-width:850px) {
}


@media screen and (max-width:768px) {
    nav{display: none;}

	footer ul{display:block;}
	footer li{display:block; margin:0 auto 8px auto; padding:8px; width:100%; text-align:center; border-right:none; border-bottom:#dedede 1px solid;}
	footer li:last-of-type{border-bottom:none; margin-bottom:30px;}

    #HOME_SERVICE li{width:100%;margin-bottom:1.7em;}

    #HOME_SERVICE .HOME_TITLE h3,
    #HOME_HOW h2,
    #HOME_COOPER h2{
        font-size:30px;
    }

    .HOWTOUSE .box{padding-left: 0;}
    .LEFT_MENU{width:150px;}
    .RIGHT_PAGE { width: calc(100% - 180px);}

    .footer_contact{margin-top:0;}

	.FAQ #qaContent ul li span{display:block; margin-bottom:10px;}

}


@media screen and (max-width:650px) {
    body{font-size:15px;}
    .COLUMN3>li{ width:100%; margin-left:0%; margin-right:0%;}
    #HOME_PRO { padding: 1% 20% 3%;}
}


@media screen and (max-width:550px) {
    .LEFT,
    .RIGHT,
    .LEFT_50,
    .RIGHT_50,
    .LIST_NEWS,
    .RIGHT_PAGE,
    .MEMBER_TRANSPORT2>.RIGHT,
    .MEMBER_TRANSPORT2>.LEFT{float:none;width:100%}

    .LOGO.LEFT{width:auto;}

    .LOGO{max-width:70%;}

    .TITLE h1 { width: 180px; height: 180px; font-size:24px;}

    .footer_contact{text-align:center;}
    .footer_contact .LIST_LEFT{margin-right:0;}


    .COLUMN4>li{ width:47%; margin-left:1%; margin-right:1%;}

    .LEFT_MENU{display: none;}
    .LEFT_MENU2{display: block}

    .PRO{margin-top:40px;}

    .LIST_LEFT{float:none;}
    .LIST_NEWS .LIST_LEFT{margin-bottom:5px;}
    #contactform{width:100%;}
    #contactform .LIST_LEFT{margin-bottom:7px;text-align: left;}
    input, textarea{max-width: 100%;}
    .CONTAINER{width:90%;}

    .RESULT .TABLE{width:100%;}

    .MEMBER_TRANSPORT2>.RIGHT{margin-top:1em;}
}


@media screen and (max-width:500px) {
    .PRO .LIST_PRO h2{font-size:14px}

}

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

    .HOME_TITLE {margin-bottom: 10px;}
    .place-order-wrapper>span{display: block;}

    .PRO .RIGHT_PAGE .LEFT{width:100%;}
}


@media screen and (max-width:375px) {
    .PRO .use-flexbox{height:150px;}
}






/* New CSS */
.O-CONTAINER{line-height:1.5;padding:1em 0 2.5em 0;width:90%;max-width:80%;margin:1em auto 0 auto;}

#OUTTER_LOGIN #contactform{
    width: 100%;
    margin: 1em auto;
    padding: 1.5em;
    border: 1px solid #ddd;
    box-shadow: 0 0 5px #ccc;
    background: #efefef;
    font-size:15px;
}
#OUTTER_LOGIN .BTN{padding:10px;display: block;width:100%;margin:15px 0;border-radius: 5px;font-size:1.1em;}
#OUTTER_LOGIN #contactform li input{border:none !important;background: #efefef;}
#OUTTER_LOGIN #contactform li{display: inline-flex;border-bottom:1px solid #aaa;margin-bottom: 10px;width:100%;}

@media screen and (max-width:1024px) {
.O-CONTAINER{padding:1em 0 1.5em 0; width:94%; max-width:none; margin:1em auto 0 auto;}
}