﻿@charset "UTF-8";
h1,
h2,
h3,
h4,
h5,
h6,
h7,
p {
    color: #262626;
}

ol,
ul {
    margin: 0;
    padding: 0;
}

ul > li {
    position: relative;
    list-style: none;
}

blockquote,
body {
    position: relative
}

body {
    letter-spacing: .015em;
    font-size: 15px;
}

body,
figure {
    margin: 0
}

.cheat-hide,
.ovh {
    overflow: hidden
}

.breadcrumb a,
.tdn,
.tdn-a a,
.zui-pager .btn-group__item__inside {
    text-decoration: none
}

.cl__::after,
.hover-event--hover-dark::before,
blockquote::after,
blockquote::before {
    content: ''
}

.photo,
blockquote::after,
blockquote::before {
    background-position: center center;
    background-repeat: no-repeat
}

.hover-underline:hover,
.hover-underline:hover a {
    text-decoration: underline !important;
}

@font-face {
    font-family: "Meiryo";
    unicode-range: U+3040-30FF;
    src: url('../fonts/meiryo/meiryo.ttf') format("truetype"),
    url('../fonts/meiryo/meiryo.eot') format("embedded-opentype");
}

@font-face {
    font-family: Roboto, Helvetica, Arial, sans-serif, "Microsoft JhengHei", "Microsoft YaHei";
    src: url(../fonts/roboto/Roboto-Regular.ttf) format("truetype");
    font-weight: 400
}

@font-face {
    font-family: Roboto, Helvetica, Arial, sans-serif, "Microsoft JhengHei", "Microsoft YaHei";
    src: url(../fonts/roboto/Roboto-Bold.ttf) format("truetype");
    font-weight: 700
}

body {
    font-family: "Meiryo", Roboto, Helvetica, Arial, sans-serif, "Microsoft JhengHei", "Microsoft YaHei";
    letter-spacing: .01em;
    font-size: 14px;
}

blockquote,
time {
    font-size: 16px
}

* {
    box-sizing: border-box
}

summary::-webkit-details-marker {
    display: none
}

summary:focus {
    outline: -webkit-focus-ring-color auto 0
}

blockquote {
    margin: 15px 0;
    padding: 8px 20px;
    z-index: 1
}

blockquote::after,
blockquote::before {
    position: absolute;
    width: 54px;
    height: 38px;
    background-size: 54px 38px
}

blockquote::before {
    top: 0;
    left: 0;
    margin: -10px 0 0 3px;
    background-image: url(../images/quotation_01.svg)
}

blockquote::after {
    bottom: 0;
    right: 0;
    margin: 0 3px -10px 0;
    background-image: url(../images/quotation_02.svg)
}

ol,
ul {
    padding: 0
}

a {
    color: #C32B07
}

iframe,
video {
    max-width: 100%
}

hr {
    border-bottom: none
}

.cheat-hide {
    position: absolute;
    white-space: nowrap;
    -webkit-transform: translate(-9999px);
    transform: translate(-9999px)
}

.cl__::after {
    display: block;
    position: relative;
    clear: both
}

.break-line {
    word-break: break-all;
    word-wrap: break-word;
    white-space: normal
}

.w175 {
    width: 175px
}

@media screen {
    .hide-sm {
        display: none
    }
}

@media screen and (min-width:1200px) {
    .hide-sm {
        display: block
    }
    .hide-lg {
        display: none
    }
}

.fl {
    float: left
}

.flr {
    float: right
}

.fln {
    float: none
}

.cl {
    clear: both
}

.ova {
    overflow: auto
}

.pof {
    position: fixed
}

.por {
    position: relative
}

.poa {
    position: absolute
}

.ta {
    text-align: left
}

.tac {
    text-align: center
}

.tar {
    text-align: right
}

.taj {
    text-align: justify
}

.db {
    display: block
}

.dib {
    display: inline-block
}

.fwb {
    font-weight: 700
}

.fwn {
    font-weight: 400
}

.fz13 {
    font-size: 13px
}

.fz15 {
    font-size: 15px
}

.fz22 {
    font-size: 22px
}

.z-1 {
    z-index: -1
}

.pd-xl {
    padding: 60px
}

.pd-lg {
    padding: 50px
}

.pd-ml {
    padding: 40px
}

.pd-md {
    padding: 30px
}

.pd-ms {
    padding: 20px
}

.pd-sm {
    padding: 10px
}

.pd-xs {
    padding: 5px
}

.pt-xl {
    padding-top: 60px
}

.pt-lg {
    padding-top: 50px
}

.pt-ml {
    padding-top: 40px
}

.pt-md {
    padding-top: 30px
}

.pt-ms {
    padding-top: 20px
}

.pt-sm {
    padding-top: 10px
}

.pt-xs {
    padding-top: 5px
}

.pr-xl {
    padding-right: 60px
}

.pr-lg {
    padding-right: 50px
}

.pr-ml {
    padding-right: 40px
}

.pr-md {
    padding-right: 30px
}

.pr-ms {
    padding-right: 20px
}

.pr-sm {
    padding-right: 10px
}

.pr-xs {
    padding-right: 5px
}

.pb-xl {
    padding-bottom: 60px
}

.pb-lg {
    padding-bottom: 50px
}

.pb-ml {
    padding-bottom: 40px
}

.pb-md {
    padding-bottom: 30px
}

.pb-ms {
    padding-bottom: 20px
}

.pb-sm {
    padding-bottom: 10px
}

.pb-xs {
    padding-bottom: 5px
}

.pl-xl {
    padding-left: 60px
}

.pl-lg {
    padding-left: 50px
}

.pl-ml {
    padding-left: 40px
}

.pl-md {
    padding-left: 30px
}

.pl-ms {
    padding-left: 20px
}

.pl-sm {
    padding-left: 10px
}

.pl-xs {
    padding-left: 5px
}

.ph-xl {
    padding-left: 60px;
    padding-right: 60px
}

.ph-lg {
    padding-left: 50px;
    padding-right: 50px
}

.ph-ml {
    padding-left: 40px;
    padding-right: 40px
}

.ph-md {
    padding-left: 30px;
    padding-right: 30px
}

.ph-ms {
    padding-left: 20px;
    padding-right: 20px
}

.ph-sm {
    padding-left: 10px;
    padding-right: 10px
}

.ph-xs {
    padding-left: 5px;
    padding-right: 5px
}

.pv-xl {
    padding-top: 60px;
    padding-bottom: 60px
}

.pv-lg {
    padding-top: 50px;
    padding-bottom: 50px
}

.pv-ml {
    padding-top: 40px;
    padding-bottom: 40px
}

.pv-md {
    padding-top: 30px;
    padding-bottom: 30px
}

.pv-ms {
    padding-top: 20px;
    padding-bottom: 20px
}

.pv-sm {
    padding-top: 10px;
    padding-bottom: 10px
}

.pv-xs {
    padding-top: 5px;
    padding-bottom: 5px
}

.mg-xl {
    margin: 60px
}

.mg-lg {
    margin: 50px
}

.mg-ml {
    margin: 40px
}

.mg-md {
    margin: 30px
}

.mg-ms {
    margin: 20px
}

.mg-sm {
    margin: 10px
}

.mt-xl {
    margin-top: 60px
}

.mt-lg {
    margin-top: 50px
}

.mt-ml {
    margin-top: 40px
}

.mt-md {
    margin-top: 30px
}

.mt-ms {
    margin-top: 20px
}

.mt-sm {
    margin-top: 10px
}

.mt-xs {
    margin-top: 5px
}

.mr-xl {
    margin-right: 60px
}

.mr-lg {
    margin-right: 50px
}

.mr-ml {
    margin-right: 40px
}

.mr-md {
    margin-right: 30px
}

.mr-ms {
    margin-right: 20px
}

.mr-sm {
    margin-right: 10px
}

.mr-xs {
    margin-right: 5px
}

.mb-xl {
    margin-bottom: 60px
}

.mb-lg {
    margin-bottom: 50px
}

.mb-ml {
    margin-bottom: 40px
}

.mb-md {
    margin-bottom: 30px
}
.padding-top30{
    padding-top: 30px;
}

.mb-ms {
    margin-bottom: 20px
}

.mb-sm {
    margin-bottom: 10px
}

.mb-xs {
    margin-bottom: 5px
}

.ml-xl {
    margin-left: 60px
}

.ml-lg {
    margin-left: 50px
}

.ml-ml {
    margin-left: 40px
}

.ml-md {
    margin-left: 30px
}

.ml-ms {
    margin-left: 20px
}

.ml-sm {
    margin-left: 10px
}

.ml-xs {
    margin-left: 5px
}

.mh-xl {
    margin-left: 60px;
    margin-right: 60px
}

.mh-lg {
    margin-left: 50px;
    margin-right: 50px
}

.mh-ml {
    margin-left: 40px;
    margin-right: 40px
}

.mh-md {
    margin-left: 30px;
    margin-right: 30px
}

.mh-ms {
    margin-left: 20px;
    margin-right: 20px
}

.mh-sm {
    margin-left: 10px;
    margin-right: 10px
}

.mh-xs {
    margin-left: 5px;
    margin-right: 5px
}

.mv-xl {
    margin-top: 60px;
    margin-bottom: 60px
}

.mv-lg {
    margin-top: 50px;
    margin-bottom: 50px
}

.mv-ml {
    margin-top: 40px;
    margin-bottom: 40px
}

.mv-md {
    margin-top: 30px;
    margin-bottom: 30px
}

.mv-ms {
    margin-top: 20px;
    margin-bottom: 20px
}

.mv-sm {
    margin-top: 10px;
    margin-bottom: 10px
}

.mv-xs {
    margin-top: 5px;
    margin-bottom: 5px
}

.mr--md {
    margin-right: -30px
}

.m- {
    margin: auto
}

.m0 {
    margin: 0
}

.mg-each-item > * + * {
    margin-left: 10px
}

.mg-lg-each-item > * + * {
    margin-left: 20px
}

.mg-r-each-item > * {
    margin-right: 10px
}

.ti-sm {
    text-indent: 10px
}

.t0 {
    top: 0
}

.r0 {
    right: 0
}

.od1 {
    -webkit-box-ordinal-group: 2;
    -ms-flex-order: 1;
    order: 1
}

.od2 {
    -webkit-box-ordinal-group: 3;
    -ms-flex-order: 2;
    order: 2
}

@media screen {
    .right-bar,
    .top-bar {
        display: none
    }
}

@media screen and (min-width:1200px) {
    .top-bar {
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        width: 100%;
        height: 58px;
        z-index: 113;
        font-size: 16px
    }
    .top-bar--active {
        display: block
    }
    .top-bar--active + .header {
        top: 58px
    }
    .top-bar--active + .header .nav__sub {
        top: 138px
    }
    .top-bar--active ~ .search-wrapper {
        top: 58px
    }
    .top-bar--active ~ .main {
        margin-top: 138px
    }
    .top-bar .top-bar__close {
        position: absolute;
        top: 0;
        right: 18px;
        height: inherit;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        display: -webkit-flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-align-items: center
    }
    .right-bar {
        position: absolute;
        display: block;
        z-index: 112;
        right: 0
    }
    .right-bar .right-bar__children {
        right: 0
    }
    .right-bar.fixed .right-bar__children {
        position: fixed;
        -webkit-backface-visibility: hidden;
        top: 248px
    }
    .right-bar.fixed-end {
        bottom: 0
    }
    .right-bar.fixed-end .right-bar__children {
        position: relative;
        top: auto;
        bottom: 0
    }
}

@media screen {
    .footer {
        letter-spacing: .075em;
        padding: 15px
    }
    .footer .footer__left,
    .footer .footer__right {
        padding: 10px 0
    }
    .copyright {
        font-size: 14px
    }
    .header {
        position: fixed;
        z-index: 113;
        height: 50px;
        width: 100%;
        top: 0;
        right: 0;
        left: 0;
        background-color: #fff;
        overflow: hidden;
        border-bottom: 1px solid #bfbfbf;
        -webkit-transition: background-color .3s ease-out;
        transition: background-color .3s ease-out
    }
    .header .header__logo-wrapper {
        position: relative;
        left: 0;
        top: 0;
        width: 150px;
        float: left;
        height: 50px
    }
    .header .header__menu-item-wrapper {
        position: relative;
        top: 0;
        right: 0;
        width: 75px;
        float: right;
        height: 50px
    }
    .header .header__menu-item-wrapper .header__menu-item-wrapper__li {
        margin: 0 6.5px
    }
    .header .header__mobile-menu-open-hide {
        display: inline-block
    }
    .header .header__mobile-menu-open-show,
    .header--menu-open .header__mobile-menu-open-hide {
        display: none
    }
    .header--menu-open {
        min-height: 100vh;
        background-color: #1a1a1a;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch
    }
    .header--menu-open .header__mobile-menu-open-show {
        display: inline-block
    }
    .header--menu-open .header__nav {
        position: relative;
        opacity: 1;
        visibility: visible;
        -webkit-transition: opacity .3s ease-out, visibility 0s ease-out;
        transition: opacity .3s ease-out, visibility 0s ease-out
    }
    .header--language-open .header__nav {
        opacity: 0;
        visibility: hidden;
        -webkit-transition: opacity .3s ease-out, visibility 0s ease-out;
        transition: opacity .3s ease-out, visibility 0s ease-out
    }
    .header--language-open .nav.nav--language {
        opacity: 1;
        visibility: visible;
        -webkit-transition: opacity .3s ease-out, visibility 0s ease-out;
        transition: opacity .3s ease-out, visibility 0s ease-out
    }
}

