/* All */
    /* Clear */
        .clearfix { display: inline-block; }
        .clearfix:after { content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0; }
    /* Font Type */
        .fonts_dbadmanx { font-family: "DBAdmanX"; }
        .fonts_cordiaupc { font-family: "CordiaUPC"; }
    /* Font Size */
        .fonts_size_in_banner_h1 { font-size: 3.5em; }
        .fonts_size_txt_title { font-size: 1.6em; }
        .fonts_size_txt_title2 { font-size: 1.3em !important; }
        .fonts_size_txt_title3 { font-size: 1.25em; }
        .fonts_size_txt_text { font-size: 1.375em; }
        .fonts_size_txt_text2 { font-size: 1.215em; }
        .fonts_size_txt_text3 { font-size: 1.125em; }
        .fonts_size_txt_head { font-size: 1.25em; }
        .fonts_size_txt_head2 { font-size: 1.4em; }
        .fonts_size_title { font-size: 2.75em; }
        .fonts_size_dot { font-size: 16px; }
        .fonts_size_slide_title { font-size: 2.25em; }  /* for Slide */
        .fonts_size_slide_txt { font-size: 1.375em; }   /* for Slide */
        /*.fonts_size_subtitle { font-size: 2.625rem; } */
    /* Font Weight */
        .weight_light { font-weight: lighter; }
        .weight_bold { font-weight: bold; }
    /* Font Color */
        .color_primary { color: #274b2b; }
        .color_white { color: #fff; }
        .color_gray { color: #808080; }
        .color_black { color: #000; }
        .color_green { color: #274b2b;}
        .color_red { color: red; }
    /* Background Color*/
        .bg_white { background-color: #fff; }
        .bg_black { background-color: #000; }
    /* Space */
        .margin-top8 { margin-top: 8px; }
        .margin-top25, .margin-top25-mobile-0 { margin-top: 25px; }
        .margin-top50 { margin-top: 50px; }
        .margin-bottom25 { margin-bottom: 25px; }
        .margin-bottom50 { margin-bottom: 50px; }
        .margin-left50 { margin-left: 50px; }
        .no-margin-bottom { margin-bottom: 0px; }
        .padding-zero { padding: 0; }
        .padding-top50 { padding-top: 50px; }
    /* Class All */
        .full-height {  height: 100%; }
        .full-width { width: 100% !important; }
        .full-width-width-dot { width: 90% !important; }
        .lineHeight25 { line-height: 20px; }
        .displayInline { display: inline !important; }
        .displayInlineBlock { display: inline-block; }
        .indextZero { text-indent: 0px; }
        .indextText { text-indent: 35px; }
        button, .button {
            display: inline-block;
            /*margin: 0.55rem;*/
            padding: 0.55rem 3rem;
            border: none;
            border-radius: 0.1875rem;           /* CSS3 Property */
            -moz-border-radius: 0.1875rem;      /* Firefox */
            -webkit-border-radius: 0.1875rem;   /* Chrome/Safari */
            -khtml-border-radius: 0.1875rem;    /* Linux browsers */
            outline: none;
            font-family: inherit;
            font-size: 1.125em;
            font-weight: 300;
            line-height: 1.125rem;
            text-decoration: none;
            cursor: pointer;
            -webkit-transition: all 150ms ease-out;
            transition: all 150ms ease-out;

            opacity: 0.87;
            -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=87)";
            filter: alpha(opacity=87);
            -moz-opacity:0.87;
            -khtml-opacity: 0.87;
        }
        button:hover, .button:hover {
            opacity: 1;
            -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
            filter: alpha(opacity=100);
            -moz-opacity: 1;
            -khtml-opacity: 1;
        }
        .line-underline { border-bottom: 1px solid #808080; }
        .btn {
              display: block;
              text-align: center;
              cursor: pointer;
              border: none;
              height: 40px;
              padding: 0 14px;
              border-radius: 5px;
              -webkit-box-shadow: inset 0 -2px 0 0 rgba(0, 0, 0, 0.15);
              -moz-box-shadow: inset 0 -2px 0 0 rgba(0, 0, 0, 0.15);
              box-shadow: inset 0 -2px 0 0 rgba(0, 0, 0, 0.15);
              font-size: 1.25em;
              line-height: 37px;
              -webkit-transition-property: background-color;
              -webkit-transition-duration: 0.2s;
              -webkit-transition-timing-function: linear;
              -moz-transition-property: background-color;
              -moz-transition-duration: 0.2s;
              -moz-transition-timing-function: linear;
              -ms-transition-property: background-color;
              -ms-transition-duration: 0.2s;
              -ms-transition-timing-function: linear;
              -o-transition-property: background-color;
              -o-transition-duration: 0.2s;
              -o-transition-timing-function: linear;
              transition-property: background-color;
              transition-duration: 0.2s;
              transition-timing-function: linear;
              background: #fafafa;
              color: #000000;
              margin: 8px;
        }
        .btn i {  line-height: 37px;}
        .btn:active, .btn:active i { line-height: 40px; }
        .btn-inline {
              display: inline-block;
              vertical-align: middle;
        }
        .btn-inline span i { color: #808080; }
        .btn-inline span i:hover { color: #000000; }
        .ul_middle_dot {
            list-style-type: disc;
        }


/* Element */
        html, body {
            margin: 0;
            padding: 0;
        }
        html {
            font-size: 100%;
        }
        body {
            background-image: url('../images/bg.jpg');
            background-image: url('../images/bg_mobile.jpg');
            background-repeat: repeat-y;
            background-attachment: scroll;
            background-position: center;
            -webkit-background-size: cover;
            -moz-background-size: cover;
            -o-background-size: cover;
            background-size: cover;

            font-size: 100%;
        }
        a {
            text-decoration: none;
            color: inherit;
        }
        ul {
            margin: 0;
            padding: 0;
        }
        input.search {
            display: block !important;
            padding: 0.25em !important;
            width: 100% !important;
            font-size: 1.125em !important;
            /*margin-bottom: 1em !important;*/
            border-radius: 3px !important;
            border: 1px solid #808080 !important;
        }
        input.borderradius {
            padding: 0.25em;
            width: 85%;
            font-size: 1.125em;
            margin-bottom: 0.25em;
            border-radius: 3px;
            border: 1px solid #808080;
            font-family: "CordiaUPC";
            display: inline-block;
        }
        .w-100 {
            width:100% !important;
        }
        select {
          /* styling */
          background-color: white;
          border: thin solid #808080;
          border-radius: 4px;
          display: inline-block;
          font: inherit;
          line-height: 1.5em;
          font-family: "DBAdmanX";

          /* reset */
          margin: 0;
          -webkit-box-sizing: border-box;
          -moz-box-sizing: border-box;
          box-sizing: border-box;
          -webkit-appearance: none;
          -moz-appearance: none;
        }
        select:hover { cursor: pointer;}
        textarea { resize: none; }


/* Pages Default */
        /* Slide */
          .slide-layer-1 { z-index: 88; }
          .slide-layer-2 { z-index: 123; }
          .slide-layer-3 { z-index: 231; }
          .slide-layer-4 { z-index: 320; }
          .slide-main-background {
              background-size: contain;
              background-position: center top;
              background-repeat: no-repeat;
          }
          .hiddenbeforeslide {
              width: 100%;
              text-align: center;
          }
          .slide-txt-detail { line-height: 25px; }

         /* Banner */
          #landing_content {
              background-size: cover;
              background-repeat: no-repeat;
              background-position: center;

              display: table;
              text-align: center;
              width: 100%;
              min-height: 400px;
              height: 400px;
          }
          #landing_content h1 {
              display: table-cell;
              vertical-align: middle;
          }
          .slide-content {
              width: 100%;
              font-family: "DBAdmanX";
              display: none;
          }
          .blink {
              animation: blink-animation 1s steps(5, start) infinite;
              -webkit-keyframes: blink-animation 1s steps(5, start) infinite;
          }
          @keyframes blink-animation {
              to {
                  visibility: hidden;
              }
          }
          @-webkit-keyframes blink-animation {
              to {
                  visibility: hidden;
              }
          }

        /* inner Banner */
          .products-picture { margin-top: -180px; }
          .products-slider, .news-slider, .factory-slider,
          .aica-slider, .tips-slider, .csr-slider {
              margin-top: -160px;
          }
          .products-slider { margin-bottom: 25px; }

        /* goto Top */
        .cd-top {
            display: inline-block;
            height: 25px;
            width: 25px;
            position: fixed;
            bottom: 40px;
            right: 10px;
            box-shadow: 0 0 10px rgba(0, 0, 0, 0.05);
            /* image replacement properties */
            overflow: hidden;
            text-indent: 100%;
            white-space: nowrap;
            background: #274b2b url(../images/cd-top-arrow.svg) no-repeat center 50%;
            visibility: hidden;
            opacity: 0;
            -webkit-transition: opacity .3s 0s, visibility 0s .3s;
            -moz-transition: opacity .3s 0s, visibility 0s .3s;
            transition: opacity .3s 0s, visibility 0s .3s;
        }
        .cd-top.cd-is-visible, .cd-top.cd-fade-out, .no-touch .cd-top:hover {
            -webkit-transition: opacity .3s 0s, visibility 0s 0s;
            -moz-transition: opacity .3s 0s, visibility 0s 0s;
            transition: opacity .3s 0s, visibility 0s 0s;
        }
        .cd-top.cd-is-visible {
            visibility: visible;
            opacity: 1;
        }
        .cd-top.cd-fade-out {
            opacity: .5;
        }
        .no-touch .cd-top:hover {
            background-color: #274b2b;
            opacity: 1;
        }

        /* footer */
          .leaf-footer { z-index: 2; }
          footer {
              background-color: #000;
              color: #fff;
              z-index: 8;
              position: relative;
          }
          footer ul {
              line-height: 150px;
              vertical-align: middle;
          }
          footer li {
            display: inline-block;
            padding-left: 20px;
            padding-right: 20px;
          }
          footer li a:hover { color: #888888; }
          .footer-copyright {
              border-top: 1px solid #888888;
              line-height: 55px;
          }
          .footer-copyright i { font-size: 1em; }
          .to-top{
            	width: 40px;
            	height: 40px;
            	position: absolute;;
            	top: 15px;
            	right: 15px;
            	cursor:pointer;
          }


/* Home */
          /* Cover Pages */
            #fixmobile {
                position:static;
                top:auto;
            }
            #divTitle {
                margin-top: 0px;
            }
          .overlay {
              position: fixed;
              width: 100%;
              height: 100%;
              left: 0;
              top: 0;
              background: rgba(51,51,51,0.7);
              z-index: 10;
          }
          .cover {
              position: absolute;
              width: 55%;
              height: 55%;

              -vendor-animation-delay: 5s;
          }
          .leaf-icon-click {
              position: absolute;
              left: 50%;
              top: 50%;

              margin-top: -25px;
              margin-left: -25px;

              z-index: 231;
              cursor: pointer;
          }
          .leaf01 { left: 0; top: 0; z-index: 12; background: red; }
          .leaf02 { left: 0; bottom: 0; z-index: 11; background: yellow; }
          .leaf03 { left: 20%; bottom: 0; z-index: 13; background: gray; }
          .leaf04 { right: 0; bottom: 0; z-index: 14; background: green; }
          .leaf05 { right: 0; top: 0; z-index: 15; background: blue; }
          .leaf06 { right: 20%; top: 0; z-index: 16; background: orange; }
          .overlay {
              -webkit-animation-duration: 5s;
              -moz-animation-duration: 5s;
              -o-animation-duration: 5s;
              -ms-aanimation-duration: 5s;
          }
          .leaf01, .leaf02, .leaf03, .leaf04, .leaf05, .leaf06 {
              -webkit-animation-duration: 4s;
              -moz-animation-duration: 4s;
              -o-animation-duration: 4s;
              -ms-aanimation-duration: 4s;
           }


          /* Section Franchise */
          .franchise {
              background-image: url('../images/bg-franchise.jpg');
              background-repeat: no-repeat;
              background-position: center;
              background-size: cover;
              height: 400px;
          }
          .franchise-row {
              height: 100%;
          }
          .franchise-txt {
              position: relative;
              top: 50%;
              transform: translateY(-50%);
          }
          .btn-franchise {
              font-family: "DBAdmanX";
              font-weight: bold;
              font-size: 1.125rem;

              color: #000;
              background-color: #fbb813; /* #284a2b;*/
          }
          .franchise-txt-detail {
              font-family: "DBAdmanX";
              margin-bottom: 25px;
              font-size: 1.25em;
          }
          #request_notic_page_2 {
              text-align: left;
              font-size: 1.25em;
          }

          /* Section About Us */
          .aboutus-detail {
              font-size: 1.25rem;
          }
          .btn-aboutus{
              font-family: "DBAdmanX";
              font-weight: bold;
              font-size: 1.125rem;

            color: #fff;
            background-color: #284a2b;
            width: 125px;
            height: 36px;
            border-radius: 5px;
            border: none;
          }
          /* Section VDO */
          .video-container {
            	position:relative;
            	padding-bottom:56.25%;
            	padding-top:30px;
            	height:0;
            	overflow:hidden;
          }
          .video-container iframe, .video-container object, .video-container embed {
            	position:absolute;
            	top:0;
            	left:0;
            	width:100%;
            	height:100%;
          }
          .vdo-carousel-conten p { margin-bottom: 0px; }
          .vdo-content-txt {  display: none; }

          /* Section AICA */
          .aica {
              background-image: url('../images/bg-aica.jpg');
              background-repeat:repeat;
              overflow: hidden;
              position: relative;
          }
          .aica-pic, .aica-txt { display: table; }
          .aica-pic { padding: 0; }
          .aica-middle {
              display: table-cell;
              vertical-align: middle;
          }
          .aica-content {
              background-color: #fff;
              border-radius: 10px;            /* CSS3 Property */
              -moz-border-radius: 10px;       /* Firefox */
              -webkit-border-radius: 10px;    /* Chrome/Safari */
              -khtml-border-radius: 10px;     /* Linux browsers */
              margin: 0 auto;
              padding: 5%;
              width: 90%;
          }
          .aica-content-title {
              font-size: 2rem;
              margin-bottom: 25px;
          }
          .aica-content-txt {
              font-size: 1.25em;
              line-height: 20px;
              margin-bottom: 25px;
          }
          .btn-aica{
              font-family: "DBAdmanX";
              font-weight: bold;
              font-size: 1.125rem;

              color: #fff;
              background-color: #284a2b;
          }


          /* Section CSR */
          .csr {
              background-image: url('../images/bg-csr.jpg');
              background-repeat: no-repeat;
              background-position: center;
              background-size: cover;
              /*height: 350px;*/
              height: 348px;
          }
          .csr-content {
              position: relative;
              height: 100%;
          }
          .csr-detail {
              position: absolute;
              left: 12%;
              bottom: 10%;
              width: 76%;
              color: #fff;
          }
          .csr-txt label {
              display: inline;
              color: #fbb813;
          }
          .csr-txt label:hover {
              font-weight: bold;
              cursor: pointer;
          }
          .csr-title, .csr-title label  {
              font-family: "DBAdmanX";
              font-size: 2.625rem;
              vertical-align: bottom;
              line-height: 35px;
          }
          .csr-overview {
              font-family: "DBAdmanX";
              font-size: 1.25em;
              vertical-align: bottom;
          }
          .csr-overview label {
              font-family: "DBAdmanX";
              font-style: italic;
              font-size: 1.125rem;
          }

          /* Section News */
          .news a:hover {
              color: #000000;
              font-weight: bold;
          }
          .news-description, .news-datetime, .news-content {
              padding-left: 5%;
              padding-right: 5%;
          }
          .news-description {
              font-family: "DBAdmanX";
              font-size: 1.6em;
              line-height: 22px;
              margin-bottom: 0px;
              height: 44px;
              min-height: 44px;
              max-height: 44px;
              overflow: hidden;
          }
          .news-datetime {
              font-family: "DBAdmanX";
              font-size: 1.5em;
              font-style: italic;
              color: #888888;
          }
          .add_news_pages { cursor: pointer; }


/* Products Pages */
          .products-list-coffee, .products-list-milk, .products-list-tea, .products-list-fruit {
              margin-bottom: 60px;
          }
          .products-header-row {
              border-bottom: 1px solid #000;
              margin-bottom: 12px;
          }
          .products-header-title {
              font-size: 3em;
              padding-top: 20px;
          }
          .products-header-icon { line-height: 35px; }
          .products-header-icon-txt { font-size: 1.375em; }
          .seed_icon {
              background-image: url('../images/icon_seed_green.png');
              background-repeat: no-repeat;
              background-position: center;
              margin: 6.5px auto;
              width: 12px;
              height: 12px;
          }
          .products-list-selectd { line-height: 25px; }
          .products-coffee-list { font-size: 1.375em; }
          a:hover .products-list-selectd {
              background-color: #274b2b;
              color: #fff;
          }
          a:hover .products-list-selectd .seed_icon { background-image: url('../images/icon_seed_white.png'); }
          .icon-products:hover {
            -webkit-transform: scale(1.1);
            -moz-transform: scale(1.1);
            -o-transform: scale(1.1);
            transform: scale(1.1);
          }

/* Products Detail Pages */
          .product-detail-content {
              padding-left: 5%;
              padding-right: 5%;
          }
          .products-detail-header {
              font-weight: bold;
              font-size: 2rem;
              border-bottom: 1px solid #000;
              margin-bottom: 30px;
          }
          .products-detail-txt {
              margin-bottom: 50px;
              font-family: "DBAdmanX";
              font-size: 1.125rem;
          }
          .icon-badge button {
            width: 76px !important;
            height: 76px !important;
            border: none !important;

            background-repeat: no-repeat;
            margin: 0 15px;
          }
          .pdicon-hot { background-image: url('../images/products_icon_hot.png'); }
          .pdicon-cool { background-image: url('../images/products_icon_cool.png'); }
          .pdicon-smooty { background-image: url('../images/products_icon_smooty.png'); }
          .pdicon-hot:hover { background-image: url('../images/products_icon_hot_hover.png'); }
          .pdicon-cool:hover { background-image: url('../images/products_icon_cool_hover.png'); }
          .pdicon-smooty:hover { background-image: url('../images/products_icon_smooty_hover.png'); }
          .pdicon-hot.is-active { background-image: url('../images/products_icon_hot_hover.png'); }
          .pdicon-cool.is-active { background-image: url('../images/products_icon_cool_hover.png'); }
          .pdicon-smooty.is-active { background-image: url('../images/products_icon_smooty_hover.png'); }
          .pdicon-hot_EN { background-image: url('../images/products_icon_hot_EN.png'); }
          .pdicon-cool_EN { background-image: url('../images/products_icon_cool_EN.png'); }
          .pdicon-smooty_EN { background-image: url('../images/products_icon_smooty_EN.png'); }
          .pdicon-hot_EN:hover { background-image: url('../images/products_icon_hot_hover_EN.png'); }
          .pdicon-cool_EN:hover { background-image: url('../images/products_icon_cool_hover_EN.png'); }
          .pdicon-smooty_EN:hover { background-image: url('../images/products_icon_smooty_hover_EN.png'); }
          .pdicon-hot_EN.is-active { background-image: url('../images/products_icon_hot_hover_EN.png'); }
          .pdicon-cool_EN.is-active { background-image: url('../images/products_icon_cool_hover_EN.png'); }
          .pdicon-smooty_EN.is-active { background-image: url('../images/products_icon_smooty_hover_EN.png'); }
          .section-social {
              line-height: 30px;
              vertical-align: middle;
          }
          .share-to-social {
              display: inline-block;
              line-height: 25px;
              vertical-align: middle;
          }
          .sectiop-goback {
              line-height: 36px;
              vertical-align: middle;
          }
          .goback-to-products a {
              line-height: 30px;
              vertical-align: middle;
          }
          .goback-to-products:hover .icon-goback  {
              background-image: url('../images/icon_back_hover.png');
          }
          .icon-goback {
              background-image: url('../images/icon_back.png');
              width: 24px;
              height: 24px;
              margin-top: 6px;
              display: inline-block;
              cursor: pointer;
          }
          .txt-goback {
              display: inline-block;
              line-height: 36px;
              vertical-align: top;
              cursor: pointer;
          }
          .social-share2  {
              display: inline-block;
              margin-top: -10px;
          }
          .social-share  {
              display: inline-block;
              background-image: url('../images/products_social.png');
              cursor: pointer;
              margin-top: 3px;
              width: 25px;
              height: 24px;
          }
          .ss-twitter { background-position: left 0px top 0px; }
          .ss-facebook { background-position: left 79px top 0px; }
          .ss-googleplus { background-position: left 53px top 0px; }
          .ss-print { background-position: left 25px top 0px; }
          .products-other {
              margin: 15px auto;
          }


/* Promotion Pages */
          .promotion { margin-top: -150px; }
          .promotion .columns {
              padding-left: 0.375rem;
              padding-right: 0.375rem;
          }
          .transition-promotion-products {
              -webkit-transform: scale(1.1);
              -moz-transform: scale(1.1);
              -o-transform: scale(1.1);
              transform: scale(1.1);
          }
          .promotion-thumbnail {
              width: 300px;
              height: 400px;

              -webkit-transition: all .4s ease-in-out;
              -moz-transition: all .4s ease-in-out;
              -o-transition: all .4s ease-in-out;
              -ms-transition: all .4s ease-in-out;
          }
          .promotion-picture {
              margin-bottom: 25px;
              min-height: 420px;
              max-height: 420px;
              padding-top: 25px;
              padding-bottom: 15px;
          }
          .promotion-description {
              font-family: "DBAdmanX";
              font-size: 1.5em;
              color: #000000;
              height: 70px;
              min-height: 70px;
              max-height: 70px;
              line-height: 25px;

              margin: 0 auto;
              width: 285px;
              padding-left: 15px;

              overflow: hidden;
          }
          .promotion-datetime {
              font-family: "DBAdmanX";
              font-size: 1.4em;
              font-style: italic;
              color: #808080;
              margin: 0 auto;
              width: 285px;
              padding-left: 15px;
          }
          .promotion-page { margin-top: -10%; }
          .promotion-page a:hover { font-weight: bold; }


/* Promotion Detail Pages */
          .promotions-detail-header,  .promotions-detail-header-l2 {
              font-size: 2rem;
              overflow: hidden;
              font-family: "DBAdmanX";
          }
          .promotions-detail-slide-show {
              margin-top: -150px;
              z-index: 231;
          }
          .promotions-detail-header { font-weight: bold; }
          .promotions-detail-header-l2 {  border-bottom: 1px solid #000; }
          .promotions-detail-txt {
              margin: 25px 0 50px 0;
              font-size: 1.4em;
          }
          .btn-branch {
              font-family: "DBAdmanX";
              font-weight: bold;
              font-size: 1.125rem;

              color: #000;
              background-color: #fbb813; /* #284a2b;*/
              border-radius: 3px !important;
          }
          .branch-pin {
              margin-top: -40px;
          }


/* Franchise */
          /*.tabs-form {
              display: inline-block;
              margin-bottom: 0px;
          }
          .tabs-form-number {
              border: 1px solid #808080;
              width: 30px;
              text-align: center;
              -webkit-border-radius: 25px;
              -moz-border-radius: 25px;
              border-radius: 25px;
          }
          .tabs-title-01.is-active {
              color: #274b2b;
              border-bottom: 3px solid #274b2b;
          }
          .tabs-title-02.is-active {
              color: #48a841;
              border-bottom: 3px solid #48a841;
          }
          .tabs-title-03.is-active {
              color: #fbb814;
              border-bottom: 3px solid #fbb814;
          }*/
          .show-error {
              color: #ff0000;
              font-size: 0.825em;
              display: none ;
          }
          .border-error { border:2px solid red !important; }
          .show-error-active { display: block !important; }
          .tabs-form {
              display: inline-block;
              margin-bottom: 0px;
              font-size: 18px;
              color: #808080;
          }
          .tabs-form-number {
              border: 1px solid #808080;
              width: 30px;
              text-align: center;
              -webkit-border-radius: 25px;
              -moz-border-radius: 25px;
              border-radius: 25px;
          }

          .tab-title-default
          {
              padding-bottom: 5 px !important;
          }

          .tabs-title-01.is-active {
              color: #274b2b;
              border-bottom: 3px solid #274b2b;
              padding-bottom: 5px;
          }
          .tabs-title-02.is-active {
              color: #48a841;
              border-bottom: 3px solid #48a841;
              padding-bottom: 5px;
          }
          .tabs-title-03.is-active {
              color: #fbb814;
              border-bottom: 3px solid #fbb814;
              padding-bottom: 5px;
          }
          .tabs-title-01.is-active > p { color: #274b2b !important; font-size:18px; }
          .tabs-title-02.is-active > p { color: #48a841 !important; font-size:18px; }
          .tabs-title-03.is-active > p { color: #fbb814 !important; font-size:18px; }
          .tabs-title-01.is-active > .tabs-form-number { border-color: #274b2b !important; background-color: #274b2b; color: #fff !important;  }
          .tabs-title-02.is-active > .tabs-form-number { border-color: #48a841 !important; background-color: #48a841; color: #fff !important; }
          .tabs-title-03.is-active > .tabs-form-number { border-color: #fbb814 !important; background-color: #fbb814; color: #fff !important; }

          .request_datetime { display: inline-block; }
          .require_dot { vertical-align: top; }
          .require_reason, .request_comment {
              width: 100%;
              height: 125px;
          }
          .btn-franchise-back {
              font-family: "DBAdmanX";
              font-weight: bold;
              font-size: 1.125rem;

              color: #fff;
              background-color: #808080;
          }
          .image-upload {
              display: inline-block;;
              margin: 2px 5px;
          }
          .image-upload > input {
              visibility:hidden;
              width:0;
              height:0
          }
          .image-icon-input-file {
              pointer-events: none;
              cursor: pointer;
          }
          .tab3-text-right { text-align: right; }

/* News */
          .news-carousel-content {
              text-align: left;
              padding-top: 15px;
          }
          .news-carousel { display: none; }
          .news-datetime-slide, .news-datetime-slide2 {
              font-family: "DBAdmanX";
              font-size: 1.125em;
              font-style: italic;
              color: #888888;
          }
          .news-datetime-slide2 {
              font-size: 1.5em;
          }
          .news-filter {
              margin-bottom: 35px;
          }
          .news-filter-type, .news-filter-type2, .news-filter-type3  {
              font-family: "DBAdmanX";
              font-size: 1.25em;
          }
          .news-filter-type {
              padding-top: .25em;
              cursor: pointer;
          }
          .news-filter-type2 { padding: 0; }
          .news-filter-type3 {
              padding: 0 15px;
              display: inline-block;
          }
          .news-divright {
              /*background-color: #fff;*/
          }
          select.minimal {
              background-image:
                  linear-gradient(45deg, transparent 50%, gray 50%),
                  linear-gradient(135deg, gray 50%, transparent 50%),
                  linear-gradient(to right, #ccc, #ccc);
              background-position:
                  /*calc(100% - 20px) calc(1em + 2px),
                  calc(100% - 15px) calc(1em + 2px),
                  calc(100% - 2.5em) 0.5em;*/
                  calc(100% - -.5em) calc(0.5em),
                  calc(100% - -.7em) calc(.5em),
                  calc(100% - .25em) 0.025em;
              background-size:
                  5px 5px,
                  5px 5px,
                  1px 25px;
              background-repeat: no-repeat;
          }

          select.minimal:focus {
            background-image:
              linear-gradient(45deg, green 50%, transparent 50%),
              linear-gradient(135deg, transparent 50%, green 50%),
              linear-gradient(to right, #ccc, #ccc);
            background-position:
            calc(100% - -.7em) calc(0.5em),
            calc(100% - -.5em) calc(.5em),
            calc(100% - .25em) 0.025em;
            background-size:
              5px 5px,
              5px 5px,
              1px 25px;
            background-repeat: no-repeat;
            border-color: green;
            outline: 0;
          }
          select:-moz-focusring {
            color: transparent;
            text-shadow: 0 0 0 #000;
          }
          .news-detail-datetime {
              margin-bottom: 25px;
              font-size: 1.4em;
              font-style: italic;
          }
          .news-detail-txt {  margin: 25px 0 50px 0; }
          .as-same-sa-height { display: table; }
          .as-same-sa-height a {
              display: table-cell;
              vertical-align: middle;
          }
          .news-inline-groups:hover {
              -webkit-transform: scale(1.05);
              -moz-transform: scale(1.05);
              -o-transform: scale(1.05);
              transform: scale(1.05);
              background-color: #fff;
              -moz-box-shadow:    1px 1px 2px 2px #ccc;
              -webkit-box-shadow: 1px 1px 2px 2px #ccc;
              box-shadow:         1px 1px 2px 2px #ccc;
          }
          .news-inline-groups2:hover .news-divleft, .news-inline-groups2:hover .amazon-csr-divright,
          .news-inline:hover .news-inline-image,  .news-inline:hover .news-inline-text{
              -webkit-transform: scale(1.05);
              -moz-transform: scale(1.05);
              -o-transform: scale(1.05);
              transform: scale(1.05);
          }
          .news-inline:hover .news-inline-text, .news-inline-groups2:hover .amazon-csr-divright{
              background-color: #fff;
          }
          .next_page { cursor: pointer; }

/* AICA */
          .aica-exhibition {
              list-style: decimal;
              padding-left: 50px;
              margin-bottom: 25px;
          }
		  .aica-middle img { width: 100%; } 


/* Factory */
          .factory-pic-slide { position: relative; }
          .factory-pic-slide .item{ margin: 8px;}
          .factory-pic-slide .item img {
              display: block;
              width: 100%;
              height: auto;
          }
          .factory-pic-slide-one .item img{
              display: block;
              width: 100%;
              height: auto;
          }
          .fs-upload-target {
              background: #CFD8DC;
              border-color: #546E7A;
              color: #263238;
              padding: 8px;
          }


/* Contact */
          .contact-us-addr { margin-bottom: 25px; }
          .googlemap {
              position: relative;
              min-height: 400px;
              width: 100%;
          }
          .select-branch {
              position: absolute;
              right: 0px;
              top: 35px;
              height: calc(100% - 70px);
              width: 35%;
              z-index: 231;
              padding: 35px 0;
              background-color: #fff;
              opacity: 0.85;
          }
          .select-branch-list-mobile {
              margin-top: 25px;
              margin-bottom: 8px;
          }
          .select-branch-list { list-style: none; }
          .select-branch-list li {
              padding: 8px;
              border-bottom: 1px solid #808080;
              cursor: pointer;
          }
          #googlemap {
              width: 100%;
              min-height: 400px;
              height: auto;
              margin: 35px auto;
          }
          .branch-latitude, .branch-longitude, .branch-text { display: none; }


/* Tips */
          .tips-detail-txt { margin-bottom: 25px; }


/* About */
          .cafe-about-txt { margin-bottom: 25px; }


/* FAQ */
          .integration-list ul {
              padding: 0;
              margin: 20px 0;
              color: #555;
          }
          .integration-list ul > li {
              list-style: none;
              display: block;
              padding: 15px;
              overflow: hidden;
          }
          .expand {
              display: block;
              text-decoration: none;
              border-bottom: 1px solid #808080;
              cursor: pointer;
          }
          .right-arrow {
              float: right;
              margin-left: 20px;
          }
          #faq-ans-left, #faq-ans-right{
              display: table;
              float: left;
              height: 100%;
          }
          #faq-ans-left { width: 25px; }
          #faq-ans-right { width: calc(100% - 25px); }
          .detail {
              margin: 10px 0 10px 0px;
              display: none;
              line-height: 22px;
              min-height: 80px;
          }
          .detail a {
              text-decoration: none;
              color: #274b2b;
              padding: 6px 10px 5px;
              margin-right: 7px;
              font-weight: bold;
          }


/* CSR & CSR Detail */
          .amazon-csr-divleft {
              max-width: 365px;
              overflow: hidden;
              float: right;
          }
          .amazon-csr-divright {
              max-width: 365px;
              min-width: 365px;
              overflow: hidden;
          }
          /*.amazon-csr-divleft:hover, .amazon-csr-divright:hover {
              background-color: #fff;

              -webkit-transform: scale(1.05);
              -moz-transform: scale(1.05);
              -o-transform: scale(1.05);
              transform: scale(1.05);

              -moz-box-shadow:    1px 1px 2px 2px #ccc;
              -webkit-box-shadow: 1px 1px 2px 2px #ccc;
              box-shadow:         1px 1px 2px 2px #ccc;
          }*/
          .csr-continue {
              display: inline-block;
              color: #fcc237;
          }
          .amazon-csr-img-space {
              margin-top: 25px;
              margin-bottom: 30px;
          }
          .amazon-csr-indent {
              padding-left: 50px;
              margin-bottom: 50px;
          }
          .amazon-csr-indent li { margin-bottom: 15px;  }
          .amazon-csr-detail { margin-top: 50px; }
          .csr-inline:hover {
              background-color: #fff;

              -webkit-transform: scale(1.05);
              -moz-transform: scale(1.05);
              -o-transform: scale(1.05);
              transform: scale(1.05);

              -moz-box-shadow:    1px 1px 2px 2px #ccc;
              -webkit-box-shadow: 1px 1px 2px 2px #ccc;
              box-shadow:         1px 1px 2px 2px #ccc;
          }


/* Overide */
          .thumbnail { 
				border: 0px; 
				max-width: 365px;				
			}
          .thumbnail:hover, .thumbnail:focus { box-shadow: 0 0 6px 1px rgba(136, 136, 136, 0.5); }
          .orbit-bullets { /*margin-top: -35px;*/ }
          .orbit-bullets button {
              width: 0.8rem;
              height: 0.8rem;
              padding: 0;
          }
          .orbit-bullets button.is-active, .orbit-bullets button:hover {
              background-color: #274b2b;
          }
          .orbit-bullets button {
              background-color: none;
              border: 1px solid #274b2b;
          }
          .owl-prev, .owl-next {
              position: absolute;
              top: 45%;
          }
          .owl-prev { left: 2%; }
          .owl-next { right: 2%; }

          .pagination .current { background: none; }
          .pagination .current a {
              -webkit-border-radius: 25px;
              -moz-border-radius: 25px;
              border-radius: 25px;
              width: 25px;
              padding: 0px;
              color: #000;
              border: 1px solid #000;
              background: none;
          }
          .pagination a:hover, .pagination button:hover {
              background: none;
              padding: 0px;
              color: #000;
              border: 1px solid #000;
              width: 25px;

              -webkit-border-radius: 25px;
              -moz-border-radius: 25px;
              border-radius: 25px;
          }

          .tabs-title {
              background: none;
              border-top: 0px;
              border-left: 0px;
              border-right: 0px;
              border-bottom: 1px solid #808080;
              text-align: left;
          }
          .tabs-content {
              background: none;
              border: 0px;
          }
          .tabs-title > a:focus, .tabs-title > a[aria-selected="true"] {
              background: none;
          }
          .tabs-title > a {
              padding: 0.25rem 1.5rem;
              font-size: 1.125em;
              color: #808080;
              font-weight: bold;
          }
          .tabs-title > a:hover { background: none; }
          .tabs-panel { padding: 1rem 2.5rem; }
          .sa-confirm-button-container .confirm {
              background-color: #284a2b !important;
          }




/* Media Query */
/* Small screens : max-width 640px, mobile-only styles, use when QAing mobile issues  */
@media only screen and (max-width: 768px) {/**/
    .margin-top4m { margin-top: 4px; }
    .fonts_size_slide_title {
        font-size: 2.125em;
        margin-top: -8px;
        margin-bottom: 0px;
    }
    .slide-txt-detail { line-height: 20px; }
    .fonts_size_in_banner_h1 {
        font-size: 2.625em;
        line-height: 35px;
    }
    .margin-top25-mobile-0 { margin-top: 0px; }
    .m_margintopbottom8 { margin-bottom: 8px; }
    .m_margintopbottom5 {
        margin-top: 5px;
        margin-bottom: 5px;
    }
    .m_margintopbottom15 {
        margin-top: 15px;
        margin-bottom: 15px;
    }
    .slide-main-background {
        background-size: cover;
        background-position: center center;
    }
    .orbit-bullets { margin-top: 0px; }
    .icon-badge button { margin: 0 5px; }
    .franchise {
        background-image: url('../images/bg-franchise-mobile.jpg');
        background-repeat: no-repeat;
        background-position: center;
        background-size: cover;
        height: 350px;
    }
    .franchise-row .medium-6 {width: 100% !important; }
    .tab3-text-right {
        text-align: left;
        font-weight: bold;
    }
    .promotion-picture {
        min-height: auto !important;
        max-height: auto !important;
    }
    .promotion-thumbnail {
        width: 91% !important;
        height: auto !important;
    }
    .promotion-description, .promotion-datetime { width: auto; }
    .aica-middle {
        margin-top: 25px;
        padding-bottom: 25px;
        line-height: 160%;
    }
    .csr, .franchise { background-size: cover; }
    .news-picture { margin-bottom: 8px; }
    .news-description {
        height: 66px;
        min-height: 66px;
        max-height: 66px;
    }
    .news-datetime { margin-bottom: 25px; }
    .products-header-title { font-size: 2em; }
    .promotion-thumbnail {
        width: 280px;
        height: 360px;
    }
    .promotion-picture {
        margin-bottom: 8px;
        min-height: 400px;
        max-height: 400px;
        overflow: hidden;
    }
    .promotion-page { margin-top: -32%; }
    .amazon-csr-detail { margin-top: 25px; }
    .amazon-csr-indent { padding-left: 35px; }
    .tabs-title-01, .tabs-title-02, .tabs-title-03,
    .tabs-title-01.is-active, .tabs-title-02.is-active, .tabs-title-03.is-active {
        border-bottom: 0px;
    }
    footer ul {
        line-height: inherit;
        padding-top: 10px;
        padding-bottom: 10px;
    }
    footer li {
        padding-left: 25px;
        display: block;
        text-align: left;
    }

	.thumbnail {
		width:100%;
	}
	
	.tabs-title{
		border-bottom:none;
		padding-bottom:5px;
	}
	
	.mobilepadding {
		
		margin-bottom: 0.25em;
		
	}

    #fixmobile {
        /*position: relative;*/
        top: 80px;
    }
    #divTitle {
                margin-top: 70px;
            }
    /* Overide */
    .pagination li { display: inline-block; }
}

/* Medium screens :
    min-width 641px, medium screens
    min-width 641px and max-width 1024px, use when QAing tablet-only issues */
@media only screen and (min-width: 40.063em) {
    .cafe-about, .amazon-faq { min-height: 640px; }
}
@media only screen and (min-width: 40.063em) and (max-width: 64em) {
    .aica-middle { line-height: 160%; }
    .csr, .franchise { background-size: cover; }
    .promotion-page { margin-top: -20%; }
    .news-description {
        height: 66px;
        min-height: 66px;
        max-height: 66px;
    }
    .tabs-title { text-align: center; }
}

/* Large screens :
    min-width 1025px, large screens
    min-width 1025px and max-width 1440px, use when QAing large screen-only issues */
@media only screen and (min-width: 64.063em) {
}
@media only screen and (min-width: 64.063em) and (max-width: 90em) {
}

/* XLarge screens :
    min-width 1441px, xlarge screens
    min-width 1441px and max-width 1920px, use when QAing xlarge screen-only issues */
@media only screen and (min-width: 90.063em) {
}
@media only screen and (min-width: 90.063em) and (max-width: 120em) {
}

/* XXLarge screens : min-width 1921px, xxlarge screens */
@media only screen and (min-width: 120.063em) {
}