@charset "UTF-8";
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline; }

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
  display: block; }

ol, ul {
  list-style: none; }

blockquote, q {
  quotes: none; }

blockquote:before, blockquote:after, q:before, q:after {
  content: '';
  content: none; }

table {
  border-collapse: collapse;
  border-spacing: 0; }

* {
  -webkit-box-sizing: border-box;
  box-sizing: border-box; }

@font-face {
  font-family: "Noto Sans Thai";
  font-style: normal;
  font-weight: 400;
  src: url("https://static.pkn.sh/fonts/NotoSansThai/NotoSansThai-Regular.woff2") format("woff2"), url("https://static.pkn.sh/fonts/NotoSansThai/NotoSansThai-Regular.woff") format("woff"); }
@font-face {
  font-family: "Noto Sans Thai";
  font-style: normal;
  font-weight: 700;
  src: url("https://static.pkn.sh/fonts/NotoSansThai/NotoSansThai-Bold.woff2") format("woff2"), url("https://static.pkn.sh/fonts/NotoSansThai/NotoSansThai-Bold.woff") format("woff"); }
/* Stylesheet */
html {
  width: 100%;
  height: auto;
  font-size: 62.5%; }

body {
  width: 100%;
  font-family: 'Noto Sans Thai',  Helvetica, Arial, "sans-serif";
  font-size: 1.5rem;
  line-height: 2.5rem;
  font-weight: normal;
  color: #000;
  -webkit-font-smoothing: subpixel-antialiased;
  -moz-osx-font-smoothing: unset;
  -webkit-text-size-adjust: 100%;
  position: relative; }

img {
  display: block;
  max-width: 100%;
  height: auto;
  vertical-align: top;
  -webkit-transition: opacity .35s;
  -o-transition: opacity .35s;
  transition: opacity .35s;
  outline: none; }

div {
  margin: 0;
  padding: 0; }

h1, h2, h3, h4, h5, h6 {
  -webkit-font-smoothing: antialiased;
  font-weight: normal; }

h1, h2, h3, h4, h5, h6, p, ul, ol, li {
  margin: 0;
  padding: 0;
  list-style: none; }

a, a i {
  text-decoration: none;
  outline: none;
  color: #000;
  -webkit-transition: color .35s, opacity .35s;
  -o-transition: color .35s, opacity .35s;
  transition: color .35s, opacity .35s; }

a img {
  display: block;
  outline: none; }

a:hover img {
  opacity: 1 !important; }

a:focus, a:active, input, textarea {
  outline: none; }

a:hover, a:hover img, a:hover .btn {
  opacity: 0.8; }

.link-sp {
  pointer-events: none; }

.link-underline {
  text-decoration: underline; }

.link-arrow {
  position: relative;
  line-height: 2.5rem;
  padding-bottom: 5px;
  color: #059fbb;
  border-bottom: 1px solid #059fbb;
  letter-spacing: 1px; }

.link-arrow::before {
  content: '→'; }

.anchor {
  display: block;
  position: relative;
  top: -50px;
  visibility: hidden; }

.link-red {
  color: #9B0001;
  text-decoration: underline; }

.input-custom, input[type=text] {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none; }

.lang.active {
  color: #9B0001 !important; }

/* Chrome、Safari */
.input-custom, input[type=number]::-webkit-outer-spin-button,
.input-custom, input[type=number]::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0; }

/* Firefox、IE */
.input-custom, input[type="number"] {
  -moz-appearance: textfield; }

/* Chrome、Safari */
.input-custom, input[type=text] {
  -webkit-appearance: none;
  margin: 0; }

/* Firefox、IE */
.input-custom, input[type="text"] {
  -moz-appearance: textfield; }

textarea, input {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  outline: none !important;
  border-radius: 0;
  box-sizing: border-box; }

/* Header */
header {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 10;
  width: 100%;
  color: #fff;
  background-color: #000000;
  -webkit-box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.5);
  -moz-box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.5);
  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.5); }
  header .header {
    height: 74px;
    display: flex;
    justify-content: space-between;
    align-items: center; }
    @media only screen and (max-width: 1080px) {
      header .header {
        width: 100%;
        padding-left: 4%; } }
    header .header .header-right {
      display: flex;
      height: 100%; }
      header .header .header-right .header-lang {
        height: 100%;
        padding-right: 40px;
        font-size: 1.8rem;
        font-weight: bold; }
        @media only screen and (max-width: 830px) {
          header .header .header-right .header-lang {
            padding-right: 20px; } }
        @media only screen and (max-width: 750px) {
          header .header .header-right .header-lang {
            font-size: 1.6rem; } }
        header .header .header-right .header-lang ul {
          display: flex;
          align-items: center;
          height: 100%; }
          header .header .header-right .header-lang ul li a {
            color: #fff;
            font-family: Helvetica, Arial, "sans-serif"; }
          header .header .header-right .header-lang ul li.slash {
            margin: 0 5px; }
            @media only screen and (max-width: 1080px) {
              header .header .header-right .header-lang ul li.slash {
                margin: 0 10px; } }
      header .header .header-right .header-btn ul {
        display: flex;
        height: 100%; }
        header .header .header-right .header-btn ul li a {
          height: 100%; }
          @media only screen and (max-width: 1080px) {
            header .header .header-right .header-btn ul li a {
              padding: 0 20px; } }
          @media only screen and (max-width: 1080px) {
            header .header .header-right .header-btn ul li a .icon {
              margin-right: 0; } }
          @media only screen and (max-width: 1080px) {
            header .header .header-right .header-btn ul li a p {
              display: none; } }
        header .header .header-right .header-btn ul li + li {
          margin-left: 1px; }

.header-burger {
  display: none; }
  @media only screen and (max-width: 1080px) {
    .header-burger {
      display: block; } }