@media screen and (min-width:1200px) {
    .footer {
        padding: 25px 15px
    }
    .footer .footer__right {
        padding: 20px 0
    }
    .header,
    .header.header--menu-open {
        background-color: #fff;
        overflow: visible
    }
    .header {
        height: 80px
    }
    .header .header__logo-wrapper {
        width: 170px;
        height: 80px
    }
    .header .header__menu-item-wrapper {
        width: 65px;
        height: 80px
    }
    .header .header__mobile-menu-open-hide,
    .header .header__mobile-menu-open-show {
        display: inline-block
    }
    .header .header__mobile-menu-open-hide.hide-lg,
    .header .header__mobile-menu-open-show.hide-lg {
        display: none
    }
    .header.header--menu-open {
        min-height: 80px
    }
    .header.header--menu-open .header__mobile-menu-open-hide,
    .header.header--menu-open .header__mobile-menu-open-show {
        display: inline-block
    }
    .header.header--menu-open .header__mobile-menu-open-hide.hide-lg,
    .header.header--menu-open .header__mobile-menu-open-show.hide-lg,
    .top-right-menu-icon-wrapper {
        display: none
    }
    .header--language-open .header__nav {
        opacity: 1;
        visibility: visible
    }
    .header-logo-pos {
        width: 266px;
        height: 125px
    }
}

@media screen {
    .main {
        position: relative;
        margin-top: 50px
    }
    .main-pd {
        padding: 30px 0
    }
    .container {
        margin-left: auto;
        margin-right: auto;
        max-width: 720px
    }
    .container--sm-full {
        max-width: 100%
    }
    .load-more-wrapper {
        margin: 40px auto;
        text-align: center
    }
    .go-top-wrapper {
        position: absolute;
        right: 20px;
        bottom: 20px
    }
    .webinar-custom .webinar-custom__read-more {
        position: absolute;
        background-color: #fff;
        padding-left: 10px;
        padding-top: 10px;
        right: 0;
        bottom: 0
    }
    .flicker {
        -webkit-animation-duration: .5s;
        animation-duration: .5s;
        -webkit-animation-name: fade-in;
        animation-name: fade-in;
        -webkit-animation-timing-function: linear;
        animation-timing-function: linear
    }
    @-webkit-keyframes fade-in {
        0%,
        70% {
            opacity: 0
        }
        100% {
            opacity: 1
        }
    }
    @keyframes fade-in {
        0%,
        70% {
            opacity: 0
        }
        100% {
            opacity: 1
        }
    }
}

@media screen and (min-width:1200px) {
    .main-pd {
        padding: 65px 0
    }
    .main {
        margin-top: 80px
    }
    .container,
    .container--sm-full {
        max-width: 1200px
    }
    .container--720 {
        max-width: 720px
    }
    .container--900 {
        max-width: 900px
    }
    .container--1000 {
        max-width: 1000px
    }
    .container--1600 {
        max-width: 1600px
    }
    .go-top-wrapper {
        right: 45px;
        bottom: 20px
    }
    .webinar-custom--list-height {
        width: 33%;
        height: 280px;
        overflow: hidden;
        padding-bottom: 30px
    }
    .webinar-custom .webinar-custom__excerpt {
        height: 250px;
        overflow: hidden
    }
}

@media screen {
    .nav--header-nav {
        opacity: 0;
        visibility: hidden;
        -webkit-transition: opacity .3s ease-out, visibility 0s ease-out .3s;
        transition: opacity .3s ease-out, visibility 0s ease-out .3s;
        clear: both;
        margin: 30px 15px
    }
    .nav--header-nav .nav--header-nav__ul::after {
        content: '';
        display: block;
        position: relative;
        clear: both
    }
    .nav--header-nav .nav--header-nav__ul a {
        text-decoration: none
    }
    .nav--header-nav .nav__sub a {
        color: #fff
    }
    .nav--header-nav .nav__sub a:hover {
        color: #ed8500;
    }
    .nav--header-nav .nav__sub-ul .nav__sub-ul__title {
        padding-top: 13px;
        padding-left: 8px;
        font-size: 18px
    }
    .nav--header-nav .nav__sub-ul .nav__sub-ul__text,
    .nav--header-nav .nav__sub-ul li {
        color: #fff;
        display: block
    }
    .nav--header-nav .nav__sub-ul .nav__sub-ul__sub-ul > li {
        position: relative;
        font-size: 14px;
        font-weight: 400;
        line-height: 24px;
        margin: 3px 0;
        padding: 0 10px
    }
    .nav--header-nav .nav__sub-ul .nav__sub-ul__sub-ul > li::before {
        position: absolute;
        content: '';
        top: 9px;
        left: 0;
        width: 5px;
        height: 2px;
        background-size: 5px 2px;
        background-image: url(../images/minus-for-menu.svg)
    }
    .nav--header-nav .nav__sub-ul .nav__sub-ul__sub-ul .nav__sub-ul__sub-ul__has-sub-ul-li::before {
        top: 7px;
        width: 6px;
        height: 8px;
        background-size: 6px 8px;
        background-image: url(../images/minus-for-menu.svg)
    }
    .nav--header-nav .nav__sub-ul .nav__sub-ul__sub-ul .nav__sub-ul__sub-ul__sub-ul > li {
        position: relative;
        padding-left: 12px;
        letter-spacing: .1em;
        line-height: 22px;
        margin: 2px 0;
        font-size: 13px
    }
    .nav--header-nav .nav__sub-ul .nav__sub-ul__sub-ul .nav__sub-ul__sub-ul__sub-ul > li::before {
        position: absolute;
        content: '';
        top: 10px;
        left: 0;
        width: 5px;
        height: 2px;
        background-size: 5px 2px;
        background-image: url(../images/minus-for-menu.svg)
    }
    .nav--header-nav .nav__main-li {
        position: relative;
        min-height: 46px;
        max-height: 46px;
        line-height: 45px;
        margin: 30px 0;
        overflow: hidden;
        -webkit-transition: max-height .6s cubic-bezier(.35, .53, 0, 1);
        transition: max-height .6s cubic-bezier(.35, .53, 0, 1)
    }
    .nav--header-nav .nav__main-li.nav__main-li--li-open .nav__main-li--li-open--upside-down {
        -webkit-transform: rotateZ(180deg);
        transform: rotateZ(180deg)
    }
    .nav--header-nav .nav__main-li .nav__main-li__a {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        display: -webkit-flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-align-items: center;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-justify-content: center;
        border-bottom-width: 1px;
        border-bottom-style: solid;
        border-bottom-color: #767676
    }
    .nav--header-nav .nav__main-li .nav__main-li__a::after {
        content: '';
        display: block;
        position: relative;
        clear: both
    }
    .nav--header-nav .nav__main-li .nav__main-li__icon {
        display: inline-block
    }
    .nav--header-nav .nav__main-li .nav__main-li__icon.icon--target {
        background-image: url(../images/items/target-orange.svg)
    }
    .nav--header-nav .nav__main-li .nav__main-li__icon.icon--stack {
        background-image: url(../images/items/stack-orange.svg)
    }
    .nav--header-nav .nav__main-li .nav__main-li__icon.icon--question {
        background-image: url(../images/items/question-orange.svg)
    }
    .nav--header-nav .nav__main-li .nav__main-li__icon.icon--cart {
        background-image: url(../images/items/cart-orange.svg)
    }
    .nav--header-nav .nav__main-li .nav__main-li__icon.icon--moldex-m {
        background-image: url(../images/items/moldex-m-orange.svg)
    }
    .nav--header-nav .nav__main-li .nav__main-li__icon.icon--arrow-down {
        background-image: url(../images/arrow/down-orange.svg)
    }
    .nav--header-nav .nav__main-li .nav__main-li__text {
        width: calc(100% - 40px);
        text-indent: 15px;
        font-weight: 700;
        color: #ed8500;
        font-size: 16px
    }
    .nav.nav--language {
        position: absolute;
        left: 0;
        right: 0;
        opacity: 0;
        visibility: hidden;
        -webkit-transition: opacity .3s ease-out, visibility 0s ease-out .3s;
        transition: opacity .3s ease-out, visibility 0s ease-out .3s
    }
    .nav.nav--language .nav--language__ul {
        margin: 10px 0
    }
    .nav.nav--language .nav--language__li {
        margin: 0
    }
    .nav.nav--language .nav--language__li .nav--language__li__text {
        width: 100%;
        text-indent: 0
    }
    .nav.nav--language .nav--language__title {
        font-size: 16px;
        padding-left: 8px;
        line-height: 32px
    }
}

@media screen and (min-width:1200px) {
    .nav--header-nav {
        float: right;
        opacity: 1;
        visibility: visible;
        clear: none;
        margin: 0
    }
    .nav--header-nav .nav__main-li {
        float: left;
        margin: 0 20px;
        min-height: 80px;
        line-height: 80px;
        max-height: 80px;
        overflow: visible
    }
    .nav--header-nav .nav__main-li .nav__main-li__a {
        border-bottom: none
    }
    .nav--header-nav .nav__main-li .nav__main-li__icon {
        display: none
    }
    .nav--header-nav .nav__main-li .nav__main-li__text {
        font-weight: 400;
        text-indent: 0;
        width: 100%;
        color: #000
    }
    .nav--header-nav .nav__main-li:hover .nav__main-li__text {
        color: #C32B07
    }
    .nav--header-nav .nav__main-li:hover .nav__main-li__a::after {
        position: absolute;
        content: '';
        bottom: 0;
        left: 0;
        right: 0;
        width: 100%;
        height: 3px;
        background-color: #C32B07
    }
    .nav--header-nav .nav__main-li:hover .nav__sub {
        opacity: 1;
        visibility: visible;
        -webkit-transition: opacity .3s ease-out, visibility 0s ease-out;
        transition: opacity .3s ease-out, visibility 0s ease-out
    }
    .nav--header-nav .nav__sub {
        z-index: 112;
        position: fixed;
        top: 80px;
        left: 0;
        right: 0;
        width: 100%;
        opacity: 0;
        visibility: hidden;
        -webkit-transition: opacity .3s ease-out, visibility 0s ease-out .3s;
        transition: opacity .3s ease-out, visibility 0s ease-out .3s;
        background-color: rgba(0, 0, 0, .9)
    }
    .nav--header-nav .nav__sub-ul {
        max-width: 1200px;
        margin: 0 auto;
        padding-bottom: 15px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        display: -webkit-flex;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
        -webkit-justify-content: space-between;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        -webkit-flex-wrap: wrap
    }
    .nav--header-nav .nav__sub-ul .nav__sub-ul__text {
        display: block;
        color: #ed8500;
        line-height: 50px
    }
    .nav--header-nav .nav__sub-ul .nav__sub-ul__title {
        margin-top: 15px;
        padding: 0;
        width: calc(50% - 30px);
        font-weight: 700
    }
    .nav--header-nav .nav__sub-ul .nav__sub-ul__sub-ul {
        margin-bottom: 10px;
        padding-top: 10px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        display: -webkit-flex;
        -webkit-box-pack: start;
        -ms-flex-pack: start;
        justify-content: flex-start;
        -webkit-justify-content: flex-start;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        -webkit-flex-wrap: wrap;
        border-top-color: #a1a1a1;
        border-top-style: solid;
        border-top-width: 1px
    }
    .nav--header-nav .nav__sub-ul .nav__sub-ul__sub-ul > li {
        width: 33.3333%;
        line-height: 22px;
        margin: 5px 0
    }
    .nav.nav--language {
        left: auto;
        right: 38px;
        opacity: 1;
        visibility: visible
    }
    .nav.nav--language .nav--language__ul {
        margin: 10px auto
    }
    .nav.nav--language .nav--language__li {
        margin: 0;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        display: -webkit-flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-align-items: center
    }
    .nav.nav--language .nav--language__li .nav--language__li__text {
        display: none
    }
    .nav--footer-nav {
        margin-bottom: 40px
    }
    .nav--footer-nav .nav--footer-nav__ul {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        display: -webkit-flex;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
        -webkit-justify-content: space-between
    }
    .nav--footer-nav .nav--footer-nav__ul::after {
        content: '';
        display: block;
        position: relative;
        clear: both
    }
    .nav--footer-nav .nav--footer-nav__ul a {
        text-decoration: none
    }
    .nav--footer-nav .nav__main-li {
        letter-spacing: .075em;
        width: 18.125%;
        font-size: 17px;
        max-height: 46px;
        overflow: hidden;
        -webkit-transition: max-height .6s cubic-bezier(.35, .53, 0, 1);
        transition: max-height .6s cubic-bezier(.35, .53, 0, 1)
    }
    .nav--footer-nav .nav__main-li.nav__main-li--li-open .nav__main-li--li-open--upside-down {
        -webkit-transform: rotateZ(180deg);
        transform: rotateZ(180deg)
    }
    .nav--footer-nav .nav__main-li__a {
        line-height: 45px;
        text-overflow: ellipsis;
        white-space: nowrap;
        border-bottom-style: solid;
        border-bottom-width: 1px;
        border-bottom-color: #ededed;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        display: -webkit-flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-align-items: center
    }
    .nav--footer-nav .nav__main-li__a::after {
        content: '';
        display: block;
        position: relative;
        clear: both
    }
    .nav--footer-nav .nav__main-li__icon {
        display: inline-block
    }
    .nav--footer-nav .nav__main-li__icon.icon--target {
        background-image: url(../images/items/target-white.svg)
    }
    .nav--footer-nav .nav__main-li__icon.icon--stack {
        background-image: url(../images/items/stack-white.svg)
    }
    .nav--footer-nav .nav__main-li__icon.icon--question {
        background-image: url(../images/items/question-white.svg)
    }
    .nav--footer-nav .nav__main-li__icon.icon--cart {
        background-image: url(../images/items/cart-white.svg)
    }
    .nav--footer-nav .nav__main-li__icon.icon--moldex-m {
        background-image: url(../images/items/moldex-m-white.svg)
    }
    .nav--footer-nav .nav__main-li__icon.icon--arrow-down {
        background-image: url(../images/arrow/down-white.svg)
    }
    .nav--footer-nav .nav__main-li__text {
        padding: 0 10px;
        width: calc(100% - 40px)
    }
    .nav--footer-nav a {
        color: #fff
    }
    .nav--footer-nav .nav__sub {
        margin: 15px 8px;
        line-height: 26px
    }
    .nav--footer-nav .nav__sub-ul .nav__sub-ul__title {
        padding: 5px 0
    }
    .nav--footer-nav .nav__sub-ul .nav__sub-ul__text {
        font-size: 15px
    }
    .nav--footer-nav .nav__sub-ul .nav__sub-ul__sub-ul > li {
        position: relative;
        margin-left: 8px;
        padding-left: 12px;
        font-size: 14px;
        letter-spacing: .1em
    }
    .nav--footer-nav .nav__sub-ul .nav__sub-ul__sub-ul > li::before {
        position: absolute;
        content: '';
        top: 12px;
        left: 0;
        width: 5px;
        height: 2px;
        background-size: 5px 2px;
        background-image: url(../images/minus-for-menu.svg)
    }
    .nav--footer-nav .nav__sub-ul .nav__sub-ul__sub-ul a {
        opacity: .7
    }
    .nav--footer-nav .nav__sub-ul .nav__sub-ul__sub-ul a:hover {
        opacity: 1
    }
    .nav--footer-nav .nav__sub-ul .nav__sub-ul__sub-ul .nav__sub-ul__sub-ul__has-sub-ul-li > span {
        opacity: .7
    }
    .nav--footer-nav .nav__sub-ul .nav__sub-ul__sub-ul .nav__sub-ul__sub-ul__has-sub-ul-li::before {
        top: 9px;
        width: 6px;
        height: 8px;
        background-size: 6px 8px;
        background-image: url(../images/plus-for-menu.svg)
    }
    .nav--footer-nav .nav__sub-ul .nav__sub-ul__sub-ul .nav__sub-ul__sub-ul__sub-ul > li {
        position: relative;
        padding-left: 12px;
        letter-spacing: .1em;
        line-height: 22px;
        font-size: 13px
    }
    .nav--footer-nav .nav__sub-ul .nav__sub-ul__sub-ul .nav__sub-ul__sub-ul__sub-ul > li::before {
        position: absolute;
        content: '';
        top: 10px;
        left: 0;
        width: 5px;
        height: 2px;
        background-size: 5px 2px;
        background-image: url(../images/minus-for-menu.svg)
    }
}

