/* Welcome to Compass.
 * In this file you should write your main styles. (or centralize your imports)
 * Import this file using the following HTML or equivalent:
 * <link href="/stylesheets/screen.css" media="screen, projection" rel="stylesheet" type="text/css" /> */
/* In type partial */
/* line 43, ../sass/screen.scss */
body {
  font-family: 'Roboto', sans-serif;
}

/* line 47, ../sass/screen.scss */
.container-head {
  background-color: #ffffff;
  position: relative;
  padding: 20px 15px 5px 15px;
}
/* line 52, ../sass/screen.scss */
.container-head .box-logo {
  text-align: center;
}
/* line 55, ../sass/screen.scss */
.container-head .box-logo img {
  width: 180px;
}
/* line 60, ../sass/screen.scss */
.container-head .title {
  text-align: center;
}
/* line 63, ../sass/screen.scss */
.container-head .title h2 {
  color: #424242;
}
/* line 63, ../sass/screen.scss */
.container-head .title h1 {
  color: #9fd900;
  text-align: center;
  padding-top: 0px;
}
/* line 68, ../sass/screen.scss */
.container-head .subtitle {
  text-align: center;
  padding-top: 3px;
}
.container-head .subtitle h3 {
  color: #000000;
}
/* line 72, ../sass/screen.scss */
.container-head .subtitle h4 {
  color: #000000;  
}
/* line 77, ../sass/screen.scss */
.container-head .box-ribbon {
  position: absolute;
  left: 50%;
  top: 100%;
  -ms-transform: translate(-50%, -25px);
  -webkit-transform: translate(-50%, -25px);
  transform: translate(-50%, -25px);
}
/* line 83, ../sass/screen.scss */
.container-head .box-ribbon .box-ribbon-img {
  position: relative;
}
/* line 86, ../sass/screen.scss */
.container-head .box-ribbon .box-ribbon-img img {
  width: 300px;
}
/* line 90, ../sass/screen.scss */
.container-head .box-ribbon .box-ribbon-img .title-period {
  position: absolute;
  left: 13px;
  top: 50%;
  -ms-transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  color: #636365;
}
/* line 98, ../sass/screen.scss */
.container-head .box-ribbon .box-ribbon-img .desc-period {
  position: absolute;
  right: 13px;
  top: 50%;
  -ms-transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  color: #636365;
}

/* line 109, ../sass/screen.scss */
.box-tnc {
  padding-top: 30px;
  width: 96%;
  margin-left: auto;
  margin-right: auto;
}
/* line 112, ../sass/screen.scss */
.box-tnc .tnc-accordion {
  border-top: 1px solid #e6e6e6;
  padding-left: 0;
  list-style: none;
}
/* line 117, ../sass/screen.scss */
.box-tnc .tnc-accordion > li {
  color: #636365;
}
/* line 120, ../sass/screen.scss */
.box-tnc .tnc-accordion > li > div:first-child {
  border-bottom: 1px solid #e6e6e6;
  padding: 20px 30px;
  font-size: 15px;
  position: relative;
  cursor: pointer;
}
/* line 127, ../sass/screen.scss */
.box-tnc .tnc-accordion > li > div:first-child > span {
  position: absolute;
  right: 30px;
  top: 50%;
  -ms-transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  font-size: 23px;
  color: #9fd900;
}
/* line 137, ../sass/screen.scss */
.box-tnc .tnc-accordion > li > .box-content {
  display: none;
}
/* line 140, ../sass/screen.scss */
.box-tnc .tnc-accordion > li > .box-content .faq {
  border-bottom: 1px solid #e6e6e6;
  padding: 17px 45px;
}
/* line 147, ../sass/screen.scss */
.box-tnc .tnc-accordion > li > .box-content .faq > li > ul > li {
  margin: 5px 0;
}
/* line 154, ../sass/screen.scss */
.box-tnc .tnc-accordion > li > .box-content .box-sales-img {
  padding-top: 50px;
  padding-bottom: 50px;
  padding-left: 25px;
  padding-right: 25px;
}
/* line 159, ../sass/screen.scss */
.box-tnc .tnc-accordion > li > .box-content .box-sales-img > .row > div {
  text-align: center;
}
/* line 162, ../sass/screen.scss */
.box-tnc .tnc-accordion > li > .box-content .box-sales-img > .row > div .box-circle {
  border: 3px solid #9fd900;
  display: inline-block;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  position: relative;
  margin-top: 30px;
}
/* line 171, ../sass/screen.scss */
.box-tnc .tnc-accordion > li > .box-content .box-sales-img > .row > div .box-circle > span {
  position: absolute;
  top: 50%;
  left: 50%;
  color: #9fd900;
  -ms-transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}