.nav-icon {
  display: block;
  width: 45px;
  height: 45px;
  position: relative;
  -webkit-transform: rotate(0deg);
  -ms-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: .35s;
  -o-transition: .35s;
  transition: .35s;
  cursor: pointer;
  opacity: 1;
  background-color: #000; }

.nav-icon:focus, .nav-icon:active, .nav-icon:visited {
  opacity: 1; }

.nav-icon span {
  display: block;
  position: absolute;
  width: 27px;
  height: 3px;
  background: #fff !important;
  border-radius: 0;
  opacity: 1;
  left: 0;
  right: 0;
  margin-left: auto;
  margin-right: auto;
  z-index: 9;
  -webkit-transform: rotate(0deg);
  -ms-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: .35s ease-in-out;
  -o-transition: .35s ease-in-out;
  transition: .35s ease-in-out; }

.nav-icon span:nth-child(1) {
  top: 10px; }

.nav-icon span:nth-child(2), .nav-icon span:nth-child(3) {
  top: 20px; }

.nav-icon span:nth-child(4) {
  top: 30px; }

.nav-icon.open span:nth-child(1) {
  top: 10px;
  width: 0%;
  left: 0;
  right: 0; }

.nav-icon.open span:nth-child(2) {
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg); }

.nav-icon.open span:nth-child(3) {
  -webkit-transform: rotate(-45deg);
  -ms-transform: rotate(-45deg);
  transform: rotate(-45deg); }

.nav-icon.open span:nth-child(4) {
  top: 30px;
  width: 0%;
  left: 0;
  right: 0; }

.txt-title {
  padding: 120px 0;
  text-align: center; }
  @media only screen and (max-width: 750px) {
    .txt-title {
      padding: 60px 0; } }
  .txt-title h1 {
    font-size: 5.4rem;
    font-weight: bold; }
    @media only screen and (max-width: 750px) {
      .txt-title h1 {
        font-size: 3.4rem; } }