@media screen {
    .search-wrapper {
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        z-index: 2;
        height: 40px;
        -webkit-transition: transform .6s cubic-bezier(.35, .53, 0, 1);
        -webkit-transition: -webkit-transform .6s cubic-bezier(.35, .53, 0, 1);
        transition: -webkit-transform .6s cubic-bezier(.35, .53, 0, 1);
        transition: transform .6s cubic-bezier(.35, .53, 0, 1);
        transition: transform .6s cubic-bezier(.35, .53, 0, 1), -webkit-transform .6s cubic-bezier(.35, .53, 0, 1)
    }
    .search-wrapper--active {
        -webkit-transform: translateY(50px);
        transform: translateY(50px)
    }
    .search-wrapper .search__input {
        color: #fff;
        margin: 5px 15px;
        height: 30px;
        line-height: 30px;
        width: calc(100% - 90px);
        font-size: 18px
    }
}

@media screen and (min-width:1200px) {
    .search-wrapper {
        height: 60px
    }
    .search-wrapper--active {
        -webkit-transform: translateY(10px);
        transform: translateY(10px);
        z-index: 1024
    }
    .search-wrapper .search__input {
        margin: 5px 0;
        height: 50px;
        line-height: 50px;
        width: calc(100% - 80px);
        font-size: 26px;
        letter-spacing: .08em
    }
}

@media screen {
    h4,
    h5 {
        font-weight: 400
    }
    h1,
    h2,
    h3,
    h4,
    h5,
    h6,
    p {}
    h1 {
        font-size: 24px
    }
    h2 {
        font-size: 20px
    }
    h3 {
        font-size: 18px
    }
    h4 {
        font-size: 16px
    }
    h5 {
        font-size: 14px
    }
    h6 {
        font-size: 12px;
        font-weight: 400
    }
    .article,
    article,
    p {
        font-size: 14px;
        font-weight: 400;
        line-height: 22px
    }
    .article,
    article {
        word-wrap: break-word;
        word-break: break-all
    }
    .article.article--large-level-1,
    article.article--large-level-1 {
        font-size: 16px;
        line-height: 24px
    }
    .article.article--large-level-1 h1,
    article.article--large-level-1 h1 {
        font-size: 26px
    }
    .article.article--large-level-1 h2,
    article.article--large-level-1 h2 {
        font-size: 22px
    }
    .article.article--large-level-1 h3,
    article.article--large-level-1 h3 {
        font-size: 20px
    }
    .article.article--large-level-1 h4,
    article.article--large-level-1 h4 {
        font-size: 18px
    }
    .article.article--large-level-1 h5,
    article.article--large-level-1 h5 {
        font-size: 16px
    }
    .article.article--large-level-1 h6,
    article.article--large-level-1 h6 {
        font-size: 14px
    }
    .article.article--large-level-1 p,
    article.article--large-level-1 p {
        font-size: 16px;
        line-height: 24px
    }
    .article.article--large-level-2,
    article.article--large-level-2 {
        font-size: 18px;
        line-height: 26px
    }
    .article.article--large-level-2 h1,
    article.article--large-level-2 h1 {
        font-size: 28px
    }
    .article.article--large-level-2 h2,
    article.article--large-level-2 h2 {
        font-size: 24px
    }
    .article.article--large-level-2 h3,
    article.article--large-level-2 h3 {
        font-size: 22px
    }
    .article.article--large-level-2 h4,
    article.article--large-level-2 h4 {
        font-size: 20px
    }
    .article.article--large-level-2 h5,
    article.article--large-level-2 h5 {
        font-size: 18px
    }
    .article.article--large-level-2 h6,
    article.article--large-level-2 h6 {
        font-size: 16px
    }
    .article.article--large-level-2 p,
    article.article--large-level-2 p {
        font-size: 18px;
        line-height: 26px
    }
}

@media screen and (min-width:1200px) {
    h1 {
        font-size: 36px
    }
    h2 {
        font-size: 28px
    }
    h3 {
        font-size: 22px
    }
    h4 {
        font-size: 18px
    }
    h5 {
        font-size: 16px
    }
    h6 {
        font-size: 14px
    }
    .article,
    article,
    p {
        font-size: 16px;
        line-height: 26px
    }
    .article.article--large-level-1,
    article.article--large-level-1 {
        font-size: 18px
    }
    .article.article--large-level-1 h1,
    article.article--large-level-1 h1 {
        font-size: 38px
    }
    .article.article--large-level-1 h2,
    article.article--large-level-1 h2 {
        font-size: 30px
    }
    .article.article--large-level-1 h3,
    article.article--large-level-1 h3 {
        font-size: 28px
    }
    .article.article--large-level-1 h4,
    article.article--large-level-1 h4 {
        font-size: 20px
    }
    .article.article--large-level-1 h5,
    article.article--large-level-1 h5 {
        font-size: 18px
    }
    .article.article--large-level-1 h6,
    article.article--large-level-1 h6 {
        font-size: 16px
    }
    .article.article--large-level-1 p,
    article.article--large-level-1 p {
        font-size: 18px
    }
    .article.article--large-level-2,
    article.article--large-level-2 {
        font-size: 20px;
        line-height: 28px
    }
    .article.article--large-level-2 h1,
    article.article--large-level-2 h1 {
        font-size: 40px
    }
    .article.article--large-level-2 h2,
    article.article--large-level-2 h2 {
        font-size: 32px
    }
    .article.article--large-level-2 h3,
    article.article--large-level-2 h3 {
        font-size: 30px
    }
    .article.article--large-level-2 h4,
    article.article--large-level-2 h4 {
        font-size: 22px
    }
    .article.article--large-level-2 h5,
    article.article--large-level-2 h5 {
        font-size: 20px
    }
    .article.article--large-level-2 h6,
    article.article--large-level-2 h6 {
        font-size: 18px
    }
    .article.article--large-level-2 p,
    article.article--large-level-2 p {
        font-size: 20px;
        line-height: 28px
    }
}

@media screen {
    .banner {
        position: relative;
        height: 200px
    }
    .banner--large {
        height: 250px
    }
    .banner .banner__hgroup {
        text-align: center
    }
    .banner .banner__hgroup h1,
    .banner .banner__hgroup h2 {
        font-size: 36px;
        margin: 0;
        line-height: 46px
    }
    .banner .banner__hgroup h3,
    .banner .banner__hgroup h4,
    .banner .banner__hgroup p {
        margin: 0;
        line-height: 26px
    }
    .long-banner {
        position: relative;
        overflow: hidden
    }
    .long-banner .long-banner__inside {
        position: relative;
        width: calc((100% + 30px) * 20);
        -webkit-transition: transform .5s ease-out;
        -webkit-transition: -webkit-transform .5s ease-out;
        transition: -webkit-transform .5s ease-out;
        transition: transform .5s ease-out;
        transition: transform .5s ease-out, -webkit-transform .5s ease-out
    }
    .long-banner .long-banner__inside::after {
        content: '';
        display: block;
        position: relative;
        clear: both
    }
    .long-banner .long-banner__inside > * {
        width: calc((100% - 30px * 20)/ 20);
        float: left;
        margin-right: 30px
    }
}

.breadcrumb,
.flex {
    display: -webkit-box;
    display: -ms-flexbox
}

@media screen and (min-width:1200px) {
    .banner {
        height: 200px
    }
    .banner--large {
        height: 350px
    }
    .long-banner .long-banner__inside {
        width: calc(((100% + 30px)/ 3) * 20)
    }
}

.bd--bd {
    border-style: solid;
    border-width: 1px
}

.bd--bd--white {
    border-color: #fff
}

.bd--bd--orange {
    border-color: #ed8500
}

.bd--bd--red {
    border-color: #C32B07
}

.bd--bd--lightgray {
    border-color: #ededed
}

.bd--bd--lightgray-2 {
    border-color: #d2d2d2
}

.bd--bd--dotted {
    border-style: dotted
}

.bd--bd--rad {
    border-radius: 4px
}

.bd--b {
    border-bottom-style: solid;
    border-bottom-width: 1px
}

.bd--b--2 {
    border-bottom-width: 2px
}

.bd--b--red {
    border-bottom-color: #C32B07
}

.bd--b--lightgray {
    border-bottom-color: #ededed
}

.bd--b--lightgray-2 {
    border-bottom-color: #d2d2d2
}

.bd--b--dotted {
    border-bottom-style: dotted
}

.bd--t {
    border-top-style: solid;
    border-top-width: 1px
}

.bd--t--lightgray {
    border-top-color: #ededed
}

.bd--t--lightgray-2 {
    border-top-color: #d2d2d2
}

.bd--t--dotted {
    border-top-style: dotted
}

.breadcrumb {
    font-size: 12px;
    height: 70px;
    display: flex;
    display: -webkit-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-align-items: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-justify-content: flex-start;
    color: #000000
}

.breadcrumb > * + * {
    margin-left: 6px
}

.breadcrumb a {
    color: inherit
}

.breadcrumb a:hover {
    color: #C32B07
}