/* line 180, ../sass/screen.scss */
.box-tnc .tnc-accordion > li > .box-content .box-sales-img > .row > div .sales-name {
  font-size: 14px;
  position: relative;
  margin-top: 30px;
  padding-bottom: 10px;
}
/* line 186, ../sass/screen.scss */
.box-tnc .tnc-accordion > li > .box-content .box-sales-img > .row > div .sales-name > div {
  content: "";
  background-color: #9fd900;
  position: absolute;
  left: 50%;
  top: 100%;
  -ms-transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
  width: 50px;
  height: 2px;
}
/* line 199, ../sass/screen.scss */
.box-tnc .tnc-accordion > li > .box-content .box-sales-img > .row > div:nth-child(n+4) {
  margin-top: 50px;
}

/* line 209, ../sass/screen.scss */
.box-sitemap {
  background-color: #eceff1;
  padding-top: 30px;
  padding-bottom: 30px;
  margin-top: 80px;
}
/* line 215, ../sass/screen.scss */
.box-sitemap .title {
  color: #000000;
  text-align: center;
  font-size: 18px;
}
/* line 221, ../sass/screen.scss */
.box-sitemap .box-google-play {
  text-align: center;
  margin-top: 30px;
}
/* line 226, ../sass/screen.scss */
.box-sitemap .box-google-play > a img {
  width: 125px;
}
/* line 232, ../sass/screen.scss */
.box-sitemap .box-social-media {
  margin-top: 50px;
  width: 40%;
  margin-left: auto;
  margin-right: auto;
}
/* line 238, ../sass/screen.scss */
.box-sitemap .box-social-media > div {
  text-align: center;
  word-wrap: break-word;
}
/* line 242, ../sass/screen.scss */
.box-sitemap .box-social-media > div > a > img {
  width: 40px;
}
/* line 249, ../sass/screen.scss */
.box-sitemap .box-customer-service {
  background-color: #212121;
  color: #ffffff;
  padding: 20px 30px;
  margin-top: 30px;
  display: -moz-box;
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: -moz-flex;
  display: flex;
  align-items: center;
  -webkit-box-align: center;
  justify-content: flex-start;
  -webkit-box-pack: start;
}
/* line 256, ../sass/screen.scss */
.box-sitemap .box-customer-service > span {
  font-size: 20px;
  margin-left: 5px;
}
/* line 262, ../sass/screen.scss */
.box-sitemap .copyright {
  text-align: center;
  color: #000000;
  margin-top: 30px;
}

.box-5{
  width: 225px;
  border-radius: 4px;
  background-color: #f2f2f2;
  border: solid thin #cccccc;
  font-size: 13px;
  position: absolute;
  left: 50%;
  top: 100%;
  -ms-transform: translate(-50%, -25px);
  -webkit-transform: translate(-50%, -25px);
  transform: translate(-50%, -25px);
}

.table-promo {
    text-align: center;
    margin-left: auto;
    margin-right: auto;
    color: #333333;
    width: 100%;
    position: relative;
    padding-top: 25px;
    padding-bottom: 15px;
    width: 96%;

}

.table-promo >table{
  margin-left: auto;
  margin-right: auto;
  width: 90%;

}

.faq >li{
  margin-top: 19px;
}

.box-periode{
  background-color: #f2f2f2;
  position: absolute;
  left: 50%;
  top: 100%;
  -ms-transform: translate(-50%, -25px);
  -webkit-transform: translate(-50%, -25px);
  transform: translate(-50%, -25px);
  padding: 5px 25px;
  text-align: center;
  border-radius: 4px;
  border: solid thin #cccccc;
  width: 70%;
}

.box-periode div:first-child{
  font-weight: bold;
}

.left-img{
  padding-top: 15px;
  padding-bottom: 15px;
}

.left-img > a{
  display: block;
}

.left-img > a > img{
  margin-left: auto;
  margin-right: auto;
  width: 100%;
}

.right-info{
  padding-top: 15px;
  padding-bottom: 15px;
}

.right-info > ol{
  padding-left: 15px;
}

.right-info > ol > li{
  margin-top: px;
}

.right-info > ol > li:first-child{
  margin-top: 0;
}

.box-content > ul{
  /*border-bottom: 1px solid #e6e6e6;*/
  padding-top: 35px;
  padding-bottom: 20px;
  padding-left: 5px;
  padding-right: 15px;
 
}

.container > ol > li{
  /*border-bottom: 1px solid #e6e6e6;*/
  padding-left: 5px;

}