.box-bg-white {
  background: #fff; }

.bg-grey-ed {
  background: #EDEDED; }

/* checkbox */
.container-checkbox {
  display: block;
  position: relative;
  padding-left: 30px;
  margin-bottom: 15px;
  color: #000;
  cursor: pointer;
  letter-spacing: 0px;
  padding-top: 3px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  font-size: 1.8rem;
  /* Create a custom checkbox */
  /* On mouse-over, add a grey background color */
  /* When the checkbox is checked, add a blue background */
  /* Create the checkmark/indicator (hidden when not checked) */
  /* On mouse-over, add a grey background color */
  /* When the checkbox is checked, add a blue background */
  /* Create the checkmark/indicator (hidden when not checked) */
  /* Show the checkmark when checked */
  /* Style the checkmark/indicator */ }
  @media only screen and (max-width: 750px) {
    .container-checkbox {
      font-size: 1.6rem; } }
  .container-checkbox .checkbox-txt {
    color: #000;
    display: inline;
    margin-right: 30px; }
  .container-checkbox input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
    height: 0;
    width: 0; }
  .container-checkbox .checkmark {
    position: absolute;
    top: 0;
    left: 0;
    height: 20px;
    width: 20px;
    border: 1px solid #9B0001; }
  .container-checkbox .checkmark-checkbox {
    position: absolute;
    top: 3px;
    left: 0;
    height: 20px;
    width: 20px;
    border: 1px solid #9B0001; }
    @media only screen and (max-width: 750px) {
      .container-checkbox .checkmark-checkbox {
        top: 4px; } }
  .container-checkbox:hover input ~ .checkmark-checkbox, .container-checkbox:hover input ~ .checkmark {
    background-color: transparent;
    transition: 0.3s; }
  .container-checkbox input:checked ~ .checkmark-checkbox,
  .container-checkbox input:checked ~ .checkmark {
    background-color: #9B0001; }
  .container-checkbox .checkmark-checkbox:after,
  .container-checkbox .checkmark:after {
    content: "";
    position: absolute;
    display: none; }
  .container-checkbox:hover input ~ .checkmark-checkbox, .container-checkbox:hover input ~ .checkmark {
    background-color: transparent;
    transition: 0.3s; }
  .container-checkbox input:checked ~ .checkmark-checkbox,
  .container-checkbox input:checked ~ .checkmark {
    background-color: #9B0001; }
  .container-checkbox .checkmark-checkbox:after,
  .container-checkbox .checkmark:after {
    content: "";
    position: absolute;
    display: none; }
  .container-checkbox input:checked ~ .checkmark-checkbox:after,
  .container-checkbox input:checked ~ .checkmark:after {
    display: block; }
  .container-checkbox .checkmark-checkbox:after {
    left: 0px;
    top: 0px;
    width: 12px;
    height: 12px;
    border: solid white;
    border-width: 3px;
    -webkit-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg); }
  .container-checkbox .checkmark:after {
    left: 0px;
    top: 0px;
    width: 14px;
    height: 14px;
    border: solid white;
    border-radius: 3px;
    border-width: 3px;
    -webkit-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg); }

/* Container */
main {
  overflow: hidden;
  padding-top: 74px;
  display: block; }

.content-1024 {
  width: 94%;
  max-width: 1024px;
  margin-left: auto;
  margin-right: auto; }
  @media only screen and (max-width: 1080px) {
    .content-1024 {
      width: 92%; } }

.pad60 {
  padding-top: 60px;
  padding-bottom: 60px; }

.pad80 {
  padding-top: 80px;
  padding-bottom: 80px; }

.pad100 {
  padding-top: 100px;
  padding-bottom: 100px; }
  @media only screen and (max-width: 830px) {
    .pad100 {
      padding-top: 80px;
      padding-bottom: 80px; } }

.pb100 {
  padding-bottom: 100px; }
  @media only screen and (max-width: 830px) {
    .pb100 {
      padding-bottom: 80px; } }

.pb200 {
  padding-bottom: 200px; }
  @media only screen and (max-width: 830px) {
    .pb200 {
      padding-bottom: 80px; } }

.btn {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 50px;
  font-weight: bold;
  padding: 0 20px; }
  @media only screen and (max-width: 830px) {
    .btn {
      padding: 0 15px;
      font-size: 1.3rem !important; } }

.btn-small {
  font-size: 1.3rem;
  line-height: 2.3rem;
  font-weight: bold;
  height: 40px; }

.btn-big {
  font-size: 1.8rem;
  line-height: 2.8rem;
  height: 80px; }
  @media only screen and (max-width: 750px) {
    .btn-big {
      font-size: 1.5rem;
      line-height: 2.5rem;
      height: 50px; } }

.btn-red {
  color: #fff;
  background-color: #9B0001; }

.btn-border {
  border: 2px solid #000; }

.btn-icon-left div.icon {
  margin-right: 12px; }

.btn-icon-right div.icon {
  margin-left: 12px; }

.btn-arrow-down {
  background-image: url("/php/lp/assets/images/commons/icon-arrow-down.svg");
  background-repeat: no-repeat;
  background-position: right 10px center;
  background-size: 10px; }

.txthead-box {
  margin-bottom: 30px; }
  .txthead-box .txthead {
    font-size: 5.4rem;
    line-height: 6.4rem;
    font-weight: bold; }
    @media only screen and (max-width: 830px) {
      .txthead-box .txthead {
        font-size: 4rem;
        line-height: 5rem; } }
    @media only screen and (max-width: 750px) {
      .txthead-box .txthead {
        font-size: 2.6rem;
        line-height: 3.6rem; } }
  .txthead-box .txthead.center {
    display: table;
    margin-left: auto;
    margin-right: auto; }

.color-white {
  color: #fff; }

.color-red {
  color: #9B0001; }

.bg-grey-light {
  background-color: #EDEDED; }

/* MV */
#mv .mv-top {
  padding-top: 60px;
  padding-bottom: 80px;
  background-image: url("/php/lp/assets/images/top/mv-top-bg-arrow.svg"), url("/php/lp/assets/images/top/mv-top-bg-img.jpg");
  background-repeat: no-repeat;
  background-position: top center, center;
  background-size: 1884px, cover;
  text-align: center; }
  @media only screen and (max-width: 750px) {
    #mv .mv-top {
      padding-top: 40px;
      padding-bottom: 40px; } }
  #mv .mv-top .mv-top-content h1 {
    font-size: 2.8rem;
    line-height: 3.4rem;
    font-weight: bold;
    color: #fff; }
    @media only screen and (max-width: 830px) {
      #mv .mv-top .mv-top-content h1 {
        font-size: 2rem;
        line-height: 2.6rem; } }
  #mv .mv-top .mv-top-content .mv-flex {
    margin-top: 35px;
    margin-bottom: 50px; }
    @media only screen and (max-width: 750px) {
      #mv .mv-top .mv-top-content .mv-flex {
        margin-bottom: 35px; } }
    #mv .mv-top .mv-top-content .mv-flex ul {
      display: flex;
      justify-content: space-between;
      align-items: flex-end; }
      @media only screen and (max-width: 750px) {
        #mv .mv-top .mv-top-content .mv-flex ul {
          align-items: center; } }
      #mv .mv-top .mv-top-content .mv-flex ul li h2 {
        display: flex;
        justify-content: center;
        align-items: center;
        height: 105px;
        font-size: 2rem;
        line-height: 2.4rem;
        font-weight: bold;
        color: #fff;
        background-color: #000; }
        @media only screen and (max-width: 750px) {
          #mv .mv-top .mv-top-content .mv-flex ul li h2 {
            font-size: 1.4rem;
            line-height: 2rem;
            padding: 5px 5px;
            height: 130px; } }
      #mv .mv-top .mv-top-content .mv-flex ul li .mv-item-box .mv-item-img {
        padding: 30px 30px 0 30px; }
        @media only screen and (max-width: 750px) {
          #mv .mv-top .mv-top-content .mv-flex ul li .mv-item-box .mv-item-img {
            padding: 10px; } }
        #mv .mv-top .mv-top-content .mv-flex ul li .mv-item-box .mv-item-img img {
          width: 100%;
          height: auto; }
        #mv .mv-top .mv-top-content .mv-flex ul li .mv-item-box .mv-item-img p {
          font-size: 1.3rem;
          line-height: 1.6rem;
          padding: 5px 0;
          height: 45px; }
          @media only screen and (max-width: 750px) {
            #mv .mv-top .mv-top-content .mv-flex ul li .mv-item-box .mv-item-img p {
              display: flex;
              justify-content: center;
              align-items: center;
              font-size: 1.2rem;
              height: 60px;
              padding-top: 10px; } }
      #mv .mv-top .mv-top-content .mv-flex ul li.mv-item {
        width: 41%;
        background-color: #fff; }
        @media only screen and (max-width: 750px) {
          #mv .mv-top .mv-top-content .mv-flex ul li.mv-item {
            width: 50%; } }
      #mv .mv-top .mv-top-content .mv-flex ul li.mv-seperator {
        margin-left: auto;
        margin-right: auto;
        margin-bottom: -20px !important; }
        @media only screen and (max-width: 750px) {
          #mv .mv-top .mv-top-content .mv-flex ul li.mv-seperator {
            width: 40px;
            max-width: 40px;
            padding-top: 60px !important;
            padding: 0 5px;
            margin-bottom: 0 !important; } }
  #mv .mv-top .mv-top-content h3 {
    display: table;
    margin-left: auto;
    margin-right: auto;
    padding: 12px 16px;
    font-size: 2.8rem;
    line-height: 3.4rem;
    font-weight: bold;
    color: #fff;
    background-color: #9B0001; }
    @media only screen and (max-width: 830px) {
      #mv .mv-top .mv-top-content h3 {
        font-size: 2.4rem;
        line-height: 3rem; } }
    @media only screen and (max-width: 750px) {
      #mv .mv-top .mv-top-content h3 {
        font-size: 1.8rem;
        line-height: 2.8rem; } }
  #mv .mv-top .mv-top-content h4 {
    display: table;
    margin-top: 20px;
    margin-left: auto;
    margin-right: auto;
    font-size: 3.2rem;
    line-height: 4rem;
    font-weight: bold;
    color: #fff; }
    @media only screen and (max-width: 830px) {
      #mv .mv-top .mv-top-content h4 {
        font-size: 2.4rem;
        line-height: 3.4rem; } }
    @media only screen and (max-width: 750px) {
      #mv .mv-top .mv-top-content h4 {
        font-size: 1.8rem;
        line-height: 2.8rem; } }
#mv .mv-btm {
  padding: 40px 0;
  background-color: #9B0001; }
  @media only screen and (max-width: 830px) {
    #mv .mv-btm {
      padding: 30px 0; } }
  @media only screen and (max-width: 750px) {
    #mv .mv-btm {
      padding: 20px 0; } }
  #mv .mv-btm .mv-btm-content p {
    font-size: 3.2rem;
    line-height: 4rem;
    font-weight: bold;
    color: #fff; }
    @media only screen and (max-width: 830px) {
      #mv .mv-btm .mv-btm-content p {
        font-size: 2.4rem;
        line-height: 3.4rem; } }
    @media only screen and (max-width: 750px) {
      #mv .mv-btm .mv-btm-content p {
        font-size: 1.8rem;
        line-height: 2.8rem; } }