@media screen {
    .btn--orange:disabled,
    .btn--red:disabled {
        opacity: .9
    }
    .btn,
    button {
        cursor: pointer
    }
    .btn:focus,
    button:focus {
        outline: 0
    }
    .btn {
        border: none;
        font-family: Roboto, Helvetica, Arial, sans-serif, "Microsoft JhengHei", "Microsoft YaHei";
        font-weight: 700;
        border-radius: 4px;
        -webkit-transition: all .3s ease-out;
        transition: all .3s ease-out
    }
    .btn--none {
        background-color: transparent;
        padding: 0
    }
    .btn--default {
        background-color: #ececec;
        color: #000;
        font-size: 14px;
        border: none;
        padding: 12px 18px
    }
    .btn--default:hover {
        background-color: #dcdcdc
    }
    .btn--sm {
        font-size: 12px;
        padding: 8px 13px
    }
    .btn--md {
        font-size: 14px;
        padding: 12px 20px
    }
    .btn--lg {
        font-size: 16px;
        padding: 15px 30px
    }
    .btn--long,
    .btn--long-2 {
        font-size: 15px;
        padding: 15px 0;
        max-width: 100%
    }
    .btn--long {
        width: 250px
    }
    .btn--long-2 {
        width: 320px
    }
    .btn--icon-size-large {
        width: 50px;
        height: 50px
    }
    .btn--icon-btn {
        width: 30px;
        height: 30px;
        background-color: #fff
    }
    .btn--icon-btn:hover {
        background-color: #d7d7d7
    }
    .btn--scale-orange,
    .btn--scale-white {
        background-color: transparent;
        border-width: 1px;
        border-style: solid
    }
    .btn--no-rad {
        border-radius: 0
    }
    .btn--scale-white {
        color: #fff;
        border-color: #fff
    }
    .btn--scale-orange {
        color: #ed8500;
        border-color: #ed8500
    }
    .btn--orange {
        color: #fff;
        background-color: #ed8500
    }
    .btn--hover-bg-red:hover,
    .btn--red {
        background-color: #C32B07
    }
    .btn--red {
        color: #fff
    }
    .btn--hover-bd-red:hover {
        border-color: #C32B07
    }
    .btn span + span {
        margin-left: 8px
    }
}

.card--fog {
    position: relative;
    overflow: hidden
}

.card--fog .card--fog__detail,
.card--fog .card--fog__figcaption {
    position: absolute;
    color: #fff;
    background-color: rgba(0, 0, 0, .8);
    right: 0;
    left: 0;
    bottom: 0
}

.card--fog .card--fog__photo {
    padding-bottom: 91%
}

.card--fog .card--fog__figcaption {
    opacity: 1;
    visibility: visible;
    width: 100%;
    height: 60px;
    -webkit-transition: opacity .3s ease-out, visibility 0s ease-out, transform .6s cubic-bezier(.35, .53, 0, 1);
    -webkit-transition: opacity .3s ease-out, visibility 0s ease-out, -webkit-transform .6s cubic-bezier(.35, .53, 0, 1);
    transition: opacity .3s ease-out, visibility 0s ease-out, -webkit-transform .6s cubic-bezier(.35, .53, 0, 1);
    transition: opacity .3s ease-out, visibility 0s ease-out, transform .6s cubic-bezier(.35, .53, 0, 1);
    transition: opacity .3s ease-out, visibility 0s ease-out, transform .6s cubic-bezier(.35, .53, 0, 1), -webkit-transform .6s cubic-bezier(.35, .53, 0, 1)
}

.card--fog .card-fog__fig-icon,
.card--fog .card-fog__fig-text {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    display: -webkit-inline-flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-align-items: flex-start
}

.card--fog .card-fog__fig-text {
    margin: 25px 15px;
    width: 190px;
    height: calc(100% - 0px);
    line-height: 60px;
    font-size: 21px;
    font-weight: 700;
    overflow: hidden
}

.card--fog .card-fog__fig-icon {
    float: right;
    margin: 0 15px;
    height: 100%
}

.card--fog .card-fog__fig-icon .icon {
    width: 20px;
    height: 20px
}

.card--fog .card--fog__detail {
    opacity: 0;
    visibility: hidden;
    top: 0;
    height: 100%;
    width: 100%;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    text-align: center;
    -webkit-transform: translateY(-100px);
    transform: translateY(-100px);
    -webkit-transition: opacity .3s ease-out, visibility 0s ease-out .3s, transform .6s cubic-bezier(.35, .53, 0, 1);
    -webkit-transition: opacity .3s ease-out, visibility 0s ease-out .3s, -webkit-transform .6s cubic-bezier(.35, .53, 0, 1);
    transition: opacity .3s ease-out, visibility 0s ease-out .3s, -webkit-transform .6s cubic-bezier(.35, .53, 0, 1);
    transition: opacity .3s ease-out, visibility 0s ease-out .3s, transform .6s cubic-bezier(.35, .53, 0, 1);
    transition: opacity .3s ease-out, visibility 0s ease-out .3s, transform .6s cubic-bezier(.35, .53, 0, 1), -webkit-transform .6s cubic-bezier(.35, .53, 0, 1)
}

.card--fog .card--fog__detail .card--fog__detail__text {
    padding: 9px 0;
    font-size: 21px
}

.card--fog:hover .card--fog__detail {
    opacity: 1;
    visibility: visible;
    -webkit-transform: none;
    transform: none;
    -webkit-transition: opacity .3s ease-out, visibility 0s ease-out, transform .6s cubic-bezier(.35, .53, 0, 1);
    -webkit-transition: opacity .3s ease-out, visibility 0s ease-out, -webkit-transform .6s cubic-bezier(.35, .53, 0, 1);
    transition: opacity .3s ease-out, visibility 0s ease-out, -webkit-transform .6s cubic-bezier(.35, .53, 0, 1);
    transition: opacity .3s ease-out, visibility 0s ease-out, transform .6s cubic-bezier(.35, .53, 0, 1);
    transition: opacity .3s ease-out, visibility 0s ease-out, transform .6s cubic-bezier(.35, .53, 0, 1), -webkit-transform .6s cubic-bezier(.35, .53, 0, 1)
}

.card--fog:hover .card--fog__figcaption {
    opacity: 0;
    visibility: hidden;
    -webkit-transform: translateY(100px);
    transform: translateY(100px);
    -webkit-transition: opacity .3s ease-out, visibility 0s ease-out .3s, transform .6s cubic-bezier(.35, .53, 0, 1);
    -webkit-transition: opacity .3s ease-out, visibility 0s ease-out .3s, -webkit-transform .6s cubic-bezier(.35, .53, 0, 1);
    transition: opacity .3s ease-out, visibility 0s ease-out .3s, -webkit-transform .6s cubic-bezier(.35, .53, 0, 1);
    transition: opacity .3s ease-out, visibility 0s ease-out .3s, transform .6s cubic-bezier(.35, .53, 0, 1);
    transition: opacity .3s ease-out, visibility 0s ease-out .3s, transform .6s cubic-bezier(.35, .53, 0, 1), -webkit-transform .6s cubic-bezier(.35, .53, 0, 1)
}

.card--normal {
    position: relative;
    overflow: hidden;
    border-radius: 4px
}

.card--normal .card--normal__photo {
    padding-bottom: 65.51724138%
}

.card--normal .card--normal__figcaption {
    background-color: #fff;
    padding: 25px 20px;
    height: 168px
}

.card--normal .card--normal__figcaption .card--normal__figcaption__text {
    display: block;
    margin: 15px 0 5px;
    text-overflow: ellipsis;
    overflow: hidden;
    font-size: 22px;
    line-height: 26.4px;
    max-height: 105.6px
}

.card--normal .card--normal__figcaption time {
    font-size: 16px;
    margin-left: 5px
}

.card--normal .card--normal__tag {
    display: inline-block;
    font-size: 16px
}

.card--list-items .card--list-items__figure {
    margin-bottom: 20px
}

.card--list-items .card--list-items__figure .card--list-items__figure__text {
    overflow: hidden;
    font-size: 18px;
    line-height: 24px;
    height: 72px;
    margin: 10px 0
}

.card--list-items .card--list-items__photo {
    padding-bottom: 65.51724138%
}

.card--simple {
    position: relative;
    background-color: #fff;
    color: #000
}

.card--simple .card--simple__photo {
    padding-bottom: 65.78947368%;
    border-width: 1px;
    border-style: solid;
    border-color: #f8f8f8
}

.card--simple .card--simple__text {
    position: relative;
    padding: 8px
}

.card--simple .card--simple__text h4 {
    font-size: 16px;
    margin: 0
}

.card--simple .card--simple__text p {
    font-size: 12px;
    line-height: 18px;
    height: 36px;
    overflow: hidden;
    margin: 0
}

.card--simple .card--simple__text--gray {
    background-color: #f6f6f6
}

@media screen and (min-width:1200px) {
    .card.card--list-items::after {
        content: '';
        display: block;
        position: relative;
        clear: both
    }
    .card.card--list-items .card--list-items__figure {
        float: left;
        margin-right: 15px;
        width: calc(50% - 15px)
    }
    .card.card--list-items .card.card--list-items .card--list-items__figure .card--list-items__figure__text {
        height: 64px;
        overflow: hidden;
        line-height: 32px;
        font-size: 26px;
        margin: 10px 0
    }
    .card.card--list-items .card--list-items__figure:nth-of-type(n + 2) .card--list-items__figure__text {
        font-size: 18px;
        line-height: 24px;
        height: 72px
    }
    .card.card--list-items .card--list-items__figure:hover .card--list-items__photo {
        opacity: .8
    }
    .card.card--list-items .card--list-items__figure:hover .card--list-items__figure__text {
        text-decoration: underline;
        color: #C32B07
    }
    .card.card--list-items .card--list-items__photo {
        padding-bottom: 65.51724138%
    }
}

.decoration--line {
    overflow: hidden;
    position: relative
}

.decoration--line .decoration--line__line {
    display: inline-block;
    position: absolute;
    height: 1px;
    width: 100%;
    margin-left: 5px;
    top: 50%;
    background-color: #fff
}

.flex {
    display: flex;
    display: -webkit-flex
}

.flex--h-center {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-justify-content: center
}

.flex--h-start {
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-justify-content: flex-start
}

.flex--h-end {
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    -webkit-justify-content: flex-end
}

.flex--h-space-between {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-justify-content: space-between
}

.flex--v-center {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-align-items: center
}

.flex--v-start {
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-align-items: flex-start
}

.flex--v-end {
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
    -webkit-align-items: flex-end
}

.flex--wrap {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-flex-wrap: wrap
}

.card--fog .card--fog__detail,
.flex-center,
.zui-pager .btn-group__item__inside {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    display: -webkit-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-justify-content: center
}

.flex-center--column {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-flex-direction: column
}

@media screen {
    .form-input,
    .form-textarea {
        border-radius: 4px;
        width: 100%
    }
    .form-input,
    .form-textarea,
    .input-button-wrapper .input-button-wrapper__input {
        border-style: solid;
        border-width: 1px;
        border-color: #d2d2d2
    }
    .input-button-wrapper::after,
    .input-container-custom::after {
        content: '';
        position: relative;
        clear: both;
        display: block
    }
    input,
    select,
    textarea {
        font-weight: 400
    }
    input:focus,
    select:focus,
    textarea:focus {
        outline: 0
    }
    input::-webkit-input-placeholder,
    textarea::-webkit-input-placeholder {
        color: #232323
    }
    input:-moz-placeholder,
    textarea:-moz-placeholder {
        color: #232323;
        opacity: 1
    }
    input::-moz-placeholder,
    textarea::-moz-placeholder {
        color: #232323;
        opacity: 1
    }
    input:-ms-input-placeholder,
    textarea:-ms-input-placeholder {
        color: #232323
    }
    .form-label--with-security-code .form-label--with-security-code__code {
        display: block;
        margin: auto;
        text-align: center
    }
    .form-label--with-security-code .form-label--with-security-code__input {
        width: 100%
    }
    .form-input {
        position: relative;
        height: 42px;
        margin: 10px 0;
        padding: 15px 18px
    }
    .form-select {
        margin: 10px 0
    }
    .form-textarea {
        margin: 10px 0;
        padding: 10px;
        min-height: 200px
    }
    .label-checkbox {
        display: block;
        margin: 10px 0
    }
    .input-button-wrapper {
        position: relative;
        width: 100%;
        font-size: 12px
    }
    .input-button-wrapper .input-button-wrapper__input {
        height: 46px;
        width: calc(100% - 100px);
        padding: 11px;
        line-height: 24px;
        float: left;
        border-top-left-radius: 4px;
        border-bottom-left-radius: 4px;
        border-right: none
    }
    .input-button-wrapper .input-button-wrapper__button {
        width: 100px;
        height: 46px;
        float: right;
        border-top-left-radius: 0;
        border-bottom-left-radius: 0
    }
    .input-container-custom .input-container-custom__text {
        display: block;
        margin: 10px 0;
        white-space: nowrap;
        text-align: center
    }
    .input-container-custom .input-container-custom__select {
        margin: 10px 0;
        width: 100%
    }
    .input-container-custom .input-container-custom__button {
        margin: 10px 0;
        width: 100%;
        height: 42px;
        padding: 0
    }
    .input-container-custom .input-container-custom__button button {
        padding: inherit;
        width: inherit;
        height: inherit
    }
    .input-container-custom .input-container-custom__button .icon {
        width: inherit;
        height: inherit
    }
    .input--transparent {
        border: 0;
        background-color: transparent
    }
    .input--placeholder-white::-webkit-input-placeholder {
        color: #fff
    }
    .input--placeholder-white:-moz-placeholder {
        color: #fff;
        opacity: 1
    }
    .input--placeholder-white::-moz-placeholder {
        color: #fff;
        opacity: 1
    }
    .input--placeholder-white:-ms-input-placeholder {
        color: #fff
    }
}