.box-content > ul > li{
  display: -moz-box;
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: -moz-flex;
  display: flex;
  align-items: center;
  -webkit-box-align: center;
  justify-content: flex-start;
  -webkit-box-pack: start;
  margin-top: 15px;
}

.box-content > ul > li:first-child{
  margin-top: 0;
}

.box-content > ul > li > img{
  width: 50px;
  height: 50px;
}

.box-content > ul > li > p{
  margin-bottom: 0;
  margin-left: 25px;
  display: -moz-box;
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: -moz-flex;
  display: flex;
  align-items: flex-start;
  -webkit-box-align: start;
  justify-content: flex-start;
  -webkit-box-pack: start;
}

.box-content > ul > p{ 
  padding-top: 20px;
  padding-bottom: 0px;
  padding-left: 5px;
  padding-right: 15px;
  margin-top: 5px;
  margin-bottom: 0px;
}

.box-content .container > ol > li > ul{ 
  padding-top: 0px;
  padding-bottom: 0px;
  padding-left: 13px;
  padding-right: 15px;
  margin-top: 5px;
  margin-bottom: 0px;
}

.box-content .container > ol > li > ul> li > ul{ 
  padding-top: 0px;
  padding-bottom: 0px;
  padding-left: 13px;
  padding-right: 15px;
  margin-top: 5px;
  margin-bottom: 0px;    
}

.container-fluid{
  padding-left: 0;
  padding-right: 0;
}

.range-width-screen{
  padding-left: 0;
  padding-right: 0;
}

.box-child > li > div > span{
  color: #40c4ff !important;
}

.box-content .box-tnc{
  padding-top: 0;
}

/*.box-child > li > .box-trigger{
  border-top: 0 !important;
  border-bottom: 0 !important;
}*/
/*.box-content .box-tnc .tnc-accordion > li > div:first-child*/

@media (max-width: 1200px) {
  /* line 272, ../sass/screen.scss */
  .container-fluid > .range-width-screen {
    padding-left: 0;
    padding-right: 0;
  }

  /* line 283, ../sass/screen.scss */
  .container-head .box-logo img {
    width: 170px;
  }
}
@media (max-width: 768px) {
  /* line 296, ../sass/screen.scss */
  .container-fluid {
    padding-left: 0;
    padding-right: 0;
  }

  /* line 47, ../sass/screen.scss */
  .container-head {
    background-color: #ffffff;
    position: relative;
    padding: 0px 15px 0px 15px;
  }

  .box-tnc {
      padding-top: 5px;
  }

  /* line 303, ../sass/screen.scss */
  .container-head .title h2 {
    font-size: 22px;
  }
  .container-head .subtitle h3 {
    font-size: 16px;
  }
  /* line 309, ../sass/screen.scss */
  .container-head .subtitle h4 {
    font-size: 14px;
  }

  /* line 318, ../sass/screen.scss */
  .box-tnc .tnc-accordion > li > div:first-child {
    padding: 15px 30px;
  }
  /* line 321, ../sass/screen.scss */
  .box-tnc .tnc-accordion > li > div:first-child > span {
    font-size: 20px;
  }
  /* line 329, ../sass/screen.scss */
  .box-tnc .tnc-accordion > .box-content .faq {
    padding: 20px 40px;
  }
  /* line 336, ../sass/screen.scss */
  .box-tnc .tnc-accordion > .box-content .box-sales-img > .row > div .box-circle {
    margin-top: 20px;
  }
  /* line 340, ../sass/screen.scss */
  .box-tnc .tnc-accordion > .box-content .box-sales-img > .row > div .sales-name {
    margin-top: 15px;
  }

  .box-tnc {
      width: 100%;
  }
}
/* line 352, ../sass/screen.scss */
.box-tnc .tnc-accordion > li > .box-content .box-sales-img > .row > div:nth-child(n+4) {
  margin-top: 20px;
}

.box-tnc .tnc-accordion > li > .box-content .box-sales-img > .row > div:nth-child(n+3) {
  margin-top: 40px;
}

/* line 356, ../sass/screen.scss */
.box-sitemap {
  margin-top: 25px;
  padding-top: 25px;
  padding-bottom: 25px;
}
/* line 361, ../sass/screen.scss */
.box-sitemap .box-google-play {
  margin-top: 25px;
}
/* line 365, ../sass/screen.scss */
.box-sitemap .box-google-play > a img {
  width: 110px;
}
/* line 371, ../sass/screen.scss */
.box-sitemap .box-social-media {
  margin-top: 35px;
  width: 100%;
}
/* line 376, ../sass/screen.scss */
.box-sitemap .box-customer-service {
  padding: 15px 35px;
}
/* line 379, ../sass/screen.scss */
.box-sitemap .box-customer-service > span {
  font-size: 18px;
}
/* line 384, ../sass/screen.scss */
.box-sitemap .copyright {
  margin-top: 20px;
}