/* Intro */
#intro .intro .intro-content {
  position: relative;
  height: 720px; }
  @media only screen and (max-width: 830px) {
    #intro .intro .intro-content {
      height: auto; } }
  #intro .intro .intro-content .intro-img {
    display: table;
    margin: 0 auto;
    padding-top: 110px;
    position: relative;
    z-index: 7; }
    @media only screen and (max-width: 830px) {
      #intro .intro .intro-content .intro-img {
        position: static;
        padding-top: 0;
        padding: 230px 0 200px 0; } }
    @media only screen and (max-width: 750px) {
      #intro .intro .intro-content .intro-img {
        width: 70%;
        padding: 300px 0 200px 0; } }
  #intro .intro .intro-content .intro-item {
    position: absolute;
    z-index: 6;
    width: 100%; }
    @media only screen and (max-width: 830px) {
      #intro .intro .intro-content .intro-item {
        width: 240px !important;
        max-width: 240px !important; } }
    @media only screen and (max-width: 750px) {
      #intro .intro .intro-content .intro-item {
        width: 200px !important;
        max-width: 200px !important; } }
    #intro .intro .intro-content .intro-item .intro-box {
      position: relative; }
      #intro .intro .intro-content .intro-item .intro-box h2 {
        font-size: 5.4rem;
        line-height: 6.4rem;
        font-weight: bold;
        margin-bottom: 15px; }
        @media only screen and (max-width: 830px) {
          #intro .intro .intro-content .intro-item .intro-box h2 {
            font-size: 3rem;
            line-height: 3rem;
            margin-top: 15px;
            margin-bottom: 10px; } }
        @media only screen and (max-width: 750px) {
          #intro .intro .intro-content .intro-item .intro-box h2 {
            font-size: 2rem;
            line-height: 2.4rem;
            margin-top: 10px;
            margin-bottom: 5px; } }
      @media only screen and (max-width: 830px) {
        #intro .intro .intro-content .intro-item .intro-box p {
          line-height: 2rem; } }
      @media only screen and (max-width: 750px) {
        #intro .intro .intro-content .intro-item .intro-box p {
          font-size: 1.3rem;
          line-height: 1.8rem; } }
      #intro .intro .intro-content .intro-item .intro-box .intro-btn {
        width: 100%;
        max-width: 180px;
        margin-top: 15px; }
        @media only screen and (max-width: 830px) {
          #intro .intro .intro-content .intro-item .intro-box .intro-btn {
            max-width: 140px; } }
        @media only screen and (max-width: 750px) {
          #intro .intro .intro-content .intro-item .intro-box .intro-btn {
            max-width: 100px; } }
  #intro .intro .intro-content .intro-startup {
    max-width: 235px;
    top: 0;
    right: 62px; }
    @media only screen and (max-width: 830px) {
      #intro .intro .intro-content .intro-startup {
        top: 50px;
        right: 0; } }
    @media only screen and (max-width: 750px) {
      #intro .intro .intro-content .intro-startup {
        width: 160px !important;
        max-width: 160px !important;
        top: 0; } }
    #intro .intro .intro-content .intro-startup .intro-box .intro-icon {
      position: absolute;
      top: 0;
      left: -118px;
      z-index: 7; }
      @media only screen and (max-width: 750px) {
        #intro .intro .intro-content .intro-startup .intro-box .intro-icon {
          position: static; } }
      @media only screen and (max-width: 830px) {
        #intro .intro .intro-content .intro-startup .intro-box .intro-icon img {
          width: 98px;
          height: 120px; } }
      @media only screen and (max-width: 750px) {
        #intro .intro .intro-content .intro-startup .intro-box .intro-icon img {
          width: 56px;
          height: 100px; } }
    #intro .intro .intro-content .intro-startup .intro-box h2 {
      color: #9B0001; }
  #intro .intro .intro-content .intro-operation {
    max-width: 420px;
    bottom: 0;
    right: 72px; }
    @media only screen and (max-width: 830px) {
      #intro .intro .intro-content .intro-operation {
        left: 0;
        right: 0;
        margin-left: auto;
        margin-right: auto; } }
    #intro .intro .intro-content .intro-operation .intro-box .intro-icon {
      position: absolute;
      top: 0;
      left: -91px;
      z-index: 7; }
      @media only screen and (max-width: 750px) {
        #intro .intro .intro-content .intro-operation .intro-box .intro-icon {
          left: -60px; } }
      @media only screen and (max-width: 830px) {
        #intro .intro .intro-content .intro-operation .intro-box .intro-icon img {
          width: 71px;
          height: 120px; } }
      @media only screen and (max-width: 750px) {
        #intro .intro .intro-content .intro-operation .intro-box .intro-icon img {
          width: 41px;
          height: 100px; } }
    #intro .intro .intro-content .intro-operation .intro-box h2 {
      color: #961182; }
  #intro .intro .intro-content .intro-turn {
    max-width: 330px;
    left: 0;
    top: 58px;
    z-index: 8; }
    @media only screen and (max-width: 830px) {
      #intro .intro .intro-content .intro-turn {
        top: 0; } }
    @media only screen and (max-width: 750px) {
      #intro .intro .intro-content .intro-turn {
        width: 160px !important;
        max-width: 160px !important; } }
    @media only screen and (max-width: 830px) {
      #intro .intro .intro-content .intro-turn .intro-box .intro-icon img {
        width: 120px;
        height: 100px; } }
    @media only screen and (max-width: 750px) {
      #intro .intro .intro-content .intro-turn .intro-box .intro-icon img {
        width: 74px;
        height: 90px; } }
    #intro .intro .intro-content .intro-turn .intro-box h2 {
      color: #78429A; }

/* Start Up */
#solution {
  background-color: #EDEDED;
  background-image: url("/php/lp/assets/images/top/solution-bg-startup.png"), url("/php/lp/assets/images/top/solution-bg-operation.png"), url("/php/lp/assets/images/top/solution-bg-turn.png"), url("/php/lp/assets/images/top/solution-bg-end.png");
  background-repeat: no-repeat;
  background-position: top center, top 1400px center, top 5300px center, bottom center;
  background-size: 1920px; }
  @media only screen and (max-width: 830px) {
    #solution {
      background-position: top center, top 1300px center, top 5300px center, bottom center; } }
  @media only screen and (max-width: 750px) {
    #solution {
      background-position: top center, top 2400px center, top 8000px center, bottom center; } }