@media screen and (min-width:1200px) {
    .form-input {
        height: 50px
    }
    .form-textarea {
        min-height: 400px
    }
    .form-label--with-security-code {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        display: -webkit-flex;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
        -webkit-justify-content: space-between;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-align-items: center
    }
    .form-label--with-security-code .form-label--with-security-code__code {
        display: inline-block;
        margin: 0
    }
    .form-label--with-security-code .form-label--with-security-code__input {
        width: calc(100% - 220px)
    }
    .input-container-custom {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        display: -webkit-flex;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
        -webkit-justify-content: space-between;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-align-items: center
    }
    .input-container-custom .input-container-custom__text {
        display: inline-block;
        width: 295px;
        text-align: left
    }
    .input-container-custom .input-container-custom__select {
        width: calc(100% - 50px - 195px - 30px);
        float: none;
        margin-right: 20px;
    }
    .input-container-custom .input-container-custom__button {
        width: 50px;
        height: 50px;
        float: none
    }
}

@media screen {
    .full-width {
        width: 100%
    }
    .full-height {
        height: 100%
    }
    .full,
    .zui-pager .btn-group__item__inside {
        width: 100%;
        height: 100%
    }
    .full--trbl0 {
        top: 0;
        right: 0;
        bottom: 0;
        left: 0
    }
    .grid .grid__sm-mh {
        margin-left: 15px;
        margin-right: 15px
    }
    .grid .grid__sm-mg {
        margin: 30px 15px
    }
    .grid .grid__sm-pd {
        padding: 30px 15px
    }
    .grid .grid__md-one-third-and-two-third--mg--bd-line:nth-of-type(2n - 1) {
        padding-bottom: 20px;
        border-bottom-width: 0px;
        border-bottom-style: solid;
        border-bottom-color: #a1a1a1
    }
}
/*------原本是1200px 客戶希望這裡在1024也是三欄位---------*/
@media screen and (min-width:1023px) {
    .grid .grid__md-one-second::after,
    .grid .grid__standard::after,
    .grid::after {
        content: '';
        display: block;
        position: relative;
        clear: both
    }
    .half-lg {
        width: 50%
    }
    .grid .grid__sm-mh {
        margin-left: 0;
        margin-right: 0
    }
    .grid .grid__sm-mg {
        margin: 0
    }
    .grid .grid__md-one-second {
        float: left;
        width: 50%
    }
    .grid .grid__md-one-second--mg-xs {
        width: calc(50% - 2.5px)
    }
    .grid .grid__md-one-second--mg-xs:nth-of-type(2n - 1) {
        margin-right: 2.5px
    }
    .grid .grid__md-one-second--mg-xs:nth-of-type(2n) {
        margin-left: 2.5px
    }
    .grid .grid__md-one-second--mg-sm {
        width: calc(50% - 10px)
    }
    .grid .grid__md-one-second--mg-sm:nth-of-type(2n - 1) {
        margin-right: 10px
    }
    .grid .grid__md-one-second--mg-sm:nth-of-type(2n) {
        margin-left: 10px
    }
    .grid .grid__md-one-second--mg {
        width: calc(50% - 20px)
    }
    .grid .grid__md-one-second--mg:nth-of-type(2n - 1) {
        margin-right: 20px
    }
    .grid .grid__md-one-second--mg:nth-of-type(2n) {
        margin-left: 20px
    }
    .grid .grid__md-one-second--mg-lg {
        width: calc(50% - 50px)
    }
    .grid .grid__md-one-second--mg-lg:nth-of-type(2n - 1) {
        margin-right: 50px
    }
    .grid .grid__md-one-second--mg-lg:nth-of-type(2n) {
        margin-left: 50px
    }
    .grid .grid__md-one-third {
        float: left;
        width: 33.3333%
    }
    .grid .grid__md-one-third.grid__md-one-third--mg {
        width: calc(33.3333% - 12px)
    }
    .grid .grid__md-one-third.grid__md-one-third--mg:nth-of-type(3n - 2) {
        margin-right: 12px
    }
    .grid .grid__md-one-third.grid__md-one-third--mg:nth-of-type(3n - 1) {
        margin-left: 6px;
        margin-right: 6px
    }
    .grid .grid__md-one-third.grid__md-one-third--mg:nth-of-type(3n) {
        margin-left: 12px
    }
    .grid .grid__md-one-fourth {
        float: left;
        width: 25%
    }
    .grid .grid__md-one-fourth--mg {
        width: calc(25% - 15px)
    }
    .grid .grid__md-one-fourth--mg:nth-of-type(4n - 3) {
        margin-right: 15px
    }
    .grid .grid__md-one-fourth--mg:nth-of-type(4n - 1),
    .grid .grid__md-one-fourth--mg:nth-of-type(4n - 2) {
        margin-left: 7.5px;
        margin-right: 7.5px
    }
    .grid .grid__md-one-fourth--mg:nth-of-type(4n) {
        margin-left: 15px
    }
    .grid .grid__md-one-long-one-short {
        float: left
    }
    .grid .grid__md-one-long-one-short:nth-of-type(2n - 1) {
        width: calc(100% - 50px - 15px * 2);
        margin-right: 15px
    }
    .grid .grid__md-one-long-one-short:nth-of-type(2n) {
        margin-left: 15px;
        width: 50px
    }
    .grid .grid__md-one-third-and-two-third {
        float: left
    }
    .grid .grid__md-one-third-and-two-third:nth-of-type(2n - 1) {
        width: 35%
    }
    .grid .grid__md-one-third-and-two-third:nth-of-type(2n) {
        width: 65%
    }
    .grid .grid__md-one-third-and-two-third--mg:nth-of-type(2n - 1) {
        width: calc(35% - 40px);
        margin-right: 40px
    }
    .grid .grid__md-one-third-and-two-third--mg:nth-of-type(2n) {
        width: calc(65% - 40px);
        margin-left: 40px
    }
    .grid .grid__md-one-third-and-two-third--mg--bd-line:nth-of-type(2n - 1) {
        padding-bottom: 0;
        width: 35%;
        margin-right: 0;
        padding-right: 40px;
        border-right-width: 0px;
        border-right-style: solid;
        border-right-color: #a1a1a1;
        border-bottom-style: none
    }
    .grid .grid__standard {
        position: relative;
        margin-top: 40px
    }
    .grid .grid__standard--left {
        float: left;
        width: calc(68.3333%);
        padding-right: 30px;
        border-right: 1px solid #d2d2d2
    }
    .grid .grid__standard--right {
        float: left;
        width: calc(31.6667%);
        padding-left: 30px;
        margin-left: -1px;
        border-left: 1px solid #d2d2d2
    }
}
.hover-event--hover-dark {
    color: #fff
}

.hover-event--hover-dark::before {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background-color: #000;
    opacity: 0;
    -webkit-transition: opacity .25s ease-out;
    transition: opacity .25s ease-out
}

.hover-event--hover-dark:hover::before {
    opacity: .7
}

.hover-event--hover-show .hover-event--hover-show__hover-show-target {
    opacity: 0;
    -webkit-transition: opacity .25s ease-out;
    transition: opacity .25s ease-out;
    z-index: 1
}

.hover-event--hover-show:hover .hover-event--hover-show__hover-show-target {
    opacity: 1
}

.hover-event--hover-mg::before {
    width: calc(100% - 17px * 2);
    height: calc(100% - 12px * 2);
    margin: 12px 17px
}

.hover-event--hover-video-play-highlight .hover-event--hover-video-play-highlight__icon {
    -webkit-transition: opacity .25s ease-out;
    transition: opacity .25s ease-out;
    opacity: .4;
    z-index: 1
}

.hover-event--hover-video-play-highlight:hover .hover-event--hover-video-play-highlight__icon {
    opacity: 1
}

.hover-event--bg-pink:hover {
    background-color: #fdf3f2
}

.hover-event--bg-red:hover {
    background-color: #C32B07
}

.hover-event--bg-dark-red:hover {
    background-color: #ad1400
}

.hover-event--target-red:hover .hover-event--target-red__target {
    color: #C32B07
}

.hover-event--target-underline:hover .hover-event--target-underline__target {
    text-decoration: underline
}

.sticker a,
.tag--gray a,
.tag--red a,
.tag--white a {
    text-decoration: none
}

hr {
    border-top-width: 1px;
    border-top-style: solid;
    border-top-color: #262729
}

hr.dotted {
    border-top-style: dotted
}