.container-head .box-logo img {
    width: 150px;
}

.box-tnc .tnc-accordion > li > .box-content .box-sales-img > .row > div .box-circle {
    border: 3px solid #9fd900;
    display: inline-block;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    position: relative;
    margin-top: 15px;
}

.box-tnc .tnc-accordion > li > .box-content .box-sales-img > .row > div .sales-name {
    font-size: 14px;
    position: relative;
    margin-top: 10px;
    padding-bottom: 10px;
}

.box-sales-img img{
  width: 40px;
}

.left-img{
  padding-bottom: 0px;
}

}

@media (max-width: 481px) {
  /* line 393, ../sass/screen.scss */
  .container-head .box-ribbon .box-ribbon-img img {
    width: 272px;
  }
  /* line 397, ../sass/screen.scss */
  .container-head .box-ribbon .box-ribbon-img .title-period {
    left: 9px;
  }

  /* line 407, ../sass/screen.scss */
  .box-tnc .tnc-accordion > li > div:first-child {
    padding: 15px 20px;
  }
  /* line 412, ../sass/screen.scss */
  .box-tnc .tnc-accordion > li > .box-content .faq {
    padding: 20px 40px;
  }
  /* line 418, ../sass/screen.scss */
  .box-tnc .tnc-accordion > li > .box-content .box-sales-img {
    padding-top: 40px;
    padding-bottom: 40px;
  }
  /* line 423, ../sass/screen.scss */
  .box-tnc .tnc-accordion > li > .box-content .box-sales-img > .row > div .box-circle {
    margin-top: 15px;
    width: 40px;
    height: 40px;
  }
  /* line 429, ../sass/screen.scss */
  .box-tnc .tnc-accordion > li > .box-content .box-sales-img > .row > div .sales-name {
    margin-top: 15px;
  }
  /* line 434, ../sass/screen.scss */
  .box-tnc .tnc-accordion > li > .box-content .box-sales-img > .row > div > div > img {
    width: 85px;
  }
}
/* line 448, ../sass/screen.scss */
.box-sitemap .title {
  font-size: 16px;
}
/* line 452, ../sass/screen.scss */
.box-sitemap .box-customer-service {
  font-size: 13px;
}
/* line 455, ../sass/screen.scss */
.box-sitemap .box-customer-service > span {
  font-size: 16px;
}

.box-sales-img img{
  width: 32px;
}



}
 
table {
  color: #666;
  text-shadow: 1px 1px 0px #fff;
  background:#33B4E4;
  border: #ccc 1px solid;
  width: %;
  position: relative;
}
 
table th {
  padding: 15px 35px;
  border-left:1px solid #e0e0e0;
  border-bottom: 1px solid #e0e0e0;
  background: #33B4E4;
  font-weight:bold;
  color:#fff;
}
 
table th:first-child{  
  border-left:none;  
}
 
table tr {
  text-align: center;
  padding-left: 10px;
}
 
table td:first-child {
  text-align: left;
  padding-left: 7px;
  border-left: 0;
}
 
table td {
  padding: 5px 5px;
  border-top: 1px solid #ffffff;
  border-bottom: 1px solid #e0e0e0;
  border-left: 1px solid #e0e0e0;
  background: #fafafa;
  background: -webkit-gradient(linear, left top, left bottom, from(#fbfbfb), to(#fafafa));
  background: -moz-linear-gradient(top, #fbfbfb, #fafafa);
}
 
table tr:last-child td {
  border-bottom: 0;
}
 
table tr:last-child td:first-child {
  -moz-border-radius-bottomleft: 3px;
  -webkit-border-bottom-left-radius: 3px;
  border-bottom-left-radius: 3px;
}
 
table tr:last-child td:last-child {
  -moz-border-radius-bottomright: 3px;
  -webkit-border-bottom-right-radius: 3px;
  border-bottom-right-radius: 3px;
}
 
table tr:hover td {
  background: #f2f2f2;
  background: -webkit-gradient(linear, left top, left bottom, from(#f2f2f2), to(#f0f0f0));
  background: -moz-linear-gradient(top, #f2f2f2, #f0f0f0);
}

@media (min-width:700px){
  table th{
        padding:10px; 
        font-weight:bold; 
        background:#33B4E4; 
        color:#fff; 
        text-transform:uppercase;
    }
    table td{
        padding:10px 5px;
    }