.solution-content {
  padding-left: 160px;
  position: relative; }
  @media only screen and (max-width: 830px) {
    .solution-content {
      padding-left: 0; } }
  .solution-content .solution-icon {
    position: absolute;
    z-index: 7; }
    @media only screen and (max-width: 830px) {
      .solution-content .solution-icon {
        display: none; } }
  .solution-content .startup-icon {
    top: -160px;
    left: 0; }
  .solution-content .operation-icon {
    top: -160px;
    left: 17px; }
  .solution-content .turn-icon {
    top: -110px;
    left: -50px; }
  .solution-content .txthead-box {
    height: 168px;
    margin-bottom: 0;
    padding-left: 70px; }
    @media only screen and (max-width: 830px) {
      .solution-content .txthead-box {
        height: auto;
        margin-bottom: 50px;
        padding-left: 0; } }
  .solution-content .solution-row {
    position: relative;
    z-index: 7;
    background-color: #fff; }
    .solution-content .solution-row .solution-box {
      position: relative; }
      .solution-content .solution-row .solution-box .solution-issues {
        display: inline-block;
        min-height: 148px;
        padding-right: 168px; }
        @media only screen and (max-width: 750px) {
          .solution-content .solution-row .solution-box .solution-issues {
            padding-right: 140px; } }
        .solution-content .solution-row .solution-box .solution-issues h3 {
          min-width: 260px;
          display: table;
          font-size: 1.8rem;
          line-height: 2.8rem;
          font-weight: bold;
          color: #fff;
          background-color: #000;
          text-align: center;
          margin-top: -20px;
          padding: 6px 10px; }
          @media only screen and (max-width: 750px) {
            .solution-content .solution-row .solution-box .solution-issues h3 {
              min-width: auto;
              font-size: 1.6rem;
              line-height: 2.6rem; } }
        .solution-content .solution-row .solution-box .solution-issues p {
          font-size: 2.4rem;
          line-height: 3.4rem;
          font-weight: bold;
          padding: 20px 20px 40px 20px; }
          @media only screen and (max-width: 830px) {
            .solution-content .solution-row .solution-box .solution-issues p {
              font-size: 2rem;
              line-height: 3rem; } }
        .solution-content .solution-row .solution-box .solution-issues .issues-img {
          position: absolute;
          right: 20px;
          bottom: 0;
          z-index: 7; }
      .solution-content .solution-row .solution-box .solution-ba {
        padding: 20px; }
        .solution-content .solution-row .solution-box .solution-ba .ba-topic {
          display: flex;
          margin-bottom: 20px; }
          .solution-content .solution-row .solution-box .solution-ba .ba-topic h3 {
            font-size: 4rem;
            line-height: 4rem;
            font-weight: bold; }
            @media only screen and (max-width: 830px) {
              .solution-content .solution-row .solution-box .solution-ba .ba-topic h3 {
                font-size: 3rem;
                line-height: 3rem; } }
            @media only screen and (max-width: 750px) {
              .solution-content .solution-row .solution-box .solution-ba .ba-topic h3 {
                font-size: 2.2rem;
                line-height: 2.8rem;
                padding-top: 4px; } }
            @media only screen and (max-width: 600px) {
              .solution-content .solution-row .solution-box .solution-ba .ba-topic h3 {
                min-width: max-content; } }
          .solution-content .solution-row .solution-box .solution-ba .ba-topic .ba-topic-tag {
            display: flex;
            flex-wrap: wrap; }
            @media only screen and (max-width: 600px) {
              .solution-content .solution-row .solution-box .solution-ba .ba-topic .ba-topic-tag {
                height: max-content; } }
            .solution-content .solution-row .solution-box .solution-ba .ba-topic .ba-topic-tag p {
              font-size: 1.3rem;
              line-height: 1.8rem;
              font-weight: bold;
              color: #fff;
              background-color: #9B0001;
              margin-left: 10px;
              padding: 10px; }
              @media only screen and (max-width: 750px) {
                .solution-content .solution-row .solution-box .solution-ba .ba-topic .ba-topic-tag p {
                  margin-top: 1px;
                  margin-bottom: 1px; } }
        .solution-content .solution-row .solution-box .solution-ba .ba-flex {
          display: flex; }
          @media only screen and (max-width: 750px) {
            .solution-content .solution-row .solution-box .solution-ba .ba-flex {
              display: block; } }
          .solution-content .solution-row .solution-box .solution-ba .ba-flex .ba-img {
            width: 100%;
            max-width: 280px; }
            @media only screen and (max-width: 750px) {
              .solution-content .solution-row .solution-box .solution-ba .ba-flex .ba-img {
                max-width: initial; } }
            .solution-content .solution-row .solution-box .solution-ba .ba-flex .ba-img img {
              width: 100%;
              height: auto; }
          .solution-content .solution-row .solution-box .solution-ba .ba-flex .ba-text {
            width: 100%;
            padding-left: 20px; }
            @media only screen and (max-width: 750px) {
              .solution-content .solution-row .solution-box .solution-ba .ba-flex .ba-text {
                margin-top: 20px;
                padding-left: 0; } }
            .solution-content .solution-row .solution-box .solution-ba .ba-flex .ba-text h4 {
              font-size: 1.8rem;
              line-height: 2.8rem;
              font-weight: bold;
              margin-bottom: 10px; }
              @media only screen and (max-width: 750px) {
                .solution-content .solution-row .solution-box .solution-ba .ba-flex .ba-text h4 {
                  font-size: 1.6rem;
                  line-height: 2.4rem; } }
        .solution-content .solution-row .solution-box .solution-ba .ba-block .ba-text {
          width: 100%;
          margin-top: 20px; }
          .solution-content .solution-row .solution-box .solution-ba .ba-block .ba-text h4 {
            font-size: 1.8rem;
            line-height: 2.8rem;
            font-weight: bold;
            margin-bottom: 10px; }
      .solution-content .solution-row .solution-box .solution-ba.before {
        position: relative; }
        @media only screen and (max-width: 750px) {
          .solution-content .solution-row .solution-box .solution-ba.before {
            margin-bottom: 40px; } }
      .solution-content .solution-row .solution-box .solution-ba.before::after {
        content: '';
        position: absolute;
        bottom: -27px;
        left: 0;
        right: 0;
        margin: auto;
        z-index: 7;
        width: 80px;
        height: 27px;
        background-image: url("/php/lp/assets/images/top/solution-before-arrow.svg");
        background-repeat: no-repeat;
        background-position: center bottom;
        background-size: 80px; }
      .solution-content .solution-row .solution-box .turn-topic {
        padding: 8px 10px;
        background-color: #000; }
        .solution-content .solution-row .solution-box .turn-topic h3 {
          font-size: 2.4rem;
          line-height: 3.4rem;
          font-weight: bold;
          color: #fff;
          text-align: center; }
          @media only screen and (max-width: 750px) {
            .solution-content .solution-row .solution-box .turn-topic h3 {
              font-size: 1.8rem;
              line-height: 3rem; } }
      .solution-content .solution-row .solution-box .turn-text {
        padding: 45px 20px; }
        @media only screen and (max-width: 750px) {
          .solution-content .solution-row .solution-box .turn-text {
            padding: 30px 20px; } }
        .solution-content .solution-row .solution-box .turn-text h4 {
          font-size: 2.8rem;
          line-height: 3.4rem;
          font-weight: bold;
          margin-bottom: 25px; }
          @media only screen and (max-width: 750px) {
            .solution-content .solution-row .solution-box .turn-text h4 {
              font-size: 2rem;
              line-height: 2.8rem;
              margin-bottom: 15px; } }
        .solution-content .solution-row .solution-box .turn-text .turn-img {
          margin-top: 30px; }
          @media only screen and (max-width: 750px) {
            .solution-content .solution-row .solution-box .turn-text .turn-img {
              margin-top: 20px; } }
        .solution-content .solution-row .solution-box .turn-text h5 {
          font-size: 2.4rem;
          line-height: 3.4rem;
          font-weight: bold;
          margin-top: 40px;
          margin-bottom: 15px; }
          @media only screen and (max-width: 750px) {
            .solution-content .solution-row .solution-box .turn-text h5 {
              margin-top: 30px; } }
        .solution-content .solution-row .solution-box .turn-text .turn-img-flex {
          display: flex;
          justify-content: space-between; }
          .solution-content .solution-row .solution-box .turn-text .turn-img-flex div {
            width: 49%; }
            .solution-content .solution-row .solution-box .turn-text .turn-img-flex div img {
              width: 100%;
              height: auto; }
        .solution-content .solution-row .solution-box .turn-text ul {
          margin-left: 20px;
          margin-top: 20px; }
          .solution-content .solution-row .solution-box .turn-text ul li {
            list-style: disc; }
  .solution-content .solution-row + .solution-row {
    margin-top: 30px; }
    @media only screen and (max-width: 750px) {
      .solution-content .solution-row + .solution-row {
        margin-top: 3%; } }
  .solution-content .solution-btn + .solution-row {
    margin-top: 100px; }
    @media only screen and (max-width: 750px) {
      .solution-content .solution-btn + .solution-row {
        margin-top: 80px; } }
  .solution-content .solution-btn {
    padding: 30px;
    text-align: center;
    color: #fff;
    background-color: #000; }
    @media only screen and (max-width: 750px) {
      .solution-content .solution-btn {
        padding: 20px; } }
    .solution-content .solution-btn p {
      font-size: 1.8rem;
      line-height: 2.8rem;
      font-weight: bold;
      margin-bottom: 30px; }
      @media only screen and (max-width: 750px) {
        .solution-content .solution-btn p {
          margin-bottom: 20px; } }
    .solution-content .solution-btn ul {
      display: flex;
      justify-content: space-between; }
      @media only screen and (max-width: 830px) {
        .solution-content .solution-btn ul {
          display: block; } }
      .solution-content .solution-btn ul li {
        width: 50%;
        margin: 0 10px; }
        @media only screen and (max-width: 830px) {
          .solution-content .solution-btn ul li {
            width: 100%;
            margin: 0; } }
      @media only screen and (max-width: 830px) {
        .solution-content .solution-btn ul li + li {
          margin-top: 5px; } }

@media only screen and (max-width: 830px) {
  #startup, #operation, #turn {
    padding-bottom: 0; } }

/* Azbil Group */
.azbil .azbil-content h3 {
  font-size: 2.4rem;
  line-height: 3.4rem;
  font-weight: bold;
  margin-bottom: 15px; }
  @media only screen and (max-width: 750px) {
    .azbil .azbil-content h3 {
      font-size: 2rem;
      line-height: 2.8rem; } }
.azbil .azbil-content .azbil-map {
  margin-top: 20px; }

/* Company */
.company .company-content {
  margin-top: 40px;
  padding: 40px;
  background-color: #fff; }
  @media only screen and (max-width: 750px) {
    .company .company-content {
      margin-top: 30px;
      padding: 20px; } }
  .company .company-content h3 {
    font-size: 3.2rem;
    line-height: 4.2rem;
    font-weight: bold;
    margin-bottom: 40px; }
    @media only screen and (max-width: 1080px) {
      .company .company-content h3 {
        margin-bottom: 30px; } }
    @media only screen and (max-width: 750px) {
      .company .company-content h3 {
        font-size: 2rem;
        line-height: 2.8rem;
        margin-bottom: 15px; } }
  .company .company-content .company-map {
    position: relative; }
    .company .company-content .company-map .company-map-img {
      height: 550px; }
      @media only screen and (max-width: 1080px) {
        .company .company-content .company-map .company-map-img {
          display: none; } }
      .company .company-content .company-map .company-map-img img {
        width: 100%;
        height: 550px;
        object-fit: cover; }
    .company .company-content .company-map .company-map-list {
      position: absolute;
      z-index: 6; }
      @media only screen and (max-width: 1080px) {
        .company .company-content .company-map .company-map-list {
          display: none; } }
      .company .company-content .company-map .company-map-list a {
        display: block;
        padding: 6px 14px;
        font-size: 1.8rem;
        line-height: 2.8rem;
        font-weight: bold;
        color: #fff;
        background-color: #000; }
    .company .company-content .company-map .list-head-office {
      right: 65%;
      top: 34.18%; }
    .company .company-content .company-map .list-amata {
      left: 54.13%;
      top: 44%; }
    .company .company-content .company-map .list-rayong {
      right: 47%;
      bottom: 13%; }
    .company .company-content .company-map .company-map-detail {
      opacity: 0;
      visibility: hidden;
      position: absolute;
      z-index: 8;
      max-width: 750px;
      padding: 20px;
      background-color: #fff;
      -webkit-box-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0.25);
      -moz-box-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0.25);
      box-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0.25);
      -webkit-transition: all .35s;
      -o-transition: all .35s;
      transition: all .35s; }
      @media only screen and (max-width: 1080px) {
        .company .company-content .company-map .company-map-detail {
          opacity: 1;
          visibility: visible;
          position: static;
          max-width: 100%;
          margin-top: 30px !important;
          padding: 0;
          background: none;
          -webkit-box-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0);
          -moz-box-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0);
          box-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0); } }
      @media only screen and (max-width: 750px) {
        .company .company-content .company-map .company-map-detail {
          margin-top: 20px !important; } }
      .company .company-content .company-map .company-map-detail h4 {
        font-size: 2.4rem;
        line-height: 3.4rem;
        font-weight: bold;
        margin-bottom: 15px; }
        @media only screen and (max-width: 750px) {
          .company .company-content .company-map .company-map-detail h4 {
            font-size: 2rem;
            line-height: 2.8rem; } }
      .company .company-content .company-map .company-map-detail .flex {
        display: flex; }
        .company .company-content .company-map .company-map-detail .flex .company-img {
          min-width: 107px; }
          .company .company-content .company-map .company-map-detail .flex .company-img img {
            width: 100%;
            height: auto; }
        .company .company-content .company-map .company-map-detail .flex .company-address {
          width: 100%;
          padding-left: 20px; }
          .company .company-content .company-map .company-map-detail .flex .company-address ul li {
            display: flex;
            padding-bottom: 3px;
            border-bottom: 1px solid #CCCCCC; }
            @media only screen and (max-width: 750px) {
              .company .company-content .company-map .company-map-detail .flex .company-address ul li {
                display: block; } }
            .company .company-content .company-map .company-map-detail .flex .company-address ul li p.topic {
              min-width: 65px;
              font-size: 1.3rem;
              font-weight: bold;
              min-width: 100px; }
          .company .company-content .company-map .company-map-detail .flex .company-address ul li + li {
            margin-top: 6px; }
    .company .company-content .company-map .company-map-detail::after {
      position: absolute;
      bottom: -14px;
      z-index: 7;
      content: '';
      width: 32px;
      height: 14px;
      margin: 0 auto;
      background-image: url("/php/lp/assets/images/top/company-detail-arrow.svg");
      background-repeat: no-repeat;
      background-position: center bottom;
      background-size: 32px; }
      @media only screen and (max-width: 1080px) {
        .company .company-content .company-map .company-map-detail::after {
          display: none !important; } }
    .company .company-content .company-map .detail-head {
      top: 45%;
      left: 0%;
      right: 0;
      margin: 0 auto; }
    .company .company-content .company-map .detail-head.active {
      opacity: 1;
      visibility: visible; }
    .company .company-content .company-map .detail-head::after {
      top: -14px !important;
      left: 20.5% !important;
      background-image: url("/php/lp/assets/images/top/company-detail-arrow-up.svg") !important; }
    .company .company-content .company-map .detail-amata {
      top: 54%;
      left: 0%;
      right: 0;
      margin: 0 auto; }
    .company .company-content .company-map .detail-amata.active {
      opacity: 1;
      visibility: visible; }
    .company .company-content .company-map .detail-amata::after {
      top: -14px !important;
      right: 24.5%;
      background-image: url("/php/lp/assets/images/top/company-detail-arrow-up.svg") !important; }
    .company .company-content .company-map .detail-rayong {
      bottom: 24.75%;
      left: 0%;
      right: 0;
      margin: 0 auto; }
    .company .company-content .company-map .detail-rayong.active {
      opacity: 1;
      visibility: visible; }
    .company .company-content .company-map .detail-rayong::after {
      left: 42%; }

/* Contact */
.form-control {
  padding: 7.813%; }
  .form-control .max-width-240 {
    max-width: 240px;
    width: 100%; }
    @media only screen and (max-width: 750px) {
      .form-control .max-width-240 {
        max-width: 100%; } }
  .form-control .sub-title-form {
    margin-bottom: 60px; }
    @media only screen and (max-width: 750px) {
      .form-control .sub-title-form {
        margin-bottom: 40px; } }
    .form-control .sub-title-form h2 {
      font-size: 2.4rem;
      font-weight: bold;
      text-align: center;
      line-height: 1.6;
      margin-bottom: 30px; }
      @media only screen and (max-width: 750px) {
        .form-control .sub-title-form h2 {
          font-size: 2rem;
          line-height: 1.4; } }
    .form-control .sub-title-form p {
      font-size: 1.8rem;
      font-weight: bold;
      text-align: center;
      line-height: 1.6; }
      @media only screen and (max-width: 750px) {
        .form-control .sub-title-form p {
          font-size: 1.4rem; } }
  .form-control .text-title-form {
    font-size: 1.8rem;
    font-weight: bold;
    margin-bottom: 10px;
    display: flex; }
    @media only screen and (max-width: 750px) {
      .form-control .text-title-form {
        font-size: 1.6rem; } }
  .form-control .check-box {
    margin-left: 20px;
    margin-right: 20px; }
    @media only screen and (max-width: 750px) {
      .form-control .check-box {
        margin-left: 0px;
        margin-right: 0px; } }
  .form-control .req {
    color: #fff;
    max-width: 76px;
    width: 100%;
    height: 24px;
    background: #9B0001;
    display: inline-flex;
    font-size: 1.3rem;
    justify-content: center;
    border-radius: 5px;
    margin-left: 10px;
    font-weight: bold; }
  .form-control .row-form li + li {
    margin-top: 50px; }
    @media only screen and (max-width: 750px) {
      .form-control .row-form li + li {
        margin-top: 30px; } }
  .form-control .input-custom {
    width: 100%;
    border: 1px solid #CCCCCC;
    height: 40px;
    font-size: 1.6rem;
    padding: 5px 15px; }
  .form-control .textarea-custom {
    width: 100%;
    border: 1px solid #CCCCCC;
    height: 240px;
    font-size: 1.6rem;
    padding: 15px 15px; }
    @media only screen and (max-width: 750px) {
      .form-control .textarea-custom {
        height: 160px; } }
  .form-control .error .input-custom {
    border: 1px solid #9B0001; }
  .form-control .error .error-text {
    display: block; }
  .form-control .error-text {
    display: none;
    color: #9B0001;
    font-size: 1.8rem;
    margin-bottom: 10px; }
    @media only screen and (max-width: 750px) {
      .form-control .error-text {
        font-size: 1.6rem; } }
  .form-control .text-specification {
    margin-top: 60px; }
    @media only screen and (max-width: 750px) {
      .form-control .text-specification {
        margin-top: 40px; } }
    .form-control .text-specification .title-specification {
      font-size: 1.8rem;
      font-weight: bold;
      margin-bottom: 10px; }
      @media only screen and (max-width: 750px) {
        .form-control .text-specification .title-specification {
          margin-bottom: 5px; } }
    .form-control .text-specification div + div {
      margin-top: 15px; }
  .form-control .text-agree {
    margin-top: 60px; }
    @media only screen and (max-width: 750px) {
      .form-control .text-agree {
        margin-top: 40px; } }
    .form-control .text-agree .container-checkbox {
      max-width: 540px;
      width: 100%;
      margin-left: auto;
      margin-right: auto; }
    .form-control .text-agree .error-text {
      text-align: center; }
  .form-control .text-policy {
    margin-top: 25px !important; }
    @media only screen and (max-width: 750px) {
      .form-control .text-policy {
        margin-top: 20px !important; } }

.form-control-thank .sub-title-form {
  margin-bottom: 0px !important; }

.submit-form {
  max-width: 485px;
  height: 80px;
  margin: 80px auto 100px auto;
  font-size: 1.8rem; }
  @media only screen and (max-width: 750px) {
    .submit-form {
      height: 60px;
      margin: 40px auto 60px auto;
      font-size: 1.6rem !important; } }

/* Policy cookie */
.policy_cookie {
  position: fixed;
  width: 100%;
  bottom: 0px;
  background-color: rgba(0, 0, 0, 0.85);
  padding: 40px 0;
  z-index: 10;
  display: none; }
  @media only screen and (max-width: 750px) {
    .policy_cookie {
      padding: 20px 0; } }
  .policy_cookie .content-policy-cookie {
    display: flex;
    justify-content: space-between;
    align-items: center; }
    @media only screen and (max-width: 750px) {
      .policy_cookie .content-policy-cookie {
        flex-direction: column; } }
    .policy_cookie .content-policy-cookie .text-content p {
      color: #fff;
      font-size: 1.6rem;
      line-height: 1.6; }
      @media only screen and (max-width: 750px) {
        .policy_cookie .content-policy-cookie .text-content p {
          font-size: 1.4rem; } }
    .policy_cookie .content-policy-cookie .text-content a {
      color: #fff;
      font-size: 1.6rem;
      text-decoration: underline; }
    .policy_cookie .content-policy-cookie .row-btn {
      width: 200px; }
      @media only screen and (max-width: 750px) {
        .policy_cookie .content-policy-cookie .row-btn {
          margin-top: 20px; } }
    .policy_cookie .content-policy-cookie .accept-btn {
      border: 0;
      font-size: 1.6rem;
      cursor: pointer; }

/* Footer */
.none-footer .footer {
  display: none; }

footer .footer {
  padding: 40px 0;
  color: #fff;
  background-color: #000; }
  @media only screen and (max-width: 830px) {
    footer .footer {
      padding: 3% 0; } }
  footer .footer ul.footer-btn {
    display: flex;
    justify-content: space-between; }
    @media only screen and (max-width: 830px) {
      footer .footer ul.footer-btn {
        display: block; } }
    footer .footer ul.footer-btn li {
      width: 50%;
      margin: 0 5px; }
      @media only screen and (max-width: 830px) {
        footer .footer ul.footer-btn li {
          width: 100%;
          margin: 0; } }
    @media only screen and (max-width: 830px) {
      footer .footer ul.footer-btn li + li {
        margin-top: 5px; } }
footer p.copyright {
  font-size: 1.1rem;
  line-height: 2rem;
  text-align: center;
  padding: 15px 0; }

.gototop {
  display: none;
  position: fixed;
  bottom: 10px;
  right: 10px;
  z-index: 9;
  padding: 10px;
  background-color: #fff;
  -webkit-transition: all .35s;
  -o-transition: all .35s;
  transition: all .35s;
  background-color: #000; }

.show1080 {
  display: none !important; }
  @media only screen and (max-width: 1080px) {
    .show1080 {
      display: block !important; } }

.show834 {
  display: none !important; }
  @media only screen and (max-width: 830px) {
    .show834 {
      display: block !important; } }

.show750 {
  display: none !important; }
  @media only screen and (max-width: 750px) {
    .show750 {
      display: block !important; } }

.show600 {
  display: none !important; }
  @media only screen and (max-width: 600px) {
    .show600 {
      display: block !important; } }

@media only screen and (max-width: 1080px) {
  .hide1080 {
    display: none !important; } }

@media only screen and (max-width: 830px) {
  .hide834 {
    display: none !important; } }

@media only screen and (max-width: 750px) {
  .hide750 {
    display: none !important; } }

#usagepolicy {
  margin-bottom: 150px; }
  @media only screen and (max-width: 750px) {
    #usagepolicy {
      margin-bottom: 80px; } }
  #usagepolicy h3 {
    margin-top: 40px !important; }
  #usagepolicy p {
    margin-bottom: 20px; }
  #usagepolicy ol, #usagepolicy .list {
    margin-top: 20px; }
    #usagepolicy ol li, #usagepolicy .list li {
      margin-bottom: 15px;
      margin-left: 20px;
      list-style-type: decimal; }
  #usagepolicy .list li {
    position: relative;
    list-style-type: none; }
  #usagepolicy .list li:after {
    position: absolute;
    content: '•';
    left: -15px;
    top: 0; }

.policy-menu {
  text-align: center;
  margin: 30px 0 0px 0;
  font-size: 13px; }

.remark {
  margin-top: 20px; }

video {
  border: 1px solid #000;
  width: 100%;
  max-height: 100%; }

/*# sourceMappingURL=global.css.map */