@media screen {
    .icon {
        display: inline-block;
        background-repeat: no-repeat;
        background-position: center center
    }
    .icon--size--ml {
        max-width: 60px;
        max-height: 60px
    }
    .icon--size--lg {
        max-width: 120px;
        max-height: 120px
    }
    .icon--logo {
        width: 120px;
        height: 20px;
        background-size: 120px 20px;
        background-image: url(../images/logo/logo_01.svg)
    }
    .icon--close,
    .icon--global,
    .icon--menu,
    .icon--search {
        width: 20px;
        height: 20px;
        background-size: 20px 20px
    }
    .icon--global {
        background-image: url(../images/header/global.png)
    }
    .icon--global--black {
        background-image: url(../images/header/global-black.svg)
    }
    .icon--search {
        background-image: url(../images/header/search-gray.svg);
        margin-top: 3px;
    }
    .icon--search--black {
        background-image: url(../images/header/search-black.svg)
    }
    .icon--search--white {
        background-image: url(../images/header/search-white.svg)
    }
    .icon--menu {
        background-image: url(../images/header/menu-gray.svg)
    }
    .icon--menu--black {
        background-image: url(../images/header/menu-black.svg)
    }
    .icon--close {
        background-image: url(../images/header/close-gray.svg)
    }
    .icon--close--black {
        background-image: url(../images/header/close-black.svg)
    }
    .icon--close--white {
        background-image: url(../images/header/close-white.svg)
    }
    .icon--target {
        width: 54px;
        height: 54px;
        background-size: 54px 54px
    }
    .icon--target--small {
        width: 20px;
        height: 20px;
        background-size: 20px 20px
    }
    .icon--target--white {
        background-image: url(../images/items/target-white.svg)
    }
    .icon--target--orange {
        background-image: url(../images/items/target-orange.svg)
    }
    .icon--target--red {
        background-image: url(../images/items/target-red.svg)
    }
    .icon--stack {
        width: 54px;
        height: 54px;
        background-size: 54px 54px
    }
    .icon--stack--small {
        width: 20px;
        height: 20px;
        background-size: 20px 20px
    }
    .icon--stack--white {
        background-image: url(../images/items/stack-white.svg)
    }
    .icon--stack--orange {
        background-image: url(../images/items/stack-orange.svg)
    }
    .icon--stack--red {
        background-image: url(../images/items/stack-red.svg)
    }
    .icon--question {
        width: 54px;
        height: 54px;
        background-size: 54px 54px
    }
    .icon--question--small {
        width: 20px;
        height: 20px;
        background-size: 20px 20px
    }
    .icon--question--white {
        background-image: url(../images/items/question-white.svg)
    }
    .icon--question--orange {
        background-image: url(../images/items/question-orange.svg)
    }
    .icon--question--red {
        background-image: url(../images/items/question-red.svg)
    }
    .icon--cart {
        width: 54px;
        height: 54px;
        background-size: 54px 54px
    }
    .icon--cart--small {
        width: 20px;
        height: 20px;
        background-size: 20px 20px
    }
    .icon--cart--white {
        background-image: url(../images/items/cart-white.svg)
    }
    .icon--cart--orange {
        background-image: url(../images/items/cart-orange.svg)
    }
    .icon--cart--red {
        background-image: url(../images/items/cart-red.svg)
    }
    .icon--moldex-m {
        width: 54px;
        height: 54px;
        background-size: 54px 54px
    }
    .icon--moldex-m--small {
        width: 20px;
        height: 20px;
        background-size: 20px 20px
    }
    .icon--moldex-m--white {
        background-image: url(../images/items/moldex-m-white.svg)
    }
    .icon--moldex-m--orange {
        background-image: url(../images/items/moldex-m-orange.svg)
    }
    .icon--moldex-m--red {
        background-image: url(../images/items/moldex-m-red.svg)
    }
    .icon--ink {
        width: 54px;
        height: 54px;
        background-size: 54px 54px
    }
    .icon--ink--white {
        background-image: url(../images/items/ink-white.svg)
    }
    .icon--ink--red {
        background-image: url(../images/items/ink-red.svg)
    }
    .icon--swing {
        width: 54px;
        height: 40px;
        background-size: 54px 40px
    }
    .icon--swing--white {
        background-image: url(../images/items/swing-white.svg)
    }
    .icon--swing--red {
        background-image: url(../images/items/swing-red.svg)
    }
    .icon--one-to-two {
        width: 54px;
        height: 54px;
        background-size: 54px 54px
    }
    .icon--one-to-two--white {
        background-image: url(../images/items/one-to-two-white.svg)
    }
    .icon--one-to-two--red {
        background-image: url(../images/items/one-to-two-red.svg)
    }
    .icon--nine-square {
        width: 13px;
        height: 13px;
        background-size: 13px 13px
    }
    .icon--nine-square--red {
        background-image: url(../images/nine-square-red.svg)
    }
    .icon--nine-square--orange {
        background-image: url(../images/nine-square-orange.svg)
    }
    .icon--arrow-down {
        width: 21px;
        height: 13px;
        background-size: 21px 13px
    }
    .icon--arrow-down--white {
        background-image: url(../images/arrow/down-white.svg)
    }
    .icon--arrow-down--orange {
        background-image: url(../images/arrow/down-orange.svg)
    }
    .icon--arrow-down--red {
        background-image: url(../images/arrow/down-red.svg)
    }
    .icon--arrow-down--black {
        background-image: url(../images/arrow/down-black.svg)
    }
    .icon--arrow-down--sm {
        width: 14px;
        height: 9px;
        background-size: 14px 9px
    }
    .icon--arrow-down--lg {
        width: 28px;
        height: 18px;
        background-size: 28px 18px
    }
    .icon--arrow-up {
        width: 21px;
        height: 13px;
        background-size: 21px 13px
    }
    .icon--arrow-up--white {
        background-image: url(../images/arrow/arrow-up-white.svg)
    }
    .icon--arrow-up--orange {
        -webkit-transform: rotateZ(180deg);
        transform: rotateZ(180deg);
        background-image: url(../images/arrow/down-orange.svg)
    }
    .icon--arrow-up--red {
        -webkit-transform: rotateZ(180deg);
        transform: rotateZ(180deg);
        background-image: url(../images/arrow/down-red.svg)
    }
    .icon--arrow-up--sm {
        width: 14px;
        height: 9px;
        background-size: 14px 9px
    }
    .icon--arrow-up--lg {
        width: 28px;
        height: 18px;
        background-size: 28px 18px
    }
    .icon--arrow-left,
    .icon--arrow-right {
        width: 8px;
        height: 10px;
        background-size: 8px 10px
    }
    .icon--arrow-right--white {
        background-image: url(../images/arrow/right-white.svg)
    }
    .icon--arrow-right--black {
        background-image: url(../images/arrow/right-black.svg)
    }
    .icon--arrow-right--red {
        background-image: url(../images/arrow/right-red.svg)
    }
    .icon--arrow-right--orange {
        background-image: url(../images/arrow/right-orange.svg)
    }
    .icon--arrow-left--white {
        background-image: url(../images/arrow/left-white.svg)
    }
    .icon--arrow-left--black {
        background-image: url(../images/arrow/left-black.svg)
    }
    .icon--arrow-left--red {
        background-image: url(../images/arrow/left-red.svg)
    }
    .icon--square-angle-arrow-left,
    .icon--square-angle-arrow-right {
        width: 8px;
        height: 11px;
        background-size: 8px 11px;
        background-image: url(../images/arrow/square-angle-right-gray.svg)
    }
    .icon--square-angle-arrow-left {
        -webkit-transform: rotateZ(180deg);
        transform: rotateZ(180deg)
    }
    .icon--arrow-mountain-up--red {
        width: 38px;
        height: 19px;
        background-size: 38px 19px;
        background-image: url(../images/arrow/arrow-mountain-up-red.svg)
    }
    .icon--facebook--white,
    .icon--google--white,
    .icon--linkin--white,
    .icon--rss--white,
    .icon--twitter--white,
    .icon--youtube--white {
        width: 25px;
        height: 25px;
        background-size: 25px 25px
    }
    .icon--facebook--white {
        background-image: url(../images/social/facebook-white.svg)
    }
    .icon--twitter--white {
        background-image: url(../images/social/twitter-white.svg)
    }
    .icon--google--white {
        background-image: url(../images/social/google-white.svg)
    }
    .icon--linkin--white {
        background-image: url(../images/social/linkin-white.svg)
    }
    .icon--youtube--white {
        background-image: url(../images/social/youtube-white.svg)
    }
    .icon--rss--white {
        background-image: url(../images/social/rss-white.svg)
    }
    .icon--filter {
        width: 15px;
        height: 20px;
        background-size: 15px 20px
    }
    .icon--filter--red {
        background-image: url(../images/aside/filter-red.svg)
    }
    .icon--tag {
        width: 19px;
        height: 19px;
        background-size: 19px 19px
    }
    .icon--tag--red {
        background-image: url(../images/aside/tag-red.svg)
    }
    .icon--plus {
        width: 13px;
        height: 13px;
        background-size: 13px 13px
    }
    .icon--plus--red {
        background-image: url(../images/aside/plus-red.svg)
    }
    .icon--minus {
        width: 13px;
        height: 3px;
        background-size: 13px 3px
    }
    .icon--minus--red {
        background-image: url(../images/aside/minus-red.svg)
    }
    .icon--house {
        width: 15px;
        height: 20px;
        background-size: 15px 20px
    }
    .icon--house--red {
        background-image: url(../images/house-red.svg)
    }
    .icon--top-bar-close {
        width: 22px;
        height: 22px;
        background-size: 22px 22px;
        background-image: url(../images/header/bar-close-white.svg)
    }
    .icon--pdf {
        width: 20px;
        height: 23px;
        background-size: 20px 23px;
        background-image: url(../images/pdf-black.svg)
    }
    .icon--pdf--red {
        background-image: url(../images/pdf-red.svg)
    }
    .icon--video-camera {
        width: 24px;
        height: 22px;
        background-size: 24px 15px;
        background-image: url(../images/video-camera-black.svg)
    }
    .icon--paper {
        width: 22px;
        height: 22px;
        background-size: 22px 22px;
        background-image: url(../images/paper-black.svg)
    }
    .icon--paper--sm {
        width: 12px;
        height: 12px;
        background-size: 12px 12px
    }
    .icon--paper--red {
        background-image: url(../images/paper-red.svg)
    }
    .icon--video-play {
        width: 51px;
        height: 51px;
        background-size: 51px 51px
    }
    .icon--video-play--white {
        background-image: url(../images/video-play-white.svg)
    }
    .icon--new-tab {
        width: 54px;
        height: 53px;
        background-size: 54px 53px
    }
    .icon--new-tab--white {
        background-image: url(../images/new-tab-white.svg)
    }
    .icon--q {
        width: 15px;
        height: 21px;
        background-size: 15px 21px;
        background-image: url(../images/q-red.svg)
    }
    .icon--envelop {
        width: 56px;
        height: 40px;
        background-size: 56px 40px
    }
    .icon--envelop--red {
        background-image: url(../images/items/envelop-red.svg)
    }
    .icon--envelop--white {
        background-image: url(../images/items/envelop-white.svg)
    }
    .icon--fixed-bar-contact {
        width: 46px;
        height: 176px;
        background-size: 46px 176px;
        background-image: url(../images/aside/fixed-bar-contact.png)
    }
    .icon--cloud-download {
        width: 40px;
        height: 32px;
        background-size: 40px 32px
    }
    .icon--cloud-download--red {
        background-image: url(../images/cloud-download-red.svg)
    }
    .icon--write-paper {
        width: 29px;
        height: 30px;
        background-size: 29px 30px
    }
    .icon--write-paper--red {
        background-image: url(../images/write-paper-red.svg)
    }
    .icon--earth {
        width: 29px;
        height: 29px;
        background-size: 29px 29px
    }
    .icon--earth--red {
        background-image: url(../images/earth-red.svg)
    }
    .icon--arrow-right-circle {
        width: 19px;
        height: 19px;
        background-size: 19px 19px
    }
    .icon--arrow-right-circle--red {
        background-image: url(../images/arrow/right-circle-red.svg)
    }
    .icon--pen-paper-bulb {
        width: 59px;
        height: 66px;
        background-size: 59px 66px
    }
    .icon--pen-paper-bulb--red {
        background-image: url(../images/pen-paper-bulb-red.svg)
    }
    .icon--calendar-clock {
        width: 63px;
        height: 66px;
        background-size: 63px 66px
    }
    .icon--calendar-clock--orange {
        background-image: url(../images/calendar-clock-orange.svg)
    }
    .icon--timer {
        width: 94px;
        height: 97px;
        background-size: 94px 97px
    }
    .icon--timer--white {
        background-image: url(../images/timer-white.svg)
    }
    .icon--bulb {
        width: 92px;
        height: 94px;
        background-size: 92px 94px
    }
    .icon--bulb--white {
        background-image: url(../images/bulb-white.svg)
    }
    .icon--machine {
        width: 116px;
        height: 100px;
        background-size: 116px 100px
    }
    .icon--machine--white {
        background-image: url(../images/machine-white.svg)
    }
    .icon--analyze {
        width: 91px;
        height: 96px;
        background-size: 91px 96px
    }
    .icon--analyze--white {
        background-image: url(../images/analyze-white.svg)
    }
}

.figure-small,
.r15-iframe,
img {
    max-width: 100%
}

@media screen and (min-width:1200px) {
    .icon--logo {
        width: 168px;
        height: 27px;
        background-size: 168px 27px
    }
}

@media screen {
    .list--marquee .list--marquee__time,
    .list--table {
        font-size: 14px
    }
    .list {
        line-height: 26px
    }
    .list--square {
        -webkit-padding-start: 28px
    }
    .list--square li,
    .list--square--self {
        position: relative
    }
    .list--square li::before,
    .list--square--self::before {
        position: absolute;
        left: 0;
        content: '▪ ';
        color: #C32B07
    }
    .list--circle li::before,
    .list--circle ul li::before,
    .list--circle--self::before,
    .list--square ul li::before {
        left: 0;
        content: '• ';
        color: #C32B07
    }
    .list--square li::before {
        margin-left: -15px
    }
    .list--square--self::before {
        margin-left: 10px
    }
    .list--square ul {
        -webkit-padding-start: 10px
    }
    .list--square ul li {
        position: relative
    }
    .list--square ul li::before {
        position: absolute;
        margin-left: -15px
    }
    .list--circle {
        -webkit-padding-start: 28px
    }
    .list--circle li,
    .list--circle--self {
        position: relative
    }
    .list--circle li::before,
    .list--circle--self::before {
        position: absolute
    }
    .list--circle li::before {
        margin-left: -15px
    }
    .list--circle--self::before {
        margin-left: 10px
    }
    .list--circle ul {
        -webkit-padding-start: 10px
    }
    .list--circle ul li {
        position: relative
    }
    .list--circle ul li::before {
        position: absolute;
        margin-left: -15px
    }
    .list--table {
        line-height: 24px
    }
    .list--table .list--table__thead {
        display: none
    }
    .list--table > li {
        padding: 12px 0;
        border-top: 1px dotted #ededed
    }
    .list--table > li li {
        margin: 2px 0
    }
    .list--marquee {
        padding: 7px 0
    }
    .list--marquee a {
        color: #fff
    }
    .list--marquee .list--marquee__li {
        padding: 5px 0
    }
    .list--tab-list > li {
        position: relative;
        margin-top: 10px;
        padding-bottom: 10px;
        padding-left: 30px;
        font-size: 13px;
        border-bottom-width: 1px;
        border-bottom-style: dotted;
        border-bottom-color: #e6e6e6
    }
    .list--tab-list > li::before {
        content: '●';
        position: absolute;
        left: 10px;
        top: 0
    }
    .list--tab-list--red > li::before {
        color: #C32B07
    }
    .list--tab-list--orange > li::before {
        color: #ed8500
    }
    .see-all-target {
        -webkit-transition: max-height 4s linear;
        transition: max-height 4s linear;
        overflow: hidden
    }
    .see-all-target.active {
        max-height: 3000px
    }
    .brick-list {
        position: relative;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        display: -webkit-flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-justify-content: center;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        -webkit-flex-wrap: wrap
    }
    .brick-list::after {
        content: '';
        display: block;
        position: relative;
        clear: both
    }
    .brick-list li {
        text-align: center;
        margin: 15px 0;
        height: 140px;
        width: 145px;
        float: left
    }
    .brick-list li .icon {
        display: block;
        margin: 0 auto
    }
    .brick-list .brick-list__text {
        display: block;
        margin: 15px 0;
        font-size: 20px
    }
}

@media screen and (min-width:1200px) {
    .list--table .list--table__thead {
        display: block;
        background-color: #C32B07;
        color: #fff;
        text-align: center
    }
    .list--table > li {
        border-top: none
    }
    .list--table > li:not(.list--table__thead) {
        border-bottom: 1px dotted #ededed
    }
    .list--table > li:not(.list--table__thead) li {
        text-align: center
    }
    .list--table > li:not(.list--table__thead) li:nth-child(2) {
        text-align: left
    }
    .list--table > li:not(.list--table__thead):hover {
        background-color: #fdf3f2
    }
    .list--table > li ul::after {
        content: '';
        display: block;
        position: relative;
        clear: both
    }
    .list--table > li li {
        margin: 0;
        float: left;
        padding: 0 5px
    }
    .list--table > li li:nth-child(1) {
        width: 18%;
        text-align: left;
    }
    .list--table > li li:nth-child(2) {
        width: 45%
    }
    .list--table > li li:nth-child(3) {
        width: 17%
    }
    .list--table > li li:nth-child(4) {
        width: 20%
    }
    .list--table > li li:nth-child(5) {
        display: none
    }
    .list--marquee .list--marquee__text {
        display: inline
    }
    .list--marquee .list--marquee__li {
        width: calc(100% - 50px);
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap
    }
    .list--marquee .list--marquee__arrow {
        position: absolute;
        right: 0;
        top: 0;
        height: 50px
    }
    .brick-list {
        position: relative;
        display: block
    }
    .brick-list li {
        margin: 25px 0;
        height: 120px;
        width: 195px;
        float: left
    }
}

@media screen {
    .map {
        height: 400px
    }
    .map .map__infowindow {
        width: 250px;
        min-height: 140px
    }
    .map .map__img-wrapper {
        text-align: center;
        width: 140px;
        margin: 15px auto
    }
    .map .map__title {
        font-size: 18px
    }
    .map .map__text {
        font-size: 14px
    }
}

@media screen and (min-width:1200px) {
    .map {
        height: 600px
    }
}

@media screen {
    .event-show-hide-detail .event-show-hide-detail__target {
        position: relative;
        overflow: hidden;
        -webkit-transition: max-height .6s cubic-bezier(.35, .53, 0, 1);
        transition: max-height .6s cubic-bezier(.35, .53, 0, 1);
        max-height: 0
    }
    .event-show-hide-detail.event-show-hide-detail--active .event-show-hide-detail__upside-down {
        -webkit-transform: rotateZ(180deg);
        transform: rotateZ(180deg)
    }
    .event-show-hide-detail.event-show-hide-detail--active .event-show-hide-detail__plus-icon-to-minus {
        background-image: url(../images/aside/minus-red.svg)
    }
    .table-expand-next-event--collapse .table-expand-next-event__minus-to-plus {
        width: 13px;
        height: 13px;
        background-size: 13px 13px;
        background-image: url(../images/aside/plus-red.svg)
    }
    .see-all-event .see-all-event__target {
        position: relative;
        overflow: hidden;
        -webkit-transition: max-height .6s cubic-bezier(.35, .53, 0, 1);
        transition: max-height .6s cubic-bezier(.35, .53, 0, 1)
    }
    .see-all-event .see-all-event__trigger .less-show {
        display: inline
    }
    .see-all-event .see-all-event__trigger .less-hide,
    .see-all-event--active .see-all-event__trigger .less-show {
        display: none
    }
    .see-all-event--active .see-all-event__trigger .less-hide {
        display: inline
    }
    .see-all-event--active .see-all-event__trigger .icon--arrow-down {
        -webkit-transform: rotateZ(180deg);
        transform: rotateZ(180deg)
    }
    .see-all-event .see-all-event__custom-height-1 {
        max-height: 290px
    }
    .see-all-event .see-all-event__custom-height-2 {
        max-height: 253px
    }
    .see-all-event .see-all-event__custom-height-3 {
        max-height: 64px
    }
}

.zui-pager {
    margin: 0 auto;
    display: table
}

.zui-pager--center {
    text-align: center
}

.zui-pager--right {
    text-align: right
}

.zui-pager .btn-group {
    list-style-type: none;
    margin: 0;
    padding: 0;
    display: inline-block
}

.zui-pager .btn-group__item {
    display: inline-block;
    padding: 0;
    width: 32px;
    height: 32px;
    line-height: 32px;
    float: left;
    background-color: transparent;
    text-align: center;
    margin: 4px;
    font-size: 14px
}

.zui-pager .btn-group__item__inside {
    display: inline-block;
    color: #C32B07;
    border-radius: 4px;
    border: 1px solid #b1b1b1
}

.zui-pager .btn-group__item__inside:not(.btn-group__dots):hover {
    background-color: #ededed
}

.zui-pager .btn-group .btn-group__current {
    background-color: #404040;
    color: #fff
}

.zui-pager .btn-group .btn-group__dots {
    border: none
}

.zui-pager__input {
    display: inline-block;
    vertical-align: top;
    margin-left: 10px
}

.zui-pager__input > input {
    width: 2em;
    padding: 10px;
    border: 1px solid #ccc;
    border-radius: 0;
    line-height: 1
}

.lazyload.lazyload--circle::before,
.photo--circle {
    border-radius: 50%
}

.zui-pager .i-chevron-left,
.zui-pager .i-chevron-right {
    margin: 12px;
    border-style: solid;
    border-color: #C32B07;
    width: 6px;
    height: 6px;
    display: block;
    cursor: pointer
}

.zui-pager .i-chevron-left {
    border-width: 1px 0 0 1px;
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg)
}

.zui-pager .i-chevron-right {
    border-width: 1px 1px 0 0;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg)
}

.i-caret-down {
    border-width: 3px;
    border-style: solid;
    border-color: #000 transparent transparent;
    position: absolute;
    top: 18px;
    right: 3px
}

.lazyload {
    position: relative
}

.lazyload::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: #efefef;
    z-index: 0;
    opacity: 0;
    -webkit-transition: opacity .3s ease-out;
    -webkit-transition-delay: 0s;
    transition: opacity .3s ease-out;
    transition-delay: 0s;
}

.lazyload[data-src]::before {
    opacity: 1
}

.photo {
    background-size: cover
}

.photo--bgs100 {
    background-size: 100%
}

.photo--bg-contain {
    background-size: contain
}

.photo--size-16-9 {
    padding-bottom: 56.25%
}

.photo--size-25-38 {
    padding-bottom: 65.78947368%
}

.photo--size-4-3 {
    padding-bottom: 75%
}

.figure-small {
    display: inline-block;
    width: 300px;
    margin-top: 10px;
    margin-bottom: 10px
}

.figure-small img {
    width: 100%
}

.figure-small figcaption {
    font-size: 12px
}

.pillar {
    display: inline-block;
    width: 8px;
    height: 25px
}

.pillar.pillar--red {
    background-color: #C32B07
}

.pillar.pillar--orange {
    background-color: #ed8500
}

.r15-iframe {
    width: 100%;
    height: 315px
}

@media screen and (min-width:1200px) {
    .see-all-event .see-all-event__custom-height-1 {
        max-height: 340px
    }
    .see-all-event .see-all-event__custom-height-3 {
        max-height: 32px
    }
    .r15-group .r15-group__sub .r15-group__split {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        display: -webkit-flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-align-items: center
    }
    .r15-group .r15-group__sub .r15-group__split > .r15-group__split__children {
        float: left;
        width: calc(50% - 37.5px)
    }
    .r15-group .r15-group__sub:nth-of-type(2n - 1) .r15-group__split > .r15-group__split__children:nth-of-type(2n - 1) {
        margin-right: 37.5px
    }
    .r15-group .r15-group__sub:nth-of-type(2n - 1) .r15-group__split > .r15-group__split__children:nth-of-type(2n) {
        margin-left: 37.5px
    }
    .r15-group .r15-group__sub:nth-of-type(2n) .r15-group__split {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        display: -webkit-flex
    }
    .r15-group .r15-group__sub:nth-of-type(2n) .r15-group__split > .r15-group__split__children:nth-of-type(2n - 1) {
        -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
        order: 2;
        margin-left: 37.5px
    }
    .r15-group .r15-group__sub:nth-of-type(2n) .r15-group__split > .r15-group__split__children:nth-of-type(2n) {
        -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
        order: 1;
        margin-right: 37.5px
    }
    .r15-iframe {
        height: 560px
    }
}

.selectize-control.plugin-drag_drop.multi > .selectize-input > div.ui-sortable-placeholder {
    visibility: visible!important;
    background: #f2f2f2!important;
    background: rgba(0, 0, 0, .06)!important;
    border: 0!important;
    box-shadow: inset 0 0 12px 4px #fff
}

.selectize-control.plugin-drag_drop .ui-sortable-placeholder::after {
    content: '!';
    visibility: hidden
}

.selectize-control.plugin-drag_drop .ui-sortable-helper {
    box-shadow: 0 2px 5px rgba(0, 0, 0, .2)
}

.selectize-dropdown-header {
    position: relative;
    padding: 5px 8px;
    border-bottom: 1px solid #d0d0d0;
    background: #f8f8f8;
    border-radius: 3px 3px 0 0
}

.selectize-dropdown-header-close {
    position: absolute;
    right: 8px;
    top: 50%;
    color: #303030;
    opacity: .4;
    margin-top: -12px;
    line-height: 20px;
    font-size: 20px!important
}

.selectize-dropdown-header-close:hover {
    color: #000
}

.selectize-dropdown.plugin-optgroup_columns .optgroup {
    border-right: 1px solid #f2f2f2;
    border-top: 0 none;
    float: left;
    box-sizing: border-box
}

.selectize-dropdown.plugin-optgroup_columns .optgroup:last-child {
    border-right: 0 none
}

.selectize-dropdown.plugin-optgroup_columns .optgroup:before {
    display: none
}

.selectize-dropdown.plugin-optgroup_columns .optgroup-header {
    border-top: 0 none
}

.selectize-control.plugin-remove_button [data-value] {
    position: relative;
    padding-right: 24px!important
}

.selectize-control.plugin-remove_button [data-value] .remove {
    z-index: 1;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    width: 17px;
    text-align: center;
    font-weight: 700;
    font-size: 12px;
    color: inherit;
    text-decoration: none;
    vertical-align: middle;
    display: inline-block;
    padding: 2px 0 0;
    border-left: 1px solid #d0d0d0;
    border-radius: 0 2px 2px 0;
    box-sizing: border-box
}

.selectize-control.plugin-remove_button [data-value] .remove:hover {
    background: rgba(0, 0, 0, .05)
}

.selectize-control.plugin-remove_button [data-value].active .remove {
    border-left-color: #cacaca
}

.selectize-control.plugin-remove_button .disabled [data-value] .remove:hover {
    background: 0 0
}

.selectize-control.plugin-remove_button .disabled [data-value] .remove {
    border-left-color: #fff
}

.selectize-control.plugin-remove_button .remove-single {
    position: absolute;
    right: 28px;
    top: 6px;
    font-size: 23px
}

.selectize-control,
.selectize-input {
    position: relative
}

.selectize-control > .items {
    float: left
}

.selectize-control::after {
    content: '';
    display: block;
    position: relative;
    clear: both
}

.selectize-dropdown,
.selectize-input,
.selectize-input input {
    color: #303030;
    font-family: inherit;
    font-size: 13px;
    line-height: 18px;
    -webkit-font-smoothing: inherit
}

.selectize-control.single .selectize-input.input-active,
.selectize-input {
    background: #fff;
    cursor: text;
    display: inline-block
}

.selectize-input {
    border: 1px solid #d0d0d0;
    padding: 11px 14px;
    display: inline-block;
    width: 100%;
    overflow: hidden;
    z-index: 1;
    box-sizing: border-box;
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, .1);
    border-radius: 4px
}

.selectize-control.single .selectize-input.has-items {
    background-color: #fff;
    color: #000;
    height: 53px;
}

.selectize-control.multi .selectize-input.has-items {
    padding: 6px 8px 3px
}

.selectize-input.full,
.zui-pager .selectize-input.btn-group__item__inside {
    background-color: #fff
}

.selectize-input.disabled,
.selectize-input.disabled * {
    cursor: default!important
}

.selectize-input.focus {
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, .15)
}

.selectize-input.dropdown-active {
    border-radius: 3px 3px 0 0
}

.selectize-input > * {
    vertical-align: baseline;
    display: -moz-inline-stack;
    display: inline-block;
    zoom: 1
}

.selectize-control.multi .selectize-input > div {
    cursor: pointer;
    margin: 0 3px 3px 0;
    padding: 2px 6px;
    background: #f2f2f2;
    color: #303030;
    border: 0 solid #d0d0d0
}

.selectize-control.multi .selectize-input > div.active {
    background: #e8e8e8;
    color: #303030;
    border: 0 solid #cacaca
}

.selectize-control.multi .selectize-input.disabled > div,
.selectize-control.multi .selectize-input.disabled > div.active {
    color: #7d7d7d;
    background: #fff;
    border: 0 solid #fff
}

.selectize-input > input {
    display: inline-block!important;
    padding: 0!important;
    min-height: 0!important;
    max-height: none!important;
    max-width: 100%!important;
    margin: 0 2px 0 0!important;
    text-indent: 0!important;
    border: 0!important;
    background: 0 0!important;
    line-height: inherit!important;
    -webkit-user-select: auto!important;
    box-shadow: none!important
}

.selectize-input > input::-ms-clear {
    display: none
}

.selectize-control.single .selectize-input:after,
.selectize-input.dropdown-active::before,
.selectize-input::after {
    content: ' ';
    display: block
}

.selectize-input > input:focus {
    outline: 0!important
}

.selectize-input::after {
    clear: left
}

.selectize-input.dropdown-active::before {
    position: absolute;
    background: #f0f0f0;
    height: 1px;
    bottom: 0;
    left: 0;
    right: 0
}

.selectize-dropdown {
    position: absolute;
    z-index: 10;
    border: 1px solid #d0d0d0;
    background: #fff;
    margin: -1px 0 0;
    border-top: 0 none;
    box-sizing: border-box;
    box-shadow: 0 1px 3px rgba(0, 0, 0, .1);
    border-radius: 0 0 3px 3px
}

.selectize-dropdown [data-selectable] {
    cursor: pointer;
    overflow: hidden
}

.selectize-dropdown [data-selectable] .highlight {
    background: rgba(125, 168, 208, .2);
    border-radius: 1px
}

.selectize-dropdown .optgroup-header,
.selectize-dropdown [data-selectable] {
    padding: 8px 18px
}

.selectize-dropdown .optgroup:first-child .optgroup-header {
    border-top: 0 none
}

.selectize-dropdown .optgroup-header {
    color: #303030;
    background: #fff;
    cursor: default
}

.selectize-dropdown .active {
    background-color: #f5fafd;
    color: #c32b07
}

.selectize-dropdown .active.create {
    color: #c32b07
}

.selectize-dropdown .create {
    color: rgba(48, 48, 48, .5)
}

.selectize-dropdown-content {
    overflow-y: auto;
    overflow-x: hidden;
    max-height: 500px;
    -webkit-overflow-scrolling: touch
}

.selectize-control.single .selectize-input,
.selectize-control.single .selectize-input input {
    cursor: pointer
}

.selectize-control.single .selectize-input.input-active,
.selectize-control.single .selectize-input.input-active input {
    cursor: text
}

.selectize-control.single .selectize-input:after {
    position: absolute;
    top: 50%;
    right: 15px;
    margin-top: -3px;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 6px 6px 0;
    border-color: grey transparent transparent
}

.selectize-control.single .selectize-input.dropdown-active:after {
    margin-top: -4px;
    border-width: 0 6px 6px;
    border-color: transparent transparent grey
}

.selectize-control.single .selectize-input.has-items:after {
    border-color: #000 transparent transparent
}

.selectize-control.single .selectize-input.has-items.dropdown-active:after {
    border-color: transparent transparent #fff
}

.selectize-control.rtl.single .selectize-input:after {
    left: 15px;
    right: auto
}

.selectize-control.rtl .selectize-input > input {
    margin: 0 4px 0 -2px!important
}

.selectize-control .selectize-input.disabled {
    opacity: .5;
    background-color: #fafafa
}

@media screen and (min-width:1200px) {
    .selectize-input {
        padding: 15px 18px
    }
}

@media screen {
    .jssora22l,
    .jssora22r,
    .slider-navi .bullet,
    .slider-navi .bullet:hover,
    .slider-navi .bulletav {
        background-repeat: no-repeat;
        background-position: center center;
        overflow: hidden;
        cursor: pointer
    }
    .slider-wrapper {
        position: relative
    }
    .slider-wrapper .slider-wrapper--text {
        position: absolute;
        width: 100%;
        text-align: center;
        bottom: 0;
        color: #000;
        font-size: 24px
    }
    .jssor {
        position: relative;
        visibility: hidden
    }
    #slider {
        margin: 0 auto
    }
    #slider .jssor,
    #slider .slider-photos {
        height: 400px;
        width: 100%
    }
    #slider .slider-image {
        height: 100%
    }
    #industry_jssor {
        margin: 25px 0;
        padding-bottom: calc(100% + 100px)
    }
    #industry_jssor .jssor,
    #industry_jssor .slider-photos {
        padding-bottom: calc(100% + 100px);
        width: 100%
    }
    #industry_jssor .slider-image {
        padding-bottom: 100%
    }
    #sponsor_jssor {
        padding-bottom: 25%
    }
    #sponsor_jssor .jssor,
    #sponsor_jssor .slider-photos {
        padding-bottom: 25%;
        width: 100%
    }
    #sponsor_jssor .slider-image {
        width: 70%;
        padding-bottom: 25%;
        margin: 0 auto
    }
    .r15-slider {
        position: relative;
        height: 320px
    }
    .r15-slider .jssor,
    .r15-slider .slider-photos {
        height: 320px;
        width: 100%;
        padding-bottom: 70px
    }
    .r15-slider .slider-image {
        height: 250px
    }
    .r15-slider a {
        text-decoration: none
    }
    .r15-slider .r15-slider__text {
        display: block;
        margin-bottom: 15px;
        text-align: center;
        color: #000;
        font-size: 22px
    }
    .jssora22l,
    .jssora22r {
        display: block;
        position: absolute;
        width: 15px;
        height: 25px;
        background-size: 15px 25px;
        top: calc(50% - 25px / 2)!important;
        z-index: 1
    }
    .jssora22l {
        left: 0;
        background-image: url(../images/slider/left-gray.svg)
    }
    .jssora22r {
        right: 0;
        background-image: url(../images/slider/right-gray.svg)
    }
    .slider-navi {
        position: absolute;
        bottom: 0
    }
    .slider-navi .bullet,
    .slider-navi .bullet:hover,
    .slider-navi .bulletav {
        position: absolute;
        width: 8px;
        height: 8px;
        background-size: 8px 8px;
        background-image: url(../images/slider/slider-bullet.svg)
    }
    .slider-navi .bullet:hover,
    .slider-navi .bulletav,
    .slider-navi .bulletav:hover {
        background-image: url(../images/slider/slider-bullet-active.svg)
    }
}

@media screen and (min-width:1200px) {
    #slider .jssor,
    #slider .slider-photos {
        height: 600px
    }
    #industry_jssor {
        margin: 50px 0;
        padding-bottom: 25%
    }
    #industry_jssor .jssor,
    #industry_jssor .slider-photos {
        padding-bottom: calc(25% + 75px)
    }
    #sponsor_jssor,
    #sponsor_jssor .jssor {
        padding-bottom: 4.17%
    }
    #sponsor_jssor {
        margin: 50px 0
    }
    #sponsor_jssor .slider-photos {
        padding-bottom: 4.17%;
        width: calc(100% - 40px);
        left: 20px
    }
    #sponsor_jssor .slider-image {
        width: 100%;
        padding-bottom: 31.25%
    }
}

.sticker {
    background-color: #d9d9d9;
    height: 90px;
    overflow: hidden;
    margin-bottom: 5px
}

.sticker a {
    color: #000
}

.sticker .sticker__text {
    font-size: 24px
}

.sticker:hover {
    background-color: #fff
}

.sticker--large {
    height: 280px
}

.sticker--medium {
    height: 137.5px
}

.sticker--red {
    border-left: 8px solid #C32B07
}

.sticker--red .sticker__text,
.tabs .tabs__theme-red,
.tabs .tabs__theme-red a {
    color: #C32B07
}

.tabs .tabs__theme-orange,
.tabs .tabs__theme-orange a {
    color: #ed8500
}

.tabs .tabs__active.tabs__theme-orange,
.tabs .tabs__active.tabs__theme-orange a,
.tabs .tabs__active.tabs__theme-red,
.tabs .tabs__active.tabs__theme-red a {
    color: #fff
}

.tabs .tabs__title {
    font-size: 18px
}

.tabs .tabs__tab .tabs__tab__ul {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    display: -webkit-flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    border-top: 2px solid #e5e5e5;
    border-bottom: 1px solid #e5e5e5
}

.tabs .tabs__tab li {
    position: relative;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    height: 50px;
    line-height: 50px;
    text-align: center
}

.tabs .tabs__tab li a {
    display: block;
    width: 100%;
    height: inherit;
    line-height: inherit
}

.tabs .tabs__tab li.tabs__active .tabs__tab__icon {
    width: 10px;
    height: 8px;
    background-size: 10px 8px;
    background-image: url(../images/arrow/down-white.svg)
}

.tabs .tabs__active.tabs__theme-red {
    background-color: #C32B07
}

.tabs .tabs__active.tabs__theme-orange {
    background-color: #ed8500
}

.tabs .tabs__content {
    position: relative
}

.tabs .tabs__content .tabs__content__li {
    width: 100%;
    position: absolute;
    top: 0;
    opacity: 0;
    visibility: hidden;
    -webkit-transition: opacity .3s ease-out, visibility 0s ease-out .3s;
    transition: opacity .3s ease-out, visibility 0s ease-out .3s
}

.tabs .tabs__content .tabs__content__li.tabs__active {
    opacity: 1;
    visibility: visible;
    -webkit-transition: opacity .3s ease-out .2s, visibility 0s ease-out .2s;
    transition: opacity .3s ease-out .2s, visibility 0s ease-out .2s
}

.table--default {
    white-space: nowrap
}

.table--default > thead {
    background-color: #C32B07;
    color: #fff
}

.table--default > thead th {
    padding: 0 14px;
    height: 48px
}

.table--default .table--default__theme-gray {
    background-color: #c9c9c9;
    color: #000
}

.table--default .table--default__theme-lightgray {
    background-color: #efefef;
    color: #000
}

.table--default > tbody tr {
    background-color: #fff;
    height: 38px
}

.table--default > tbody td {
    padding: 0 14px;
    font-size: 14px
}

.table--gray-each-2-tr > tbody > tr:nth-child(2n) {
    background-color: #f6f6f6
}

.table--bd-default {
    background-color: #bcbcbc
}

.table--td-tac-after-2nd td {
    text-align: center
}

.table--td-tac-after-2nd td:first-child {
    text-align: left
}

.table--custom-width--41111 > thead th:first-child {
    width: 41.66666667%
}

.table--custom-width--41111 > thead th:nth-child(n + 2) {
    width: 14.58333333%
}

.table--custom-width--123 > thead th:first-child {
    width: 16.66666667%
}

.table--custom-width--123 > thead th:nth-child(2) {
    width: 33.33333333%
}

.table--custom-width--123 > thead th:last-child {
    width: 50%
}

.table--custom-width--15 > thead th:first-child {
    width: 16.66666667%
}

.table--custom-width--15 > thead th:last-child {
    width: 83.33333333%
}

.tag {
    display: inline-block;
    padding: 3px 12px
}

.tag--sm {
    padding: 0 8px;
    line-height: 22px
}

.tag--md {
    padding: 6px 15px
}

.tag--rad {
    border-radius: 4px
}

.tag--rad-round {
    border-radius: 20px
}

.tag--white {
    background-color: #fff;
    color: #000
}

.tag--white a {
    color: #000
}

.tag--red {
    background-color: #C32B07;
    color: #fff
}

.tag--red a {
    color: #fff
}

.tag--gray {
    background-color: grey;
    color: #fff
}

.tag--gray a {
    color: #fff
}

.text--black,
.text--black--a a {
    color: #000
}

.text--red {
    color: #C32B07
}

.text--orange {
    color: #ed8500
}

.text--gray {
    color: #a0a0a0
}

.text--white {
    color: #fff
}

.text--bold {
    font-weight: 700
}

.text--sm {
    font-size: 14px
}

.text--hover--red:hover {
    color: #C32B07
}

.text--hover--underline:hover {
    text-decoration: underline
}

.text--size-charset {
    width: 23px;
    height: 23px;
    line-height: 23px;
    background-color: #e5e5e5;
    color: #000;
    text-decoration: none;
    display: inline-block;
    text-align: center;
    font-size: 14px;
    letter-spacing: 0
}

.text--size-charset.active,
.text--size-charset:active,
.text--size-charset:focus,
.text--size-charset:hover {
    color: #fff;
    background-color: #fa6719
}

.text--size-charset + .text--size-charset {
    margin-left: 7px
}

.theme-black {
    color: #fff;
    background-color: #000
}

.r15-group .r15-group__sub:nth-of-type(2n),
.theme-white {
    color: #000;
    background-color: #fff
}

.theme-red {
    color: #fff;
    background-color: #C32B07
}

.theme-orange {
    color: #fff;
    background-color: #ed8500
}

.theme-lightgray-2 {
    color: #000;
    background-color: #fafafa
}

.r15-group .r15-group__sub:nth-of-type(2n - 1),
.theme-lightgray {
    color: #000;
    background-color: #f7f8fa
}

.theme-lightgray-3 {
    color: #000;
    background-color: #eeeff1
}

.theme-gray-2 {
    color: #000;
    background-color: #c6cacd
}

.theme-gray {
    color: #fff;
    background-color: #414141
}

.theme-darkgray {
    color: #fff;
    background-color: #2d2d2d
}

.theme-purple {
    background-color: #2b1730;
    color: #fff
}

.theme-mask {
    background-color: rgba(0, 0, 0, .65)
}

.theme-sticker .theme-sticker__text {
    color: #000;
    margin: 10px 0 0;
    line-height: 22px;
    font-size: 16px;
    overflow: hidden
}
/* 移除p標籤的容器高度
.theme-sticker .theme-sticker__text {
    height: 44px;
}
*/
.professional-padding30{
    padding-top: 30px;
    padding-bottom: 30px;
}

@media screen {
    .theme-index-custom-darkular .theme-index-custom-darkular__h3 {
        font-size: 24px;
        margin: 0 0 10px
    }
    .theme-index-custom-darkular .theme-index-custom-darkular__small {
        display: none
    }
    .theme-index-custom-darkular .theme-index-custom-darkular__button {
        width: 142px;
        height: 36px;
        font-size: 12px
    }
    .theme-custom-same-height__item {
        height: 42px
    }
}

@media screen and (min-width:1200px) {
    .theme-index-custom-darkular .theme-index-custom-darkular__h3 {
        font-size: 28px;
        margin: 0
    }
    .theme-index-custom-darkular .theme-index-custom-darkular__small {
        margin: 5px 0 15px;
        font-size: 14px;
        display: block
    }
    .theme-index-custom-darkular .theme-index-custom-darkular__button {
        width: 236px;
        height: 38px;
        font-size: 18px
    }
    .theme-index-custom-darkular .theme-index-custom-darkular__height {
        height: 190px
    }
    .theme-custom-same-height__item {
        height: 50px
    }
}

@media screen {
    .title--gray {
        background-color: #efefef;
        border-radius: 4px;
        color: #000
    }
    .title--red {
        background-color: #C32B07;
        border-radius: 4px;
        color: #fff
    }
    .title--with-1-icon {
        display: inline-block;
        width: calc(100% - 20px)
    }
    .title--with-2-icons {
        display: inline-block;
        width: calc(100% - 40px)
    }
    .title .title__main-title {
        font-size: 24px
    }
    .title .title__wrapper .title__wrapper__sm-left {
        padding-right: 15px
    }
}

@media screen and (min-width:1200px) {
    .title .title__main-title {
        font-size: 36px;
        margin-bottom: 10px
    }
    .title .title__wrapper .title__wrapper__sm-left {
        width: 100%
    }
    .title .title__wrapper .title__wrapper__sm-right {
        width: 180px;
        padding-left: 15px;
        border-left-width: 1px;
        border-left-style: solid;
        border-left-color: #a1a1a1
    }
}