/* grayscale style start */
/*.indexVersion #body,
.indexVersion #footer,
.indexVersion .menuBtn,
.indexVersion .headerMenu,
.indexVersion .shareList,
.indexVersion #close_up {
    -webkit-filter: grayscale(100%) grayscale(100%) !important;
    -moz-filter: grayscale(100%) grayscale(100%) !important;
    filter: grayscale(100%) !important;
}*/
/* grayscale style ends */

/* remove these styles when location tags are ready { */

.indexVersion .myform .mySearch2+div {
    display: none;
}

.indexVersion .mySearch2ListSkin [data-type='tags'],
.fso_location .mySearch2ListSkin [data-type='tags'] {
    display: none;
}

.fso_location .data-list .border .header {
    display: none;
}

.fso_location .mfsResult .mypage_content .data-list .detail .title {
    margin-top: 0.5rem;
}

.fso_location .myTagFilter {
    display: none;
}

.fso_location .mDocTitleList .tags {
    display: none;
}

/* } */

html {
    font-size: 1rem;
}

body {
    font-family: IBMPlexSans, "Arial", "Helvetica", "sans-serif", "microsoft jhenghei";
    color: #212121;
    background-color: #fff;
}

body.chineseVersion {
    /*font-family: NotoSansHK;*/
}

html body {
    height: auto;
}


.container:before {}

.disnone {
    display: none !important;
}

@font-face {
    font-family: IBMPlexMono;
    src: local(IBMPlexMono-Regular),
        url(fonts/IBMPlexMono-Regular.ttf) format("truetype");
    font-weight: normal;
    font-style: normal;
    font-stretch: normal;
}

@font-face {
    font-family: IBMPlexMono;
    src: local(IBMPlexMono-Bold),
        url(fonts/IBMPlexMono-Bold.ttf) format("truetype");
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
}

@font-face {
    font-family: IBMPlexSans;
    src: local(IBMPlexSans-Light),
        url(fonts/IBMPlexSans-Light.ttf) format("truetype");
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
}

@font-face {
    font-family: IBMPlexSans;
    src: local(IBMPlexSans-Regular),
        url(fonts/IBMPlexSans-Regular.ttf) format("truetype");
    font-weight: normal;
    font-style: normal;
    font-stretch: normal;
}

@font-face {
    font-family: IBMPlexSans;
    src: local(IBMPlexSans-Bold),
        url(fonts/IBMPlexSans-Bold.ttf) format("truetype");
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
}

@font-face {
    font-family: openSans;
    src: local(OpenSans-Light),
        url(fonts/OpenSans-Light.ttf) format("truetype");
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
}

@font-face {
    font-family: openSans;
    src: local(OpenSans-Regular),
        url(fonts/OpenSans-Regular.ttf) format("truetype");
    font-weight: normal;
    font-style: normal;
    font-stretch: normal;
}

@font-face {
    font-family: openSans;
    src: local(OpenSans-Bold),
        url(fonts/OpenSans-Bold.ttf) format("truetype");
    font-weight: 700;
    font-style: normal;
    font-stretch: normal;
}

body p {
    margin: 0 0 1.2em 0;
}

body a {
    color: #000;
}

body.aniVersion a {
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

p a,
p a:link,
p a:active,
p a:visited {
    /*
        color: #7a03e2;
        text-decoration: underline;*/
}

.mainContent a {
    color: #282828;
    background-color: inherit;
    /*
        font-weight: 900*/
}

.mainContent p a {}

div.mainContent p,
div.mainContent li {}

.chineseVersion div.mainContent p,
.chineseVersion div.mainContent li {}

.mainContent a:active,
.mainContent a:hover,
.mainContent a:focus {
    color: #0d2e4a;
}

img,
svg {
    vertical-align: middle;
    /*max-width: none;*/
}

label {
    display: inline-block;
}

a:not([href]):not([class]),
a:not([href]):not([class]):hover {
    color: inherit;
    text-decoration: none;
}

* {
    -webkit-text-size-adjust: none;
    -ms-text-size-adjust: none;
    text-size-adjust: none;
}

*:before,
*:after {
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 100% auto;
}

input,
button,
select,
optgroup,
textarea {
    font-family: inherit;
    font-size: inherit;
    line-height: inherit;
}

button,
[type=button],
[type=reset],
[type=submit] {
    -webkit-appearance: button;
}

button:not(:disabled),
[type=button]:not(:disabled),
[type=reset]:not(:disabled),
[type=submit]:not(:disabled) {
    cursor: pointer;
}

.cursor-not-allowed {
    cursor: not-allowed;
}

.date {
    /*	color: #000000;
        font-weight: bold;*/
}

video {
    max-width: 100%;
}

iframe {
    max-width: 100%;
    border: 0;
}

.press_title {
    color: #000066;
}

.font_bold {
    font-weight: bold;
}

.float_center {
    text-align: center;
}

.font_underline {
    text-decoration: underline;
}

.caption {
    font-style: italic;
}

.font_italic {
    font-style: italic;
}

.float_right {
    float: right;
    padding: 0 0 1em 1em;
}

.float_left {
    float: left;
    padding: 0 1em 1em 0;
}

.img-cap {
    font-size: 7pt;
}

.center {
    margin: 0 auto;
}

.align-left {
    text-align: left;
}

.tt-up {
    text-transform: uppercase
}

/*.clear {
        clear: both;
        height: 5px;
    }*/
.clear:after {
    content: "";
    display: table;
    clear: both;
}

.note {
    font-size: 0.7778rem
}

.right {
    /*text-align: right !important;*/
}

.bodyArea {}


.bodyArea .heading5 {
    font-size: 2rem;
    margin-bottom: 1.5rem;
}

.mobileVersion .bodyArea {
    /*
        font-size: 1rem;*/
}

.highlightArea {
    /*
        font-size: 0.875rem;*/
}

/*.mainContent ol, .mainContent ul {
        margin-left: 1.5rem;
    }*/

.bodyArea .mainContent {
    /*	width: 1000px;
        max-width:105%;
        background-color: #f7f7f7;*/
    /*
        min-height: 280px;
        margin-right: auto;
        margin-left: auto;
        padding-bottom: 2.5rem;*/
}

.indexVersion h1 {
    visibility: hidden;
    height: 0;
    width: 0;
    margin: 0 !important;
}

.indexVersion .bodyArea .mainContent {
    min-height: 0;
}

.bodyArea .mainContent {
    /*    margin-left: 320px;*/
}

.bodyArea .mainContent .my_content {
    padding: 1.25rem 1.875rem;
}

body.indexVersion .mainContent {
    padding: 0 !important;
}

.bodyArea .headerMenu {
    /*	font-size: 15px;*/
}

.mainContent {
    /*
        line-height: 1.6em;
        font-size:1.2rem;*/
    color: #282828;
}

.mainContent p {
    text-align: left;
    margin: 0 0 1.4em 0;
}

.mainContent ul,
.mainContent ol {
    /*
        padding-left: 0.6em;*/
    margin-bottom: 1.4em;
}

.mainContent ul.upper-roman {
    list-style-type: upper-roman;
}

.mainContent ul.bold_header>li>div {
    font-weight: bold;
    color: #816243;
    margin-bottom: 1em;
}

.mainArea .myheading1,
.mainContent .myheading1 {
    font-size: 3.5555555555555555555555555555556rem;
    font-family: Open Sans, "Arial", "Helvetica", "sans-serif", "microsoft jhenghei";
    font-weight: 800;
    color: #2C4FBA;
    background-color: inherit;
    margin-top: 2.5rem;
    margin-bottom: 2.5rem;
    text-transform: uppercase;
    line-height: 1em;
}

.mainArea .myheading2,
.mainContent .myheading2 {
    font-size: 1.5555555555555555555555555555556rem;
    font-weight: lighter;
    margin-bottom: 1.25rem;
    background-color: inherit;
}

.mainArea .myheading3 {
    font-size: 1.7778rem;
    font-weight: bold;
}

.myheading .underHigh {
    position: relative;
    margin-bottom: 3.75rem
}

.myheading .underHigh:after {
    content: "";
    position: absolute;
    left: 0;
    bottom: -1.875rem;
    width: 111px;
    height: 1px;
    max-width: 100%;
    background-color: #707070;
}

.mainContent .myheading {
    margin-bottom: 3.75rem;
}

ol>li>ul {
    list-style-type: disc;
}

.panel-default>.panel-heading {
    color: #333;
    background-color: #fafafa;
    border-color: #ddd;
    height: 120px !important;
}

.micp {
    padding-left: 200px;
    padding-right: 200px;
}

/*=========header=========*/

body {
    /*	background-color: #fff;*/
}

body #wrap {
    width: 100%;
    margin-right: auto;
    margin-left: auto;
    overflow: hidden;
}

body.indexVersion #wrap {}

body.indexVersion .headerArea {}

body.fixCloseUp #wrap {
    height: 100vh;
}

#wrap .container {
    padding-left: 5rem;
    padding-right: 5rem;
}

.main_secBanner {
    position: relative;
    top: 520px;
}

body.indexVersion #header:after {
    display: none;
}

body.indexVersion .bodyArea {}

#header:after {}

.headerFlex {
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
}

.headerFlex>div {
    width: 50%;
}

#wrap .headerArea .container {
    padding-right: 0;
}

.mainbanner {
    display: none;
}

.chineseVersion .mainbanner {}

.indexVersion .mainbanner {}

.indexVersion .btmNav {}

.mb_area {
    position: relative;
    margin: 15px;
    max-height: 400px;
}

.mb_area:before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-image: url(../images/headerbanner/img_banner_1.png);
    background-repeat: no-repeat;
    background-position: top center;
}

.mb_area:after {
    content: "";
    display: block;
    height: 0;
    width: 0;
    padding-bottom: 400px;
    z-index: -1;
}

.mb_area .header {
    color: #323232;
    font-weight: bold;
    font-size: 3rem;
    -webkit-flex: 1 1 auto;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    margin-top: -6%;
}

/*
    .mb_area .img{
        max-height:100px;
    }
    .mb_area .img img{
        height:120px;
    }*/
.bodyArea {
    /*
        background-image:url(../images/bg_content.png);
        background-repeat:repeat-y;
        background-position:top center;*/
}

.content_bg {
    width: auto;
    display: block;
    position: relative;
    background-repeat: no-repeat;
    height: auto;
    /*
        border-bottom: 1.5rem solid #007d8f;*/
    /*
        padding-bottom: 2.5rem;*/
    z-index: 5;
}

.content_bg>.container {
    position: relative;
    z-index: 10;
    /*
        overflow:hidden;*/
}

.content_bg>.container:before {
    content: "";
    position: absolute;
    display: block;
    top: 0;
    bottom: 0;
    left: -3.125rem;
    right: -3.125rem;
    background-color: rgba(255, 255, 255, .6);
    z-index: -1
}

.mc_box {
    background-color: #fff;
    border: 1px solid #d9e2eb;
    border-radius: 0.25rem;
    padding: 1.875rem 2.5rem;
    box-shadow: 0px 2px 0.25rem 0 #dce1e7;
}

.indexVersion .content_bg {
    padding-bottom: 0;
}

#wrap #footer .container {
    border-bottom-width: none !important;
    border-bottom-style: none !important;
    border-bottom-color: none !important;
    width: 100%;
    margin-right: auto !important;
    margin-left: auto !important;
    /*
        padding: 0*/
}

.headerArea {
    /*color: #3e5259;	/*padding:5px 1.25rem;*/
    /*	background-image: url(../images/bg_header.jpg);*/
    background-repeat: no-repeat;
    /*
        height: 0.625rem;*/
}

.headerArea1 {}

.headerArea2 {
    z-index: 4000;
    position: relative;
    background-repeat: repeat;
}

.headerArea2 .headerNav {}

.headerArea2 .headerNav>div {}

.indexVersion .headerArea2 {}

.headerTop {
    text-align: right;
    width: 75%;
    padding: 0;
}

.mainbanner .flex-pauseplay {
    z-index: 7000;
    position: static;
}

.mainbanner h1,
.mainbanner .h1 {
    color: #ffff00;
}

.mainbanner .flex-pauseplay a {
    left: auto;
    right: 0.625rem;
    top: 0.625rem;
    bottom: auto;
    color: #ffca2e;
}

.mainbanner img {
    z-index: -13;
    max-width: none;
}

.content_top_banner {
    /*	float: right;*/
    min-height: 125px;
    width: 100%;
    margin-right: 0;
    margin-left: 0;
    display: block;
    height: 250px;
}

.headerArea .headerBottom {
    /*	background-image: url('../images/bg_header.png');
        background-repeat: repeat-y;
        padding: 1.25rem;*/
}

.headerArea .headerBg {
    background-color: #ff913f;
    height: 43px;
    width: 100%;
    position: absolute;
    top: 122px;
    left: 0;
    z-index: -1;
    border-bottom: 3px solid #203682;
}

.headerArea ul {
    margin: 0;
    padding: 0;
}

.headerArea .myTool {
    /*background-color:#fff;*/
    /*float:left;*/
}

.headerArea .headerTool {
    /*background-color:#032257;*/
    background-color: inherit;
    /*    background-color: #fff;
    /*	width: 85%;*/
    color: #3e5259;
    /*	position: relative;/*background-image:url(../images/clf/bkgdtexture.gif);*/
    margin-right: auto;
    margin-left: auto;
    position: relative;
    /*
        padding-top: 0.625rem;*/
}

.headerArea .headerArea1 .headerTool {
    /*
        padding: 1.25rem 0 0 0;*/
}

.headerArea .headerTool .langTool {
    /*color:#fff;
        background-color:#717171;*/
    display: inline-block;
}

.headerArea .headerTool .langTool li,
.headerArea .headerTool .langTool a {
    /*margin:0;*/
}

.headerArea .headerTool .langTool li span {
    margin: 0;
}

.headerArea .headerTool2 {
    width: 100%;
}

.headerArea .myheaderTool a,
.headerArea .myheaderTool a:link,
.headerArea .myheaderTool a:visited {
    /*
        color: #fff;*/
}

.headerArea .headerMenu a,
.headerArea .headerMenu a:link,
.headerArea .headerMenu a:visited,
.headerArea .headerMenu a:hover,
.headerArea .headerMenu a:focus,
.headerArea .headerMenu a:active {
    /*
        color:#fff;*/
    background-color: transparent;
}

.headerArea .headerMenu .extmenu a,
.headerArea .headerMenu .extmenu a:link,
.headerArea .headerMenu .extmenu a:visited,
.headerArea .headerMenu .extmenu a:hover,
.headerArea .headerMenu .extmenu a:focus,
.headerArea .headerMenu .extmenu a:active {}

/*.headerArea .headerTool .menuLv0>.my_menu3{
        background-color: #1c8d3d;
    }
    .headerArea .headerTool .menuLv0>.my_menu4{
        background-color: #096fb9;
    }
    .headerArea .headerTool .menuLv0>.my_menu3>a,
    .headerArea .headerTool .menuLv0>.my_menu3>a:link,
    .headerArea .headerTool .menuLv0>.my_menu3>a:visited,
    .headerArea .headerTool .menuLv0>.my_menu4>a,
    .headerArea .headerTool .menuLv0>.my_menu4>a:link,
    .headerArea .headerTool .menuLv0>.my_menu4>a:visited{
        color:#fff;
    }
    .headerArea .headerTool a:hover, .headerArea .headerTool a:focus {
        color: #444;
        text-decoration: none;
    }*/
.headerArea .headerTool ul.menuLv0>li>a:focus {}

.headerArea .headerTool #lunar_conversionc_uc img {
    padding-bottom: 0.25rem;
}

.headerArea .headerTool ul.menuLv0>li>a:hover {
    /*	color: #FFF;
        background-color: #1a5d7a;*/
}

.headerArea .headerTool ul.menuLv1>li>a:hover,
.headerArea .headerTool ul.menuLv1>li>a:focus {
    /*color:#652d86;*/
}

.headerArea .topHeaderTool {
    margin: 5px 0 1.5rem 0;
}

.headerArea .bottomHeaderTool {
    margin: 5px 0 5px 0;
}

.headerArea .headerTool .myTool .myLogo,
.headerArea .headerTool .topHeaderTool>div,
.headerArea .headerTool .bottomHeaderTool>div {
    float: left;
}

.headerArea .headerTool .myTool .myLogo {
    position: relative;
    z-index: 100;
}

.headerArea .headerTool .myTool .myLogoBg {
    position: absolute;
    left: 0;
    right: 0;
    height: 101px;
    background-repeat: repeat-x;
    /*	background-image: url(../images/bg_header.jpg);*/
    z-index: 1;
}

.headerArea .headerTool .myTool .leftHeaderTool {
    float: left;
    margin-top: 0.25rem;
}

.headerArea .headerTool .myTool .rightHeaderTool,
.headerTool .topHeaderTool,
.headerArea .bottomHeaderTool {
    float: right;
    width: 80%;
}

.myheaderTool>div.clientTool {
    color: #444;
    /*	height: 95px;*/
    padding-top: 0;
    padding-right: 0px !important;
    padding-bottom: 0px;
    padding-left: 0px;
    /*	font-size:.9rem;*/
    font-weight: bold;
    text-align: right;
}

.myheaderTool>div.clientTool div {
    display: inline-block;
    /*    vertical-align: middle;*/
    vertical-align: middle;
    margin: 0;
    /*	float: left;*/
}

.headerTool .myrow {
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}

.headerTool .mobSearchArea {
    width: 100%;
    padding-left: 45px;
    border-bottom: 1px solid #000;
}

/*.myheaderTool>div.clientTool .print img{
        padding:0.5rem 0;
    }
    .myheaderTool>div.clientTool .share img{
        padding:0.5rem 2px 9px 3px;
    }*/
.myheaderTool>div.clientTool div {
    position: relative;
    /*
        line-height: 1em;*/
}

.myheaderTool>div.clientTool div>* {
    /*	margin: 0;
        padding: 0;*/
}

.myheaderTool>div.clientTool div>a {
    padding: 0 0.625rem;
}

.headerTool div:before {
    /*	content: '';
        position: absolute;
        left: -1;
        top: 0;
        bottom: 0;
        border-left: 1px solid #e3d6cc;
        border-right: 1px solid #ccd0db;*/
}

.headerTool div:nth-child(1):before {
    /*	display: none;*/
}

.headerTool div>ul.aaaTool {
    padding: 0 0.25rem;
}

.headerTool div.datetime {
    padding-right: 17px;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    position: relative;
}

.headerTool div.datetime:after {
    content: "";
    position: absolute;
    width: 1px;
    right: 0;
    top: 28%;
    bottom: 28%;
    background-color: #5b6c73;
}

/*
    .headerTool div.login{
        padding: 0 17px;
        position:relative;
        font-size:1.2rem;
    }
    .headerTool div.login:before{
        content:"";
        position:absolute;
        width:1px;
        left:0;
        top:28%;
        bottom:28%;
        background-color:#a0abad;
    }
    .headerTool div.login:after{
        content:"";
        position:absolute;
        width:1px;
        right:0;
        top:28%;
        bottom:28%;
        background-color:#5b6c73;
    }*/
.headerTool div.setbookmark {
    padding: 0 17px;
    position: relative;
}

.headerTool div.setbookmark:before {
    /*
        content:"";
        position:absolute;
        width:1px;
        left:0;
        top:28%;
        bottom:28%;
        background-color:#a0abad;*/
}

.headerTool div.datetime>#lunar_climatology_uc {
    padding-right: 0;
}

.headerTool div.datetime>#lunar_conversionc_uc {
    padding: 0;
}

.headerTool div.datetime>span {
    padding-left: 0.375rem;
}

.headerTool div.searchTool>* {}

.headerTool div.brandhk>* {
    padding: 0;
}

.headerTool div#wxinfo_bar>img {
    height: 22px;
    width: auto;
    padding: 2px;
    background-color: #fff;
}

/*.clientTool>div:before {
        content: "I";
        font-size: medium;
        font-weight: lighter;
        color: #CCC;
        padding-left: 5px;
        padding-right: 0.625rem;
    }
    .clientTool>div:first-child:before{
        display:none;
    }*/
.clientTool>div.AStyleArea:before,
.clientTool>div.language:before,
.clientTool>div.share:before {
    /*    content: "I";
        font-size: medium;
        font-weight: lighter;
        color: #CCC;
        padding-left: 5px;
        padding-right: 0.625rem;*/
}

/*.clientTool>div.language li:before{
        content: "I";
        font-size: medium;
        font-weight: lighter;
        color: #CCC;
        padding-left: 5px;
        padding-right: 0.625rem;
    }*/
.clientTool>div.language li.fst:before {
    content: "";
    display: none;
}

.clientTool>div.homeTool:before {
    display: none;
}

.clientTool>div.searchTool:before {
    /*	content: "";
        clear: both;
        padding: 0;
        margin: 0;*/
}

.headerArea .headerTool .searchTool {
    float: none;
    text-align: right;
    z-index: 8901;
    position: relative;
}

.headerArea .headerTool .searchTool .searchBtn {
    position: absolute;
    left: 0;
    top: 5px;
    padding: 0.5rem 0;
}

.headerArea .headerTool .searchTool input {
    background-color: transparent;
    color: #000;
    border: 0;
    font-size: 1.125rem;
    padding: 15px 5px;
    width: 100%;
}

.headerArea .headerTool .searchTool input::placeholder {
    color: #000;
    opacity: .6;
}

.headerArea .headerTool .searchTool input:-ms-input-placeholder {
    color: #fff;
    color: #757575
}

.headerArea .headerTool .searchTool input::-ms-input-placeholder {
    color: #fff;
    color: #757575;
}

div.searchTool:after {
    content: none !important
}

div.hrbTool:after {
    content: none !important
}

div.mobile_view:after {
    content: none !important
}

/*div.language:after{
        content: "";
        display:none;
    }*/
.searchTool form:before {
    /*	content: "I";
        font-size: medium;
        font-weight: lighter;
        color: #CCC;
        padding-left: 5px;
        margin-left: 5px;*/
}

.clientTool div:after {
    /*	content: "I";
        font-size: medium;
        font-weight: lighter;
        color: #CCC;
        padding-left: 5px;*/
}

div.language li:after {
    /*	content: "I";
        font-size: medium;
        font-weight: lighter;
        color: #CCC;
        padding-left: 5px;*/
}

/*div.AStyleArea:before{
        content: "I";
        font-size: medium;
        font-weight: lighter;
        color: #CCC;
        padding-left: 5px;
        padding-right: 0.625rem;
    }
    div.language:after{
        content: "I";
        font-size: medium;
        font-weight: lighter;
        color: #CCC;
        padding-left: 0.625rem;
        padding-right: 5px;
    }*/
div.language li.last:after {
    content: "";
    display: none;
}

.hrbTool:before {
    content: none !important
}

.headerTool div.RSS {
    /*
        color: #be4a03;
        font-size: 0.875rem;*/
}

.headerTool div.AStyleArea {
    position: relative;
    padding: 0;
}

.myheaderTool .clientTool>div.AStyleArea {
    padding-left: 15px;
}

.headerTool div.AStyleArea:before {}

.headerTool div.AStyleArea:after {}

.headerTool div.AStyleArea>a img {
    width: 1.7rem;
    min-width: 1.7rem;
}

.headerTool .searchSite a img {}

.headerTool div.setting img {
    width: 1.25rem;
}

.headerTool div.mobile_view {
    /*	width: 45px;*/
    height: 27px;
}

.headerTool div.language ul li {
    display: inline-block;
    /*	padding-right: 5px !important;
        padding-right: 0;
        width: 0.625rem !important;*/
}

.headerTool div.home {}

.headerArea ul {
    /*	float: right;*/
    list-style-type: none;
}

.headerTool .hotlist {
    /*
        text-align: right;
        margin-top: -15px;*/
    margin: 1.25rem 0;
    margin-bottom: 0;
}

.headerTool ul.hotlist>li {
    position: relative;
    padding: 0 0.5rem;
}

.headerTool .hotlist a.hot-btn {
    /*
        background-color: #cb0003;
        border: 1px solid #a80f11;
        border-radius: 0.25rem;
        padding: 0.375rem 1.125rem;
        color: #fff;
        text-decoration: none;
        font-size: 0.666rem;*/
    font-weight: bold;
    color: #cb0003;
    text-transform: uppercase;
}

.headerTool ul.hotlist>li:not(:nth-child(1)):not(:last-child):after {
    content: "";
    position: absolute;
    top: 10%;
    bottom: 10%;
    right: -1px;
    width: 2px;
    background-color: #c2c2c2;
}

.clientTool ul li {
    margin-left: 0;
    margin-right: 0;
    vertical-align: middle;
}

.clientTool:before {
    /*	content: " ";
        float: left;
        display: block;
        background-image: url(../images/user_login.png);
        background-repeat: no-repeat;
        position: relative;
        width: 0.625rem;
        height: 9px;
        background-size: 100% 100%;
        margin-right: 5px;
        top: 50%;
        margin-top: -5px;*/
}

.searchTool form {}

.headerArea form a {
    /*
        display: inline-block;
        vertical-align: middle;
        padding: 0.5rem 9px;
        background-color: #1d8acd;*/
}

.headerTool .searchBtn {
    /*
        background-color: #eeeef0;*/
    padding: 0.5rem 12px 0.5rem 12px;
    display: inline-block;
    /*
        position: absolute;
        right: 0;*/
    /*
        background-color:#f2dd2c;*/
}

.headerTool .searchBtn .icon_search_desktop {
    width: 1.625rem;
}

.headerTool .searchBtn .icon_search_desktop svg {
    fill: #3a3838;
}

.headerArea form img {
    z-index: 4200;
    position: relative;
}

.headerArea .language>ul {
    /*	float:left;*/
}

.headerArea .clientTool>ul>li>div>* {
    padding: 0.25rem 12px;
}

.clientTool li * {
    display: inline;
    vertical-align: bottom;
}

.headerArea li .aaaTool,
.headerArea li .aaaTool * {
    vertical-align: inherit;
}

.mobileClient {
    display: none;
}

.logIOTool a {
    background: #eee;
}

/*.headerArea ul
    {
        float: left;
    }*/
.headerArea a {}

.headerArea li,
.headerArea a {
    margin: 0 0px;
    padding: 0;
    float: none;
    display: inline;
    text-decoration: none;
    /*vertical-align: bottom;*/
}

.headerArea .language li {
    position: relative;
}

.headerArea .language li a {
    color: #000;
    font-weight: bold;
    -moz-border-radius: 27px;
    -webkit-border-radius: 27px;
    border-radius: 27px;
    padding: 0.625rem 15px;
    display: block;
}

.headerArea .language li:nth-child(2):before {
    /*	content: '';
        position: absolute;
        left: -1;
        top: 0;
        bottom: 0;
        border-left: 1px solid #e3d6cc;
        border-right: 1px solid #ccd0db;*/
}

.headerArea .headerMenu li,
.headerArea .headerMenu a {
    margin: 0;
    display: block;
}

.headerArea a:hover,
.headerArea a:focus {
    text-decoration: underline;
}

.headerArea .myTool,
.headerArea .myTool a {
    color: #3e5259;
}

.headerArea .langTool {
    margin-top: 0.375rem;
}

.headerArea .bottomHeaderTool .contactus img {
    vertical-align: initial;
    margin: 0 5px;
}

.headerArea .bottomHeaderTool .searchTool {
    margin-left: 3px;
    margin-top: -2px;
}

.headerArea .hrbTool input {
    /*	display: inline;
        width: 270px;
        display: inline-block;
        border: 2px solid #d1d1d1;
        border-radius: 0.25rem;
        text-decoration: none;
        font-size: 0.875rem;
        color: #999;
        padding-top: 0px;
        padding-right: 0px;
        padding-bottom: 0px;
        padding-left: 0.625rem;
        height: 33px;*/
}

.headerArea .hrbTool img {
    margin-left: 0.625rem;
}

.myheaderTool>div.clfSeachBar {
    float: none;
    position: absolute;
    top: 1.875rem;
    right: 1.25rem;
}

.headerArea .searchTool .hrbTool a {
    /*position: relative;
        background-color:#3a6ecf;*/
    color: #3e5259;
    padding: 0 5px;
    font-weight: bold;
    font-size: 12px;
}

.headerArea .searchTool .hrbTool a:hover,
.headerArea .searchTool .hrbTool a:focus {
    color: #cc3333;
    text-decoration: none;
}

.headerArea .aaaTool {
    margin-right: 5px;
}

.headerArea ul.aaaTool {
    padding-right: 0px;
    padding-left: 0px;
}

.headerArea .bottomHeaderTool .searchTool .searchBtn img {
    /*position: absolute;
        top: 0;
        right: 0.625rem;*/
    margin-left: 5px;
}

.headerArea .headerTool .headerMenu {
    /* display: none; */
    height: 100vh;
    position: fixed;
    top: 0;
    right: 0;
    max-width: 100%;
    width: 0;
    padding: 0;
    color: #000;
    background-color: #4676E2;
    background-image: linear-gradient(0deg, #4676E2 0%, #1FA1D9 85%, #1DADD8 100%);
    -webkit-transition: -webkit-transform .3s cubic-bezier(.645, .045, .355, 1), opacity .3s cubic-bezier(.645, .045, .355, 1);
    -moz-transition: transform .3s cubic-bezier(.645, .045, .355, 1), opacity .3s cubic-bezier(.645, .045, .355, 1);
    -ms-transition: -ms-transform .3s cubic-bezier(.645, .045, .355, 1), opacity .3s cubic-bezier(.645, .045, .355, 1);
    -o-transition: transform .3s cubic-bezier(.645, .045, .355, 1), opacity .3s cubic-bezier(.645, .045, .355, 1);
    transition: transform .3s cubic-bezier(.645, .045, .355, 1), opacity .3s cubic-bezier(.645, .045, .355, 1);
    -webkit-transform: translate3d(105%, 0, 0);
    -ms-transform: translate3d(105%, 0, 0);
    transform: translate3d(105%, 0, 0);
    opacity: 0;
    z-index: 8000;
    overflow: auto;
}

.headerArea .headerTool .headerMenu.active {
    display: block;
    -webkit-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    width: 560px;
    padding: 1.875rem 5rem;
    padding-bottom: 70px;
    opacity: 1;
}

.headerArea .headerTool .headerMenu>* {
    display: none;
}

.headerArea .headerTool .headerMenu.active>* {
    display: block;
}

.headerArea .headerTool .headerMenu a {
    color: #000;
}

/*
    .headerArea .headerTool .headerMenu.mainheaderMenu {
        position: relative;
    }
    .headerArea .headerTool .headerMenu.mainheaderMenu .mainMenuTool {
        position: absolute;
        left: 0;
        top: 0;
        z-index: 8600;
    }
    .headerArea .headerTool .headerMenu.mainheaderMenu .mainMenuTool button>span:nth-child(2) {
        display: block;
        width: 2.5rem;
        padding: 0.5rem 0;
    }
    .headerArea .headerTool .headerMenu.subheaderMenu {
        margin-left: 100px;
        margin-right: 100px;
        margin-top: 5px;
    }
    .headerArea .headerTool .headerMenu.subheaderMenu .tMenu>li>a {
        z-index: 8010;
    }*/

.langmenu ul {
    padding-left: 0;
    list-style-type: none;
    margin-bottom: 0;
}

.langmenu li {
    position: relative;
    display: inline-block;
    padding-right: 1.5rem;
}

.langmenu>li:last-child {
    padding-right: 0;
}

.langmenu li a {
    color: #000;
    font-size: 1.25rem;
    font-weight: bold;
}


.langmenu li a:hover,
.langmenu li a:focus {}

.headerMenu .cross_btn a {}

.headerMenu .cross_btn a:before {
    content: "";
    position: absolute;
    right: 0;
    top: 2px;
    width: 2.5rem;
    height: 1.625rem;
    background-image: url(../images/icon/icon_close.svg);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 100% auto;
}

.headerTool .headerMenu .language {
    font-size: 1.25rem;
    margin-left: -15px;
    float: left;
}

.headerTool .headerMenu .language li a {
    padding: 0 15px;
}

.headerArea .headerTool .headerMenu>ul {
    /*
        padding: 1.25rem 1.875rem;
        margin-top: 0;
        display: -ms-inline-flexbox;
        display: -webkit-inline-flex;
        display: inline-flex;
        color:#fff;
        background-color: #1c65e8;
        border-radius: 100px;*/
}

/*
    .indexVersion .headerArea .headerTool .headerMenu>ul {
        margin-top: 0;
    }
    .leftMenuVersion .leftmenu {
        float: left;
        width: 180px;
    }
    .leftMenuVersion .mainHeader, .leftMenuVersion .mainContent {
        width: 800px;
        float: left;
    }*/
#mainContentSkip {
    float: left;
}

/*
    .headerArea .headerTool .searchTool
    {
        display: inline-block;
        *zoom: 1;
        *display: inline;
        width:416px;
        position:relative;
        background-image: url(../images/bg_search.png);
        background-repeat: no-repeat;
        padding-top: 0.5rem;
        margin-top: -1.125rem;
        z-index: 9876;
    }*/

.headerArea {}

.headerTool {}

.hrbTool {
    width: 250px
        /*position: absolute;
        left: 0;
        right: 0px;
        z-index: 9876;
        height: 3.125rem;*/
        /*background-color:#fff;*/
}

.headerMenu>ul {}

.headerMenu ul li {
    /*
        float: left;*/
    margin: 0;
}

.headerMenu ul.menuLv0>.close>div.extmenu {
    display: none;
    /*position: absolute;
        left: -9999px;
        right:auto;*/
}

.headerMenu ul.menuLv0>.open:nth-last-child(-n+3)>div.extmenu {
    right: 0;
}

.headerMenu ul .close>div.extmenu.activeUl {
    left: 0;
}

.headerMenu ul .close ul ul ul {
    display: none !important
}

.headerMenu ul .open>ul,
.headerMenu ul li ul.activeUl,
.headerMenu ul li ul.activeUl_withTimer {
    display: block;
    left: 0;
}

.headerMenu ul li:nth-child(n+8).open>ul,
.headerMenu ul li:nth-child(n+8) ul.activeUl,
.headerMenu ul li:nth-child(n+8) ul.activeUl_withTimer {
    /*    right: 0;
        left: auto;*/
}

.headerMenu ul li a>div {
    float: left;
}

.headerMenu ul.menuLv1 {}

.headerMenu ul ul.menuLv1 {}

.headerMenu ul ul.menuLv1>li {}

.headerMenu ul.menuLv1>li:hover,
.headerMenu ul.menuLv1>li:focus,
.headerMenu ul.menuLv1>li:active {
    /*background-color:#ebe9f4;	*/
}

.headerMenu ul.menuLv1 li a {
    display: block;
    text-align: left;
}

.headerMenu ul.menuLv0,
.headerMenu ul.menuLv0 li {
    list-style-type: none;
}

.headerMenu ul.menuLv0>li {
    padding-left: 0;
    padding-right: 0;
    position: relative;
    border-collapse: collapse;
}



.headerMenu ul.menuLv0>li>a {
    position: relative;
}



.subheaderMenu ul.menuLv0>li {
    /*	font-size:0.85rem;
        /*position: static;
        /*background-color:#fff;
        position:relative;*/
    font-weight: bold;
    text-align: right;
    /*
        border-left: 1px solid #d2cfe1;
        /*border-right: #fff 1px solid;
        /*width: 165px;*/
    position: relative;
    text-align: center;
    vertical-align: top;
    /*	font-weight: normal;*/
}

.headerMenu ul.menuLv0>li.firstLi:before {
    content: '';
    display: none;
}

.tMenu>li {
    position: relative;
    min-height: inherit !important;
    max-height: inherit !important;
    width: auto;
    font-size: 1rem;
    text-align: left;
    background-repeat: no-repeat;
}

.headerMenu ul.menuLv0>li {}

.headerMenu ul li>div.extmenu {}

.headerMenu ul li>div.extmenu ul {}

.headerMenu ul.menuLv1>li>div.extmenu {
    position: relative;
}

.headerMenu ul li>div.extmenu:before {}

.headerMenu ul li:nth-last-child(-n+3)>div.extmenu:before {
    left: auto;
    right: 10%;
}

.headerMenu .extmenu ul li>div.extmenu:before {
    display: none;
}

.headerMenu ul.menuLv0>li>a {}

.headerMenu ul.menuLv0>li>a.excLi:after {}

.headerMenu ul.menuLv0>li.open>a.excLi:after {}

.headerMenu ul.menuLv0>li>a>span {
    display: inline-block;
    position: relative;
    margin-top: 0;
}

.headerMenu ul.menuLv0>li>a>span {}

.headerMenu .tMenu>li>a:focus>span,
.headerMenu .tMenu>li>a:hover>span,
.headerMenu .tMenu>li>a:active>span,
.headerMenu .tMenu>li>a.active_section>span {}

.headerMenu ul.menuLv0>li>a>span.caret,
.headerMenu ul.menuLv1>li>a>span.caret {
    position: absolute;
    padding-right: 0;
    top: 50%;
    right: 5px;
    display: none;
    /*	margin-top:-0.25rem !important;*/
}

.headerMenu ul.menuLv0>li:hover>a,
.headerMenu ul.menuLv0>li>a:hover,
.headerMenu ul.menuLv0>li>a:focus {
    /*
        background-color: #dffdfd;*/
    color: #000;
}

.chineseVersion .headerMenu ul.menuLv0>li>a {}

.headerMenu .tMenu a>span {
    margin: 0 0px;
}

.headerMenu .tMenu>li>a {}

body.englishVersion .headerMenu .tMenu>li>a {}

.chineseVersion .headerMenu .tMenu>li>a {}

.headerMenu .tMenu a:link,
.headerMenu .tMenu a:visited {}

.headerMenu .tMenu li.open {}

.headerMenu.subheaderMenu .tMenu li.open ul,
.headerMenu.subheaderMenu .tMenu li ul.activeUl {
    margin: 0;
    background-color: #1f61af;
    padding: 0;
    border-top: 1px solid #1b5397;
}

.headerMenu .tMenu li>ul.menuLv2 {
    position: absolute;
    left: -9999px;
}

.headerMenu .tMenu li.active>ul.menuLv2 {
    display: block;
    min-width: 100%;
    position: relative;
    left: auto;
}

.headerMenu .tMenu li.open ul.menuLv2,
.headerMenu .tMenu li .activeUl ul.menuLv2,
.headerMenu .tMenu li ul.menuLv2.activeUl {}

.headerMenu .tMenu li.open ul:after,
.headerMenu .tMenu li ul.activeUl:after {
    clear: both;
}

.headerMenu .tMenu li.open ul>li,
.headerMenu .tMenu li ul.activeUl>li {
    float: none;
    display: block;
}

.headerMenu .tMenu li.open ul li a,
.headerMenu .tMenu li ul.activeUl li a {
    margin-top: 0;
    margin-bottom: 0;
    display: block;
}

.headerMenu .tMenu li ul li a,
.headerMenu .tMenu li ul li a {}

.headerMenu .tMenu li.open ul li a,
.headerMenu .tMenu li ul.activeUl li a {
    margin-top: 0;
    margin-bottom: 0;
}

.headerMenu .tMenu li.open ul.menuLv2>li>a,
.headerMenu .tMenu li ul.activeUl .menuLv2>li>a {
    padding: 5px 0.625rem 0.625rem 1.875rem;
}

.headerMenu .tMenu li.open ul.menuLv2>li>a:focus,
.headerMenu .tMenu li ul.activeUl .menuLv2>li>a:focus,
.headerMenu .tMenu li.open ul.menuLv2>li>a:active,
.headerMenu .tMenu li ul.activeUl .menuLv2>li>a:active,
.headerMenu .tMenu li.open ul.menuLv2>li>a:hover,
.headerMenu .tMenu li ul.activeUl .menuLv2>li>a:hover {}

.headerMenu ul.menuLv0 {
    z-index: 7900;
    position: relative;
}

.headerMenu ul.menuLv1 {
    z-index: 7910;
}

.headerMenu ul.menuLv2 {
    z-index: 7920;
}

.headerMenu ul.menuLv1>li {
    position: relative;
}

.headerMenu ul.tMenu.menuLv0>li {
    text-align: center;
    border-bottom: 1px solid rgba(0, 0, 0, .25);
}

.headerMenu ul.tMenu.menuLv0>li.firstLi {
    display: none;
}

.headerMenu ul.tMenu.menuLv0>li>a {}

.headerMenu .tMenu li.open ul.menuLv2>li {
    width: 100%;
}

.headerMenu .tMenu li ul.menuLv1 {
    padding-bottom: 0.5rem;
}

.headerMenu .tMenu li ul.menuLv1>li:not(:last-child) {}

.headerMenu .tMenu li ul.menuLv1>li {
    float: none;
}

.headerMenu .tMenu li ul.menuLv1>li .extmenu {}

.headerMenu .tMenu li ul>li.close {}

.headerMenu .tMenu li ul>li>a {}

.headerMenu .tMenu li ul>li>a:focus,
.headerMenu .tMenu li ul>li>a:active,
.headerMenu .tMenu li ul>li>a:hover {}

.headerMenu .tMenu>li>a {
    position: relative;
    font-weight: bold;
}

.headerMenu .tMenu>li>a:focus,
.headerMenu .tMenu>li>a:hover,
.headerMenu .tMenu>li>a:active,
.headerMenu .tMenu>li>a.active_section {
    color: #000;
}

.headerMenu .tMenu>li>a.active_section {}

.headerMenu .tMenu>li>a:focus span:after,
.headerMenu .tMenu>li>a:hover span:after,
.headerMenu .tMenu>li>a:active span:after,
.headerMenu .tMenu>li>a.active_section span:after {}

.headerMenu .tMenu>li.active_section>a {}

.headerMenu .tMenu .menuLv1 a {
    padding: 12px 1.25rem;
    font-size: 1.5rem;
}

.headerMenu .tMenu .menuLv1 li:nth-child(1) a {
    padding-top: 0.25rem;
}

.headerMenu .tMenu .menuLv1>li>a:before {}

.headerMenu .sheading {
    font-family: IBMPlexMono;
    font-size: 0.875rem;

}

.headerMenu .rsMenu {}

.headerMenu .rsMenu a {
    position: relative;
    padding: 0.625rem 0 0.625rem 1.875rem;
    font-weight: bold;
    font-size: 1.25rem;
    text-align: left;
    display: block;
    color: #000;
}

.headerMenu .rsMenu a:before {
    content: "";
    position: absolute;
    left: 0;
    top: 1rem;
    width: 1.25rem;
    height: 1.25rem;
    background-image: url(../images/icon/icon_newwindow.svg);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 100% auto;
}

.headerMenu .fuMenu {
    padding: 0 0 1.25rem 0;
    border-bottom: 1px solid rgba(0, 0, 0, .25);
}

.headerMenu .fuMenu li a {
    padding: 0 0.625rem 1.25rem 0.625rem;
    padding-bottom: 1.25rem;
}

.headerMenu .fuMenu li a:nth-child(1) {
    padding-left: 0;
}

.headerMenu .lheading {
    font-size: 1.5rem;
    font-weight: bold;
    text-transform: uppercase;
    margin-bottom: 0.75rem;
}

.headerMenu .inMenu {}

.headerMenu .inMenu>li:not(:last-child) {
    padding-bottom: 0.75rem;
}

.headerMenu .inMenu a {}

.caret {
    display: none;
}

.siteList .caret {
    display: none;
}

.headerMenu .tMenu .menuLv1 hr {
    margin-top: auto;
    margin-bottom: auto;
    border: 1px solid #b9c7d6;
    border-top: 0;
    width: 90%;
    margin: 0 auto;
}

.leftHeader {
    display: none;
}

.leftMenuHeader {
    margin-top: 0;
}

.left_menu>div {}

.left_menu>div.menuBg {}

.leftMenuArea {}

.leftMenu {}

.left_menu {}

.leftMenu {
    min-width: 20%;
    width: 20%;
    padding-right: 4rem;
    z-index: 7900;
    position: relative;
}

.mainAreaMC.full .leftMenu {
    display: none;
}

.leftMenu .close>ul {
    height: 0;
    opacity: 0;
    filter: alpha(opacity=0);
    z-index: -1;
    position: relative;
    overflow: hidden;
}

.leftMenu .open>ul {
    height: auto;
    opacity: 1;
    filter: alpha(opacity=100);
    z-index: 7910;
    -webkit-transition: opacity 0.3s ease-in-out;
    -moz-transition: opacity 0.3s ease-in-out;
    -ms-transition: opacity 0.3s ease-in-out;
    -o-transition: opacity 0.3s ease-in-out;
    transition: opacity 0.3s ease-in-out;
    overflow: visible;
}

.chineseVersion .headerMenu .tMenu .menuLv1 a {
    .clientTool>div min-height: 1.125rem;
}

.copyrightBar {
    text-align: center;
    margin: 0 0 0 0;
}

.headerTool {}

.headerNav {
    width: 100%;
}

.headerTool .myLogo {
    padding-right: 1.5rem;
    padding-top: 1.7rem;
    padding-bottom: 0px;
    width: 20%;
    height: auto;
    z-index: 3080;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

.fixedHeader .headerTool .myLogo {
    padding-top: 5px;
}

.indexVersion .headerTool .myLogo {
    height: 5rem;
}

.headerTool .myLogo span {
    display: block;
    width: 100%;
    height: 100%;
}

.headerTool .myLogo .logo_0 a {
    display: inline-block;
    text-decoration: none;
    color: #000;
    width: 100%;
    height: 100%;
}

.headerTool .myLogo .logo_0 a>div {
    background-image: url('../images/logo/logo_fso_hksar_e.svg');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: left top;
    height: 10rem;
    width: 100%;
}

.fixedHeader .headerTool .myLogo .logo_0 a>div {
    background-image: url('../images/logo/logo_fso_e.svg');
}

.headerTool .myLogo .logo_0 img {
    text-align: left;
    /*width: 78%;*/
}

.headerTool .myLogo .logo_0 span {}

.headerTool .myLogo .logo_0 a .txt {
    /*
        font-family: "Arial", "Helvetica", "sans-serif", "microsoft jhenghei";*/
    display: block;
    width: 350px;
    max-width: 100%;
    padding: 1.5rem 0;
    font-size: .75rem;
}



.headerTool .headerMenu {}

.headerTool .AStyleArea a {
    /*	color:#000 !important;
        padding: 0 0.25rem;*/
    vertical-align: baseline;
}

/*=========footer=========*/

.footerArea {
    /*
        color: #fff;
        font-size:1.1rem;*/
}

.footerArea a {
    /*
        color: #2b3944;*/
}

.footerArea .contact_tool {
    /*	font-size:1.4rem;*/
}

.footerArea .header {
    color: #ffff00;
    margin-bottom: 1.625rem;
    font-size: 1.2rem;
}

.footerArea {
    /*	background-color: #133c8b;
        color: #fff;*/
}

.footerMenu ul.menuLv0>li.firstLi {
    display: none;
}

.footerMenu .fm0 ul.menuLv0>li.firstLi {
    display: none;
}

.footerMenu ul,
.footerMenu ul li {
    list-style-type: none;
    padding: 0;
}

.indexVersion .footerMenu .bMenu {
    display: block;
}

.footerArea {
    font-size: 1rem;
    position: relative;
    padding: 0;
}

.indexVersion .footerArea {
    box-shadow: none;
}

.footerArea,
.footerArea a {
    color: #424242;
}

.footerArea .container {
    z-index: 1000;
}

.footerArea0 {
    overflow: hidden;
    padding: 2.5rem 0;
}

.footerArea1 {}

.footerArea1 .myflex {
    -webkit-flex-wrap: nowrap;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
}

.footerArea1 .myflex>div {}

.footerArea1 .myflex .footerContact {
    max-width: 100%;
    padding-right: 2.5rem;
    position: relative;
    width: 23.5%;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

.footerArea1 .myflex .footerContact>* {}

.footerArea1 .myflex .footerContact .menu_section {
    padding-bottom: 0;
}

.footerArea1 .myflex .footerContact:before {}

.footerArea1 .myflex .footerMenuArea {
    -webkit-flex: 1 1 0px;
    -ms-flex: 1 1 0px;
    flex: 1 1 0px;

    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

.footerArea1 .myflex .footerContact .border>div {
    padding: 12px 0;
    padding-left: 35px;
    position: relative;
}

.footerArea1 .myflex .footerContact .border>div:before {
    content: "";
    position: absolute;
    left: 0;
    top: 0.875rem;
    width: 1.25rem;
    height: 1.25rem;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
}

.footerArea1 .myflex .footerContact .border>div.footerFollow {
    padding-left: 0;
    padding-right: 0;
}

.footerArea1 .footerContact .tit {}




.footerArea1 .footerContact .detail {}

.footerArea1 .footerContact .detail>div {}

.footerArea1 .footerContact .footerFollow ul {
    padding-left: 0;
}

.footerArea1 .footerContact .footerFollow li {
    list-style-type: none;
    display: inline-block;
    padding: 0 0.625rem;
}

.footerArea1 .footerContact .footerFollow li:nth-child(1) {
    padding-left: 0;
}

.footerArea1 .footerContact .footerFollow li:last-child {
    padding-right: 0;
}

.footerArea1 .footerMenuArea {
    /*
        background-color: #fff;
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
        border-bottom: 3px solid #544b78;*/
}

.footerArea2 {
    /*
        font-size:.875rem;*/
    padding: 2.5rem 0;
    /*
        background-color: #b2eaeb;*/
}

.footerArea2 .footerRow {
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    justify-content: space-between;
}

.footerArea2 .footerRow>* {}

.footerArea2 .copytool {
    padding: 1.25rem 0;
    /*
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;*/
}

.footerArea2 .copyRight {
    text-align: center;
    /*
        -webkit-flex: 1 1 auto;
        -ms-flex: 1 1 auto;
        flex: 1 1 auto;*/
}

.footerArea2,
.footerArea2 a {}

.footerRow .logo {
    text-align: center;
    margin-bottom: 1.25rem;
}

div.footerRow {
    text-align: center;
}

.footerRow {
    /*
        background-color: #fff;/*    position: absolute;
        left: 1em;
        right: 1em;*/
    /*
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;*/
}

.footerInline>* {
    display: inline-block;
}

.shareFooter {
    margin: 1.5rem 0 15px 0;
    text-align: center;
}

.shareFooter a {
    display: inline-block;
    text-align: center;
    padding: 0 1rem;
    font-weight: bold;
}

.footerArea .footerTop {
    position: relative;
}

.footerArea .footerTop .mylogo {
    position: absolute;
    left: 0;
    top: 0.625rem;
}

.footerArea .footerBottom {
    margin-top: 1.875rem;
}

body #wrap .footerArea .container {
    /*background-color:#26418e;*/
}

.footerArea .footerMenu .footerMenuParent {
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    /*	padding-bottom: 0;
        border-top-width: 5px;
        border-top-style: solid;
        border-top-color: #3f535a;
        padding-right: 0px;
        padding-left: 0px;*/
    padding-left: 1.75rem;
    position: relative;
    /*
        background-color: #fcc800;*/
}

body.chineseVersion .footerArea .footerMenu .footerMenuParent {
    padding: 21px 0.625rem 1.5rem 0.625rem;
}

body.ieVersion .footerArea .footerMenu .footerMenuParent {
    padding: 1.25rem 0.625rem;
}

body.ieVersion.chineseVersion .footerArea .footerMenu .footerMenuParent {
    padding: 2rem 0.625rem;
}

.footerArea .footerMenu:after {
    /*	content: '';
        position: absolute;
        bottom: 0;
        left: 0.625rem;
        right: 0.625rem;
        height: 2px;*/
}

.footerArea .footerMenu {
    /*	background-color:#e5faf5;*/
}

.footerArea .footerMenu .footerMenuParent {
    /*
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;*/
}

.footerArea .footerMenu .footerMenuParent>div {
    -webkit-flex: 1 1 auto;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    /*
        width: 33.333%;
        display: inline-block;*/
}

/*
    .footerArea .fm1 .fMenu>li:nth-child(1) {
        background-color: #1c8d3d;
    }
    .footerArea .fm2 .fMenu>li:nth-child(1) {
        background-color: #096fb9;
    }*/
.footerArea .footerMenu .myText .hdOnly {
    display: none;
}

.footerMenu ul ul ul {
    display: none;
}

.footerArea .myFooterBg {
    position: absolute;
    left: 0;
    right: 0;
    background: #012056;
    bottom: 0;
    z-index: 1;
}

/*.footerMenu .bMenu
    {
        display:none;
    }*/

.footerMenu .bMenu li {
    display: list-item;
    margin: 0.625rem 0;
    list-style-type: disc;
}

.footerMenu .bMenu .menuLv1 li {}

.footerMenu .bMenu .menuLv1 li:before {
    position: relative;
    display: inline-block;
    margin-right: 5px;
}

.footerMenu ul.menuLv0>li.firstLi {
    /*	display: none;/*	float: left;
        list-style-type: none;
        margin-top: 0.625rem;
        margin-right: 1.5rem;
        margin-bottom: 35px;
        padding-left: 1.875rem;
        display: none;*/
}

.footerMenu ul.menuLv0>li.my_menu1 {
    /*	float: left;
        width: 13%;
        list-style-type: none;
        margin-top: 0.625rem;
        margin-right: 1.5rem;
        margin-bottom: 35px;
        padding-left: 6%;*/
}

.footerMenu .fm0 .extmenu {
    display: none;
}

/*.footerMenu ul.menuLv0>li.my_menu2 {
        width: 13%;
    }
    .footerMenu ul.menuLv0>li.my_menu3 {
        width: 13%;
    }
    .footerMenu ul.menuLv0>li.my_menu4 {
        width: 13%;
    }
    .footerMenu ul.menuLv0>li.my_menu5 {
        width: 13%;
    }
    .footerMenu ul.menuLv0>li.my_menu6 {
        width: 13%;
    }*/
/*
    .footerArea .footerMenu .bMenu>li {
        float: left;
    
        list-style-type: none;
        margin-top: 0.625rem;
        margin-right: 1.5rem;
        margin-bottom: 35px;
    }
    .footerArea .footerMenu .bMenu>li.my_menu18 {
        float: left;
        width: 240px;
        list-style-type: none;
        margin-top: 0.625rem;
        margin-right: 1.5rem;
        margin-bottom: 35px;
    }*/
/*.footerArea .footerMenu .bMenu>li a{
        margin-bottom: 5px;
    }
    
    .footerArea .footerMenu .bMenu>li li{
        float: left;
        margin: 0.5rem 1.5rem 0.5rem 1.5rem;
        width: 200px;
        max-width: 100%;
    }
    .footerMenu .bMenu {
        font-size: 1rem;
        margin-top: 0;
        margin-right: auto;
        margin-left: auto;
        padding-top: 0;
        padding-right: 0;
        padding-bottom: 1.875rem;
        padding-left: 0;
    }*/
.footerMenu .shortList {
    max-width: 120px;
}

.footerMenu .longList>ul {
    float: left;
}

.footerMenu .longList .firstUl {
    margin-left: 0;
}

.footerMenu .longList ul {
    margin-left: 1.25rem;
}

.footerMenu .bMenu .menuLv1 a:link,
.footerMenu .bMenu .menuLv1 a:visited {
    display: inline;
}

.footerMenu .bMenu a:link,
.footerMenu .bMenu a:visited {
    display: block;
    color: #3e5259;
    font-weight: bold;
}

.footerMenu .bMenu a:hover,
.footerMenu .bMenu a:focus,
.footerMenu .bMenu a:active,
.footerMenu .bMenu a.active_section {
    text-decoration: none;
}

.footerMenu .bMenu .menuLv1 a:link,
.footerMenu .bMenu .menuLv1 a:visited,
.footerMenu .bMenu .menuLv1,
.footerMenu .bMenu .menuLv1 {
    color: #3e5259;
    font-weight: normal;
}

.footerMenu .bMenu .menuLv1 a:hover,
.footerMenu .bMenu .menuLv1 a:focus,
.footerMenu .bMenu .menuLv1 a:active,
.footerMenu .bMenu .menuLv1 a.active_section {}

.footerArea ul.fMenu {
    list-style-type: none;
    padding: 0;
    margin-bottom: 0;
}

.footerArea ul.fMenu,
.footerArea .copyRight,
.footerArea .copyrightBar {
    /*text-align:center;
        display: inline;*/
}

.footerArea ul.fMenu {
    /*margin:2px 0;
        display: inline-block;
        float: right;
        max-width:38%;*/
}

.footerArea div.info ul.fMenu {
    /*	max-width: 50%;*/
    margin: 0px;
    padding: 0px;
    display: block;
}

.footerArea .footerBold {
    font-size: 1.1rem;
    font-weight: bold;
}

.footerArea .govLogo {
    margin-bottom: 0.625rem;
}

.footerArea .govLogo>div {
    display: inline-block;
    vertical-align: middle;
    margin-right: 0.625rem;
}

.footerArea .copyRight {
    padding: 0 0.625rem;
    position: relative;
}

.footerArea .copyRight:before {
    /*	content: "";
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        width: 1px;
        background-color: #beb8b8;*/
}

.footerArea .info {
    /*	display: inline-block;
    /*    width: 50%;
        vertical-align: baseline;
        padding-top: 1.5rem;*/
    text-align: right;
    /*
        margin-bottom: 1.25rem;*/
    /*
        -webkit-flex: 1 1 0;
        -ms-flex: 1 1 0;
        flex: 1 1 0;*/
    /*
        padding:0 0.625rem;*/
}

.footerArea .info>div {
    /*
        padding-left: 5px;*/
}

.footerArea .info>* {
    /*	display:inline-block;*/
}

.footerArea ul.fMenu span {
    display: block;
    width: 100%;
    /*
        padding-top:2em;
        padding-bottom:2em;*/
}

.footerArea ul.fMenu a {}

.footerArea ul.fMenu>li,
.footerArea .copyrightBar {
    /*	margin: 0;
    /*	display: inline-block;
        vertical-align: middle;*/
}

.footerArea .copyrightBar {
    /*margin-left: 0.625rem;
        float: left;*/
    /*
        margin-top: -0.5rem;
        margin-bottom: 0.625rem;*/
}

.footerArea ul.fTool {
    display: none;
    list-style-type: none;
    margin: 0;
    padding: 0;
}

.footerArea ul.fTool img {
    vertical-align: bottom;
}

/*
    .footerRow .info{
        font-size: 0.8rem !important
    }
    .footerRow .copyRight{
        font-size: 0.8rem !important
    }
    .footerRow .updateDate{
        font-size: 0.8rem !important
    }*/

.footerArea span {}

.footerArea ul.fTool>li {
    display: inline-block;
    position: relative;
    /*
        font-weight: lighter !important*/
}

/*
    .footerArea ul.fTool>li:after,*/
.footerArea ul.fTool>li:not(:last-child):after {
    content: "";
    position: absolute;
    top: 10%;
    bottom: 10%;
    right: -1px;
    width: 2px;
    background-color: #4f4b64;
}

.footerArea ul.fTool>li:after {
    /*
        content:"";
        position:absolute;
        top:0;
        bottom:0;
        right:0;
        width:1px;
        background-color:#5bcbcd;*/
}

/*
    .footerArea ul.fTool>li:last-child:after{
        display:none;
    }*/
.footerArea .fTool li a {
    padding: 0 1.875rem;
    /*
        color:#000;*/
}

.footerArea .info .fTool li a {
    padding: 0 12px;
    color: #000;
}

.copyR {
    text-align: center;
    margin-bottom: 1.25rem;
}

.copyR>div {
    display: inline-block;
}

.copyR>div:nth-child(2) {
    padding: 0 0.625rem;
}

.copyrightBar img {
    width: 100px;
    /*	padding-left: 0.625rem;*/
}

#footer div.system {
    width: 50%;
    text-align: right;
    float: right;
}

#footer div.copyright {
    width: 50%;
    text-align: right;
    float: right;
}

#footer div.w3c {
    text-align: center;
    margin-top: 1.25rem;
    margin-bottom: 1.25rem;
}

#footer div.w3c>div {
    display: inline-block;
    padding: 0.375rem 12px;
    vertical-align: middle;
}

#footer div.w3c .copyrightBar img {}

.footerArea .updateDate {
    font-family: IBMPlexMono;
    display: inline-block;
    padding: 0 12px;
    position: relative;
}

.footerArea .updateDate:before {}



.footerArea1 .footerContact .tit {}

.footerArea ul.fMenu {
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: 0;
}

.footerArea ul.fMenu,
.footerArea ul.fMenu li {}

.footerArea ul.fMenu li {
    vertical-align: top;
}

.footerArea ul.fMenu>li {}

.footerArea ul.fMenu .extmenu {
    padding: 0.625rem 0;
}

.footerArea ul.fMenu .extmenu .extmenu {
    padding: 0;
}

.footerArea ul.fMenu .extmenu>ul {
    padding-left: 0px;
}

.footerArea ul.fMenu .extmenu li {}

.footerArea .fMenu {
    margin: 0;
}

.footerArea .fMenu>li {
    display: block;
    margin-bottom: 0.625rem;
}

.footerArea .fMenu>li .extmenu a {
    padding-bottom: 1.25rem;
}

.footerArea .fMenu>li a br {
    display: none;
}

.footerArea .fMenu>li>a {
    position: relative;
    font-weight: bold;
    text-transform: uppercase;
    color: #212121;
    font-size: 1.25rem;
    margin-bottom: 1.25rem;
    display: block;
}

.footerArea .fMenu>li a {
    display: block;
}

.footerArea .fMenu>li .extmenu {
    font-size: 1rem;
}

.footerArea .fMenu>li>a {}

.footerArea .fMenu>li {
    position: relative;
}

/*
    .footerArea .fMenu>li.my_menu1>a:before{
        background-image: url(../images/footerMenuBtn/Photo_About_Us.jpeg);
        background-position: 50% 60%;
    }
    .footerArea .fMenu>li.my_menu2>a:before{
        background-image: url(../images/footerMenuBtn/Photo_Consular_Affairs.jpg);
        background-position: 48% 86%;
    }
    .footerArea .fMenu>li.my_menu3>a:before{
        background-image: url(../images/footerMenuBtn/Photo_Flags_and_Emblem.gif);
        background-position: 51% 49%;
    }
    .footerArea .fMenu>li.my_menu4>a:before{
        background-image: url(../images/footerMenuBtn/Photo_Visits.jpg);
        background-position: 53% 81%;
    }
    .footerArea .fMenu>li.my_menu5>a:before{
        background-image: url(../images/footerMenuBtn/Photo_Honours_and_Awards.jpg);
        background-position: 68% 86%;
    }*/
/*
    .footerArea .fMenu>li>a:before{
        content: "";
        width: 100%;
        height: 238px;
        z-index: 99;
        display: block;
        background-repeat: no-repeat;
        margin: 0 auto;
    }*/
.footerArea .fMenu>li .extmenu a {
    /*
        padding: 2px 1rem;*/
}

.footerArea .fMenu>li .firstItem {
    margin-left: 0
}

.footerArea .fMenu>li .lastItem {
    margin-right: 0
}

.footerArea .fMenu>li {
    display: inline-block;
}

.footerArea .fm {
    /*
        margin-bottom:1.875rem;
        font-size: 1.2rem;*/
}

.footerArea .il {
    padding: 0 0.625rem;
}

.footerArea .il li {
    display: inline-block;
}

.footerArea .il a {
    display: block;
    margin: 0;
    padding: 0.5rem 0.375rem;
}

.footerLeft {
    float: left;
}

.footerRight {
    float: right;
}

/*
    .footerArea .fMenu{color:#a6c3e0; margin-bottom:0.625rem;}
    .footerArea .fMenu a:link, .footerArea .fMenu a:visited{color:#a6c3e0;text-decoration:none;}
    .footerArea .fMenu a:hover, .footerArea .fMenu a:focus, .footerArea .fMenu a:active, .footerArea .fMenu a.active_section{text-decoration:underline;}*/

.copyRight {
    /*
        margin-bottom: 1.25rem;*/
    /*
        display:inline-block;
        text-align: center;*/
}

.myheaderTool {
    position: static;
    /*
        display: inline-block;/*
        padding-top: 23px;*/
    /*
        padding: 12px 0;
        font-size: 0.9rem;*/
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    /*
        -webkit-justify-content: flex-end;
        -ms-flex-pack: end;
        justify-content: flex-end;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;*/
    -webkit-justify-content: flex-end;
    -ms-flex-pack: end;
    justify-content: flex-end;
}

.myheaderTool>div {
    width: 100%;
    /*
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;*/
    /*
        white-space: nowrap;
        padding: 0 0.625rem;
        margin:0;
        position:relative;
        height: 22px;
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;*/
}

.myheaderTool .clientTool {
    white-space: nowrap;
    padding: 0 0;
    margin: 0;
    position: relative;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: flex-end;
    -ms-flex-pack: end;
    justify-content: flex-end;
}

.myheaderTool .clientTool:before {}

.myheaderTool .clientTool:after {}

.myheaderTool .clientTool {}

.myheaderTool .clientTool:nth-child(1):before,
.myheaderTool .clientTool:last-child:after {
    /*
        display:none;*/
}

.myheaderTool .ctitem>div {
    position: relative;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;

}

.myheaderTool .ctitem_menu>div:not(:first-child) {
    padding-left: 1.5rem;
}

.myheaderTool .ctitem>div a {
    font-size: 1.25rem;
    font-weight: bold;
    position: relative;
    margin: 0;
    padding: 0;
    display: block;
    text-decoration: none !important;
    line-height: 1.1428;
    color: #000;
    text-transform: uppercase;
}

.myheaderTool .ctitem>div.fast {}

.myheaderTool .menuBtn {
    padding-right: 0;
    padding-left: 0;
    z-index: 4000;
}

.myheaderTool .menuBtn a {
    display: block;
    width: 5rem;
    height: 5rem;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    background-color: #4676E2;
    background-image: linear-gradient(133deg, #4676E2 0%, #1FA1D9 85%, #1DADD8 100%);
}

.myheaderTool .menuBtn img {
    width: 2.25rem;
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
    transform-origin: center center;
    -webkit-transition: transform .3s cubic-bezier(.645, .045, .355, 1);
    -ms-transition: transform .3s cubic-bezier(.645, .045, .355, 1);
    transition: transform .3s cubic-bezier(.645, .045, .355, 1);
}

.myheaderTool .menuBtn a:focus img,
.myheaderTool .menuBtn a:hover img {
    -webkit-transform: scale(1.4, 1);
    -ms-transform: scale(1.4, 1);
    transform: scale(1.4, 1);
}

.myheaderTool .clientTool>div:last-child {}

.myheaderTool .clientTool .language li {
    position: relative;
}



.myheaderTool div {
    line-height: normal;
}

.myheaderTool .loginTool {
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
}

.myheaderTool .login>a {
    display: block;
    color: #fff;
    background-color: #1a67e9;
    /*
        border:1px solid #fff;*/
    padding: 12px 2.5rem;
    border-radius: 0.25rem;
    font-size: .666rem;
    margin: 0 5px;
    text-align: center;
    text-transform: uppercase;
    text-decoration: none;
}

.myheaderTool .signup>a {
    display: block;
    color: #fff;
    background-color: #3a3839;
    /*
        border:1px solid #fff;*/
    padding: 12px 2.5rem;
    border-radius: 0.25rem;
    font-size: .666rem;
    margin: 0 5px;
    text-align: center;
    text-transform: uppercase;
    text-decoration: none;
}

.myheaderTool>div.mobile_view {
    padding-left: 0px;
}

.myheaderTool>div.sitemap {
    padding-left: 0px;
    font-size: 0.875rem;
}

.myheaderTool>div.sitemap a {
    color: #3e5259;
}

.weatherTool {
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: flex-end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    margin-right: -1.875rem;
    color: #133453;
}

.weatherTool>div {
    padding: 0.5rem 15px;
    position: relative;
}

.weatherTool>div.cw {
    width: 55%;
}

.weatherTool>div.aqhi {
    width: 45%;
}

.weatherTool>div:not(:last-child):after {
    content: "";
    position: absolute;
    top: 5%;
    bottom: 10%;
    right: -0px;
    width: 1px;
    background-color: #b1b1b1;
}

.weatherTool a {
    color: #133453;
}

.weatherTool .heading {
    font-size: 1.1666rem;
    font-weight: bold;
    padding-bottom: 3px;
    border-bottom: 1px solid #dddddd;
}

.weatherTool .content {
    padding: 5px 0;
    border-top: 1px solid #5a5a5a;
}

.weatherTool .content .main {
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
}

.weatherTool .content .main .detail {
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}

.weatherTool .content .date {
    font-size: .8333rem;
    padding-right: 0.625rem;
}

.weatherTool .content .data {
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    font-size: 1.333rem;
    font-weight: bold;
    padding: 5px 0;
}

.weatherTool .content .icon {
    padding: 0 0.625rem;
    height: 0;
}

.weatherTool .info {
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    font-size: .8333rem;
}

.weatherTool .info .tit {
    font-weight: bold;
}

.weatherTool .info .cont {
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
}

.weatherTool .info .cont>div {
    position: relative;
}

.weatherTool .info .cont>div:not(:last-child) {
    padding-right: 5px;
}

.weatherTool .info .cont>div:not(:last-child):after {
    content: "/";
    position: absolute;
    right: 0;
    top: 0;
}

.weatherTool .info .cont>div a {
    display: block;
    padding: 0 0.625rem;
    position: relative;
    padding-right: 1.25rem;
}

.weatherTool .info .cont>div a:after {
    content: "";
    position: absolute;
    right: 0.5rem;
    top: 50%;
    width: 8.477px;
    height: 8.476px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8.476 8.476'%3E%3Cpath d='M 4.238244533538818 0 L 3.467654943466187 0.7705899477005005 L 6.384888172149658 3.687823295593262 L 0 3.687823295593262 L 0 4.788666248321533 L 6.384888172149658 4.788666248321533 L 3.467654943466187 7.705899238586426 L 4.238244533538818 8.476489067077637 L 8.476489067077637 4.238244533538818 L 4.238244533538818 0 Z'%3E%3C/path%3E%3C/svg%3E");
    background-repeat: no-repeat;
    -webkit-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    transform: translate(0, -50%);
}

.weatherTool .aqhi .content {
    font-size: .7291666rem;
    padding: 0.625rem 0;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

.weatherTool .aqhi .content>div {
    padding: 0 5px;
}

.weatherTool .aqhi .content .tit {
    font-weight: bold;
}

.headerTool .searchTool .adv_search a {
    display: block;
    color: #000;
    background-color: #fec64f;
    padding: 0.875rem 0.875rem;
    border-radius: 0.25rem;
    font-size: .666rem;
    margin: 0;
    text-align: center;
    text-transform: uppercase;
    text-decoration: none;
}

.mailTool {
    float: right;
}

.homeTool img {
    vertical-align: text-bottom;
}

/*.footerArea>div {
        background-image: url(../images/footer/footer_bg.gif);
        background-repeat: repeat;
    }*/
.footerArea .myLogo img {
    width: 5.625rem;
    display: block;
    margin: auto;
}

.footerArea .myLogo span {
    display: block;
    text-align: center;
    margin-top: 0.625rem;
}

/*=========Page Buttom=========*/

div.btmNav {
    /*
        max-width: 1300px;*/
    position: relative;
    /*
        right:3.125rem;
        position: absolute;*/
    z-index: 6000;
    /*margin: 3.125rem 0 0 0;
        /*height: 3.75rem;*/
    /*width: 815px;
        margin-top: 0.625rem;
        margin-bottom: 0.625rem;
        padding-right: 0.625rem;
        float: right;
        text-align:right;
        width: auto;*/
    /*
        padding-top: 1.875rem;
        padding-bottom: 1.875rem;*/
    /*
        opacity: 0;*/
    /*
        opacity: 0;*/
    -webkit-transition: opacity 0.5s ease-in;
    -moz-transition: opacity 0.5s ease-in;
    -ms-transition: opacity 0.5s ease-in;
    -o-transition: opacity 0.5s ease-in;
    transition: opacity 0.5s ease-in;
}

div.btmNav.active {
    opacity: 1;
    /*
        position: absolute;
        right: 5%;
        bottom: -1.5rem;*/
}

div.btmNav.fixed.active,
div.btmNav.fixed {
    right: 0;
    bottom: 0.625rem;
    position: fixed;
    /*opacity: 1;*/
    /*transition: opacity 0.5s ease-in;*/
    background-color: transparent;
}

/*.indexVersion div.btmNav{
        display:none;
    }*/
.backBtn {
    display: inline-block;
    /*background-image: url(../images/btn_back.png);
        background-repeat: no-repeat;*/
    /*width:54px;
        height: 1.125rem;*/
    float: left;
    /*padding: 0.625rem 15px;*/
    /*
        padding: 0.5rem 12px;*/
    /*padding: 0.375rem 12px;
        /*background-color: #d8e2ed;*/
    color: #3e5259;
    margin: 0;
    /*background-color: #3e535a;
        /*
        margin:0 0 0 3.125rem;*/
    /*background-color: #FAB965;*/
    font-weight: bold;
    /*margin-left:15px;*/
}

.topBtn {
    display: block;
    position: fixed;
    right: 1.5rem;
    bottom: 2.5rem;
    writing-mode: vertical-rl;
    text-orientation: sideways;
}

.backBtn a {
    padding: 5px 0.5rem 0.5rem 0.5rem;
    background-color: #446993;
    border-radius: 0.25rem;
    color: #FFF !important;
    /*color: #172e4d;*/
    /*margin-left: 1.5rem;*/
}

.backBtn a:hover,
.backBtn a:focus {
    text-decoration: none;
}

.topBtn a {
    display: block;
    position: relative;
    padding-inline-start: 2.5rem;
    font-weight: bold;
    font-size: 1.1111rem;
    color: #000;
}

.topBtn a:before {
    content: "";
    position: absolute;
    top: 0;
    left: 50%;
    width: 1.75rem;
    height: 22px;
    background-image: url(../images/icon/icon_arrow.svg);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 100% auto;
    translate: -50% 0;
    rotate: 90deg;
    -webkit-transition: all .3s ease;
    -ms-transition: all .3s ease;
    transition: all .3s ease;
}

.topBtn a:hover:before,
.topBtn a:focus:before {
    translate: -50% -0.25rem;
}

.topBtn a:hover,
.topBtn a:focus {
    text-decoration: none;
}

.my_anchor {
    font-size: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    position: static !important;
    display: block !important;
    height: 0 !important;
    width: 0 !important;
}


.qrcode {
    position: relative;
}

.qrcode>a {
    /*	position:absolute;
        top:1.25rem;
        right:0;
        display:inline-block;*/
}

.listStyleInline {
    display: inline;
    padding: 0;
}

.listStyleInline li,
.listStyleInline li>*,
.listStyleInline li>a {
    margin: 0 1px;
    padding: 0;
    float: none;
    display: inline;
}

/*=============Header============*/
.mainHeader {
    /*margin: 0.25rem 0.625rem 0.625rem 0.625rem;*/
    /*position: relative;
        /*padding-top: 70px;
        min-height: 302px;*/
    /*
        background-repeat: no-repeat;
        background-position: right bottom;
        max-height:215px;*/
    /*
        min-height: 246px;
        background-image: url(../images/section_banner/sec_banner0.jpg);
        background-repeat: no-repeat;
        background-position: center top;
        position: relative;*/
}

/*
    .mainHeader.section0 {
        background-image: url(../images/section_banner/sec_banner0.jpg);
    }
    .mainHeader.section1 {
        background-image: url(../images/section_banner/sec_banner1.jpg);
    }
    .mainHeader.section2 {
        background-image: url(../images/section_banner/sec_banner2.jpg);
    }
    .mainHeader.section3 {
        background-image: url(../images/section_banner/sec_banner3.jpg);
    }
    .mainHeader.section4 {
        background-image: url(../images/section_banner/sec_banner4.jpg);
    }
    .mainHeader.section5 {
        background-image: url(../images/section_banner/sec_banner5.jpg);
    }
    .mainHeader.section6 {
        background-image: url(../images/section_banner/sec_banner6.jpg);
    }*/
/*
    .mainHeader.shense {
        background-image: url(../images/section_banner/sec_banner_shense.jpg);
    }*/
.mainHeader .title {
    position: absolute;
    bottom: 15px;
    left: 15px;
    color: #05499c;
    font-size: 3.6rem;
    font-weight: bold;
    padding: 0.25rem 15px;
    box-shadow: 0 0 0.625rem -2px #000;
    background-color: #fff;
}

.mainHeader:before {
    /*	content:" ";
        position:absolute;
        left:0;
        right:0;
        height:215px;
        background-image:url('../images/bg_header.jpg');
        background-repeat:repeat-x;
        background-position:bottom;
        z-index:3100;*/
}

.mainHeader h1,
.mainHeader .h1 {
    /*	background-image: url('../images/banner_sec1_v2.png');*/
    background-repeat: no-repeat;
    background-position: right bottom;
}

.mainHeader.section0 h1 {
    /*	background-image: url('../images/banner_sec1_v2.png');*/
}

.mainHeader.section1 h1 {
    /*	background-image: url('../images/banner_sec1_v2.png');*/
}

.mainHeader.section2 h1 {
    /*background-image: none;
        padding:43px 0;*/
    /*	background-image: url('../images/banner_sec2_v2.png');*/
}

/*.mainHeader.section2:before{
        height:121px;
        background-image:url('../images/bg_header2.jpg');
    }
    .mainHeader.section3 h1{
        background-image: url('../images/banner_sec3_v2.png');
    }
    .mainHeader.section4 h1{
        background-image: url('../images/banner_sec4_v2.png');
    }
    .mainHeader.section5 h1{
        background-image: url('../images/banner_sec5_v2.png');
    }
    .mainHeader.section6 h1{
        background-image: url('../images/banner_sec6_v2.png');
    }
    .mainHeader.section7 h1{
        background-image: url('../images/banner_sec7_v2.png');
    }
    .mainHeader.section8 h1{
        background-image: url('../images/banner_sec8_v2.png');
    }
    .mainHeader.section9 h1{
        background-image: url('../images/banner_sec9_v2.png');
    }*/
.mainHeader.section1 h1 {
    /*	text-shadow: 2px 2px 0.25rem #125611;*/
}

.mainHeader h1,
.mainHeader .h1 {
    text-align: left;

    font-weight: bold;
    /* color: #125e76; */
    text-transform: uppercase;
    margin-top: 0;
    position: relative;
    z-index: 3500;

}

.mainContent .mainHeader h1,
.mainContent .mainHeader .h1 {
    /*position:relative;*/
    margin-bottom: 0;
    width: 100%;
    margin: 0;
    padding-right: 5rem;
}

.mainHeader hr {
    border-bottom: #203682 1px solid;
    border-top: 0;
    margin: 0;
    padding: 0;
}

.printTool {
    margin-top: 1em;
    display: inline-block;
    text-align: right;
    /*margin: 0 0.625rem 0 0.625rem;*/
    float: right;
    /*position: absolute;
        right: 0;
        bottom: 0.625rem;*/
}

.printTool a {
    color: #F00;
}

.mainContent h2 {
    /*font-size: 2rem;
        margin: 0;
        margin-bottom: 1.5rem;
        line-height: normal;
        color: #239051;*/
}

.mainContent h2 span {
    /*	position:relative;
        z-index: 1;*/
}

.mainContent h2 span:after {
    /*	content:"";
        position: absolute;
        right: -3.75rem;
        left: 1.25rem;
        bottom: 0;
        height: 15px;
        background-color: #ffc62e;
        z-index: -1;*/
}

.mainContent h2.alter {
    color: #166867
}

/*
    .mainContent>h1:nth-child(1){
        display:none;
    }*/
.mainContent h3 {
    font-size: 1.2rem;
}

.mainContent .h3 {
    font-size: 1.2rem;
    margin-left: 0px;
    font-weight: 600;
    padding: 0px;
    margin-right: 0px;
    margin-top: 0;
    margin-bottom: 15px;
}

/*=========mainContent=============*/
body #wrap .bodyArea .container:nth-child(2) {
    /*	padding: 1.5rem 0px;*/
    padding: 0px 0px;
}

.contentArea {
    padding-left: 5rem;
    max-width: 100%;
    /*	display: inline-block;
        width: 835px;
        min-height: 500px;*/
}

.subMenuVersion .contentArea {
    width: 80%;
}

.mainAreaMC.full .contentArea {
    width: 100%;
    padding-left: 0;
}



.indexVersion .contentArea {
    width: 100%;
    min-height: 0;
}

.subMenuVersion .subMenuFlex {
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
}

.mainContent {
    margin: 0px 0px;
    /*padding-top:0.625rem;*/
}

.bodyArea {
    z-index: 3000;
    position: relative;
    line-height: normal;
    min-height: 560px;
}

.indexVersion .bodyArea {
    padding-top: 0 !important;
    background-color: transparent;
}

.bodyArea ul,
.bodyArea ol {
    margin-bottom: 1em;
}

.bodyArea .container {
    /*z-index: 3000;
        display: block;
        height: auto;
        padding-top: 0;
        padding-right: 1.875rem;
        padding-bottom: 0;
        padding-left: 1.875rem;*/
}

/*.bodyArea>div
    {
        background-color: #efeee7;
        background-image: url(../images/shadow.png);
        background-repeat: repeat-y;
        background-position: 185px 0;
        position: relative;
    }
    */
.table_photo tr td {
    padding: 15px 15px;
    font-size: 1rem;
    line-height: 1.5em;
    border: 1px solid #eceeee;
}

.table_student {
    border-width: 5px;
    border-color: grey;
    border-style: dotted;
    font-size: 1rem;
    line-height: 1.5em;
}

.table_header {
    border: 1px none #6a7499;
    border-collapse: collapse;
    padding: 0.625rem 15px;
    background-color: #622a8b;
    color: #ffffff;
    font-weight: bold;
    text-align: center;
    font-size: 1rem
}

.table_header_2 {
    border: 1px none #6a7499;
    border-collapse: collapse;
    padding: 0.625rem 15px;
    background-color: #32a1bd;
    color: #ffffff;
    font-weight: bold;
    text-align: center;
    font-size: 1rem
}

.cap_text {
    font-size: 0.9rem;
}

.titleBlue {
    color: #203682;
    font-size: 1.6rem;
    font-weight: bold;
    border-bottom: #203682 1px solid;
    padding-bottom: 5px;
    margin-bottom: 1.25rem;
}

.rightBtn {
    float: right;
    z-index: 7500;
    position: relative;
    padding-bottom: 5px;
}

.blueBtn img {
    opacity: 0.7;
    filter: alpha(opacity=70);
    /*background-color:#7c9fc7;*/
}

.blueBtnOn img {
    opacity: 1;
    filter: alpha(opacity=100);
    /*background-color:#006cae;*/
}

.indexContent,
.whatIsNew,
.eventCalender {
    display: inline-block;
    *zoom: 1;
    *display: inline;
}

.indexContent {
    width: 38%;
}

.whatIsNew,
.eventCalender {
    width: 405px;
    /*margin-left:2%;*/
}

.whatIsNew ul {
    margin: 0;
    padding: 0;
    color: #006ab6;
}

.whatIsNew ul>li {
    margin: 1.5rem 0;
}

.whatIsNew ul .newsDate {
    color: #3e5259;
}

.eventCalender .event_tit {
    font-weight: bold;
    color: #3e5259;
}

.eventCalender .event_tit.holiday {
    color: #f00;
}

.eventCalender ul {
    margin: 0;
    padding: 0;
    margin-left: 15px;
    color: #006ab6;
}

.eventCalender ul>li {
    margin: 5px 0;
}

.eventCalender .eventList>div {
    padding: 0.625rem;
}

.eventCalender .bgColorZe {
    background-color: #edf1f4;
}

/*==============================*/
.headerArea {
    width: 100%;
    top: 0;
    z-index: 7000;
}

.headerArea .headerTool {
    /*
        width: 1280px;*/
    max-width: 100%;
    /*    position: fixed;
        width: 100%;
        transform: translateX(-50%);
        left: 50%;*/
}

.headerArea .headerArea2 .headerTool {
    /*
        border-left: 1px solid #eaeaea;
        border-right: 1px solid #eaeaea;
        padding-top: 3.125rem;*/
}

.headerArea .headerArea2 .myLogo {
    /*
        border-bottom: 1px solid #eaeaea;*/
}

.headerArea .headerTool .headerNav {
    /*
        max-width: 1280px;*/
    margin: auto;
}

.headerArea .headerArea1 .headerTool .headerNav {
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    padding: 0;
    justify-content: space-between;
}

.headerArea .headerArea2 .headerTool .headerNav {
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

.headerArea .headerArea2 .headerTool .headerNav>div {}

.headerArea .headerArea2 .headerTool .headerNav>div.weatherTool {
    width: 60%;
    padding: 0 95px;
}

.headerArea .headerTool .searchTool {
    /*
        background-color:#fff;
        box-shadow: 0 0.625rem 1.25rem -0.25rem rgb(0 0 0 / 40%);*/
}

.headerArea .headerTool .searchTool .tab a {
    display: block;
    padding: 0.5rem 15px;
    border-left: 3px solid transparent;
}

.headerArea .headerTool .searchTool .tab a:hover,
.headerArea .headerTool .searchTool .tab a:focus,
.headerArea .headerTool .searchTool .tab .active a {
    background-color: #f3f3f3;
    border-left-color: #3a95de;
}

.headerArea.fixed:before {
    content: "";
    /*
        position: fixed;
        height: 12.5rem;
        background-color: rgba(255,255,255,1);*/
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

.indexVersion .headerArea {
    height: auto;
}

.indexVersion .headerArea:before,
.indexVersion .headerArea.fixed:before,
.indexVersion .headerArea:after {
    display: none;
}

.indexVersion .headerArea .headerTool {
    position: static;
    width: auto;
    left: auto;
    transform: none;
}

.indexVersion .headerArea .headerTool .headerNav {
    max-width: none;
}

.headerArea.fixed .myLogo {
    margin-top: -12px;
}

.headerArea .myLogo .logo_0>a>img {
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
    max-height: 400px;
}

.fixedHeader .headerArea .myLogo .logo_0>a>img {}

.headerArea.fixed .myLogo .logo_0>a>img {
    max-width: 355px;
    max-height: 5rem;
    width: auto;
    height: auto;
    padding: 12px;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

.headerArea.fixed .headerTop {
    min-height: 3.75rem;
}

.headerArea .more {
    display: none;
}

.headerArea.fixed .more {
    display: inline-block;
}

.headerArea .headerTool .mobSearch,
.headerArea.fixed br,
.headerArea.fixed .headerTool .searchTool {
    display: none;
}

.headerArea.fixed .headerTool .mobSearch {
    display: inline-block;
}

.headerArea.fixed .headerTool .mobSearch img,
.headerArea.fixed .headerTool .print img,
.headerArea.fixed .headerTool .share img {
    height: 1.25rem;
    padding: 0;
}

.headerArea.fixed .headerTool .searchTool {
    position: absolute;
    top: 100%;
    margin: 0;
    background-color: #fff;
    left: 0;
    right: 0;
}

.headerArea.fixed .searchTool form {
    float: none;
    text-align: center;
    padding: 0;
    background-color: #fff;
    -webkit-transition: background-color 0.3s ease-in-out, padding 0.3s ease;
    -moz-transition: background-color 0.3s ease-in-out, padding 0.3s ease;
    -ms-transition: background-color 0.3s ease-in-out, padding 0.3s ease;
    -o-transition: background-color 0.3s ease-in-out, padding 0.3s ease;
    transition: background-color 0.3s ease-in-out, padding 0.3s ease;
}

.headerArea.fixed .headerTool .searchTool.mobActive {
    display: block;
}

.headerArea.fixed .searchTool.mobActive form {
    background-color: #f8f8f8;
    padding: 1.875rem 0;
}

.headerArea.fixed .headerTool .searchTool input {
    max-width: 100%;
    width: 500px;
}

/*===========AAA================*/
/*.headerArea, footerArea
    {
        font-size: .7rem;
    }*/

#footer {}

.mySize0 .headerArea,
.mySize0 .footerArea {}

.mySize0 .headerArea,
.mySize0 .footerArea {
    /*	height:auto;*/
}

/*
    .mySize1 .headerArea, .mySize1 .footerArea {
        font-size: 1rem;
    }
    .mySize2 .headerArea, .mySize2 .footerArea {
        font-size: 1rem;
    }*/
/*.mySize0 .mainContent
    {
        font-size: .7rem;
    }
    
    .mySize1 .mainContent
    {
        font-size: 1.1rem;
    }
    
    .mySize2 .mainContent
    {
        font-size: 1.5rem;
    }*/
/*
    .mySize0 #flexslider
    {
        margin-bottom:1em;
    }
    .mySize1 #flexslider
    {
        margin-bottom:3.5em;
    }
    .mySize2 #flexslider
    {
        margin-bottom:5.5em;
    }
    */
/*==========footerBanner==========*/
.footerBanner {
    margin: auto;
    padding: 1.25rem 0;
}

.footerBanner a {
    display: block;
}

.footerBanner.slides {
    margin: 0 -0.625rem;
}

.footerBanner.slides>li {
    display: inline-block;
    padding: 0.625rem 0.625rem;
}

.footerBanner li img {}

.footerBanner a.w3c img {
    height: 34px;
}

.footerBanner a.bhk img {
    width: 10rem;
    max-width: 100%;
}

.footerBanner a.rd img {
    height: 3.75rem;
}

.footerBanner .mfb_mail {
    position: relative;
    border: 2px solid #740001;
    box-shadow: 2px 2px 0 #bbb;
    color: #000;
    font-size: 1.4rem;
    padding: 0.5rem 1.25rem;
}

.footerBanner .mfb_mail:before {
    content: "";
    display: inline-block;
    width: 33px;
    height: 1.75rem;
    margin-right: 0.625rem;
    background-image: url(../images/icon_email.png);
    background-repeat: no-repeat;
    vertical-align: bottom;
}

/*============================*/
.footertool {
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-align-items: flex-end;
    -ms-flex-align: end;
    align-items: flex-end;
    padding: 1.25rem 0;
    text-align: center;
    font-size: 1rem;
}

/* =================================================================================================
        Right Scrolling Module with Pagnation
    ================================================================================================= */

/*
     * simplyScroll 1.0.3 - a scroll-tastic jQuery plugin
     *
     * http://logicbox.net/jquery/simplyscroll
     * http://logicbox.net/blog/simplyscroll-jquery-plugin
     * http://plugins.jquery.com/project/simplyScroll
     *
     * Copyright (c) 2009 Will Kelly - http://logicbox.net
     *
     * Dual licensed under the MIT (MIT-LICENSE.txt)
     * and GPL (GPL-LICENSE.txt) licenses.
     *
     * Last revised: 03/07/2009 21:13
     *
     */

.simply-scroll-container {
    /* Container DIV - automatically generated */
    position: relative;
}

.simply-scroll-clip {
    /* Clip DIV - automatically generated */
    position: relative;
    overflow: hidden;
    z-index: 2;
}

.simply-scroll-list {
    /* UL/OL/DIV - the element that simplyScroll is inited on */
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    overflow: hidden;
    margin: 0;
    padding: 0;
    list-style: none;
}

.simply-scroll-list li {
    padding: 0.5rem 0px 0px;
    margin: 0;
    list-style: none;
}

.simply-scroll-list li img {
    border: none;
    display: block;
}

.simply-scroll-btn {
    position: absolute;
    width: 42px;
    height: 44px;
    z-index: 3;
    cursor: pointer;
}

.simply-scroll-btn-left {
    left: 0.375rem;
    bottom: 0.375rem;
    background-position: 0 -44px;
}

.simply-scroll-btn-left.disabled {
    background-position: 0 0 !important;
}

.simply-scroll-btn-left:hover {
    background-position: 0 -88px;
}

.simply-scroll-btn-right {
    right: 0.375rem;
    bottom: 0.375rem;
    background-position: 84px -44px;
}

.simply-scroll-btn-right.disabled {
    background-position: 84px 0 !important;
}

.simply-scroll-btn-right:hover {
    background-position: 84px -88px;
}

.simply-scroll-btn-up {
    right: 0.375rem;
    top: 0.375rem;
    background-position: -11.625rem -44px;
}

.simply-scroll-btn-up.disabled {
    background-position: -11.625rem 0 !important;
}

.simply-scroll-btn-up:hover {
    background-position: -11.625rem -88px;
}

.simply-scroll-btn-down {
    right: 0.375rem;
    bottom: 0.375rem;
    background-position: -42px -44px;
}

.simply-scroll-btn-down.disabled {
    background-position: -42px 0 !important;
}

.simply-scroll-btn-down:hover {
    background-position: -42px -88px;
}

/* Custom class modifications - override classees
    
    .simply-scroll is default
    
    */

.simply-scroll {
    /* Customisable base class for style override DIV */
    width: 100%;
    /*width: 580px;*/
    height: 480px;
    margin-bottom: 1em;
}

.simply-scroll .simply-scroll-clip {
    width: 580px;
    height: 480px;
    border-top: #a2adc1 1px solid;
}

.simply-scroll .simply-scroll-list {}

.simply-scroll .simply-scroll-list li {
    float: left;
    width: 550px;
    height: 160px;
}

.simply-scroll .simply-scroll-list li img {}

.simply-scroll .simply-scroll-btn {}

.simply-scroll .simply-scroll-btn-left {}

.simply-scroll .simply-scroll-btn-left.disabled {}

.simply-scroll .simply-scroll-btn-left:hover {}

.simply-scroll .simply-scroll-btn-right {}

.simply-scroll .simply-scroll-btn-right.disabled {}

.simply-scroll .simply-scroll-btn-right:hover {}

.simply-scroll .simply-scroll-btn-up {}

.simply-scroll .simply-scroll-btn-up.disabled {}

.simply-scroll .simply-scroll-btn-up:hover {}

.simply-scroll .simply-scroll-btn-down {}

.simply-scroll .simply-scroll-btn-down.disabled {}

.simply-scroll .simply-scroll-btn-down:hover {}

/* Vertical scroller example */

.vert {
    /* wider than clip to position buttons to side */
    width: 340px;
    height: 400px;
    margin-bottom: 1.5em;
}

.vert .simply-scroll-clip {
    width: 290px;
    height: 400px;
}

.vert .simply-scroll-list {}

.vert .simply-scroll-list li {
    width: 290px;
    height: 200px;
}

.vert .simply-scroll-list li img {}

.vert .simply-scroll-btn {}

.vert .simply-scroll-btn-up {
    /* modified btn pos */
    right: 0;
    top: 0;
}

.vert .simply-scroll-btn-up.disabled {}

.vert .simply-scroll-btn-up:hover {}

.vert .simply-scroll-btn-down {
    /* modified btn pos */
    right: 0;
    top: 52px;
}

.vert .simply-scroll-btn-down.disabled {}

.vert .simply-scroll-btn-down:hover {}

/* NOTE left-right classes wouldn't be needed on vertical scroller */

.simply-scroll .simply-scroll-list .newsList>li {
    height: inherit;
    margin: 0;
    padding: 0;
    /*border-bottom:1px solid #bdcfe3;
            /*list-style-type:disc;*/
    width: inherit;
}

.simply-scroll .simply-scroll-list .newsList>li>div {
    padding: 0.625rem 45px;
}

/*========================================Clf Style===============================================*/
.leftClfArea {
    float: left;
    padding: 12px 0;
    /*
        font-size: 1.4rem;/*padding-left: 0.625rem;*/
}

.rightClfArea {
    float: right;
}

.books_top_box {
    border-bottom: 1px;
    text-align: center;
    border-left: 1px;
    width: 1.25rem;
    height: 180px;
    border-top: 1px;
    border-right: 1px;
    background-color: #f4f4f4;
}

.books_bottom_box {
    width: 250px;
    background-color: #fcf0e2;
    text-align: center;
    height: 100px;
    vertical-align: middle;
}

.issue {
    float: left;
    margin: 5px;
    padding: 0.625rem;
    width: 350px;
    height: 185px;
    border: 1px solid black;
}

.issue_title {
    color: #FFFFFF;
    font-size: 1.6rem;
    background-color: #dc3431;
    padding: 5px 5px 5px 5px;
    width: 100px;
    margin-top: -12px;
    text-align: center;
}

.mailTool {
    width: 102px;
    height: 55px;
    background-image: url('../images/btn_email.png');
    background-repeat: no-repeat;
    font-weight: bold;
    text-align: center;
}

.headerArea .headerTool .mailTool a {
    color: #fff;
    width: 3.125rem;
    display: block;
    margin: 3px auto;
    line-height: 1.5em;
}

div.flexslider {
    /*margin-top:-3.75rem;
        margin-bottom:-3.125rem;*/
}

.indexContent {
    position: relative;
    z-index: 8000;
    width: 940px;
    margin: 0 15px;
    padding: 0.625rem 0;
}

.indexContent>div {
    display: inline-block;
}

.colorSort {
    width: 180px;
    padding: 0 0.625rem;
}

.colorSort>div {
    background-color: #efefef;
    padding: 0.625rem 3.125rem 1.25rem 0.625rem;
    margin-bottom: 1px;
}

.colorSort .cerise {
    border-left: 5px solid #DA3287;
}

.colorSort .lochmara {
    border-left: 5px solid #007EC7;
}

.colorSort .hippieGreen {
    border-left: 5px solid #53824B;
}

.colorSort .lavenderIndigo {
    border-left: 5px solid #9457EB;
}

.newsArea {
    width: 375px;
    padding: 0 0.625rem;
}

.newsArea .newsTopic {
    color: #ab264c;
    font-weight: bold;
    font-size: 1.2rem;
    padding-top: 0.625rem;
}

.newsArea .newsDate {
    color: #3e5259;
    font-weight: bold;
}

.newsArea .newsTitle,
.newsArea .newsTitle a {
    color: #4f3e71;
}

.newsContent {
    overflow-y: auto;
    max-height: 215px;
}

.newsContent>div {
    margin-top: 1.25rem;
}

.header2 {
    display: none;
}

/*=================================*/
.mainContent .full {
    padding: 0;
}

.index_row {
    margin-bottom: 3.125rem;
}

.mainContent .main_left {
    width: 770px;
    float: right;
    max-width: 100%;
}

.mainContent .sub_right {
    margin-left: 0.625rem;
    width: 250px;
    float: left;
    position: relative;
}

.simple_tab {
    display: inline-block;
    font-weight: bold;
    height: 34px;
    padding: 0.625rem 2.5rem 0.625rem 1.25rem;
    position: relative;
    margin-top: 5px;
    margin-bottom: 15px;
    background-color: #e8c8bb;
    background-image: url(../images/tag/white_arrow.png);
    background-repeat: no-repeat;
    background-position: center right;
}

.simple_tab:after {
    content: " ";
    position: absolute;
    width: 17px;
    height: 34px;
    background-image: url(../images/tag/deep_pink.png);
    background-repeat: no-repeat;
    left: 100%;
    top: 0;
}

/*==============================*/
#cloud {
    width: 380px;
    height: 280px;
}

#cloud>div {
    margin-right: 5px;
    margin-bottom: 5px;
    display: inline-block;
}

#cloud a {
    display: block;
    padding: 0.5rem 1.5rem;
    color: #fff;
    background-color: #c4c4c4;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    font-weight: bold;
}

/*==================*/
#chart>div {
    width: 420px;
    height: 280px;
    margin: 1.875rem 5px;
    float: left;
}

/*#chart>div>div{
        position:relative;
    }
    #chart>div>div:after{
        content:" ";
        display: block !important;
        float: none !important;
        clear: both !important;
        width: 0 !important;
        padding: 0 !important;
        margin: 0 !important;
        border: 0 !important;
    }*/
/*==================*/
div.ms-options-wrap {
    position: relative;
    display: inline-block;
    vertical-align: initial;
    margin: 0.625rem 0.625rem;
    width: 600px;
}

span.ms_text {
    width: 1.875rem;
    margin-left: 5px;
    margin-right: 5px;
    display: inline-block;
}

.ms-options ul li {
    margin: 0;
}

/*==================*/
.footerMenu ul.menuLv0 {}

.footerMenu ul li {}

.footerMenu ul li ul {}

.footerMenu ul li ul ul {
    display: none
}

.footerArea ul.fMenu span.caret {
    display: none;
}

p.topic {
    padding-top: 0px;
}

.topic {
    font-family: Open Sans, "Arial", "Helvetica", "sans-serif", "microsoft jhenghei";
    font-weight: 800;
}

/*==========*/
.roman_list {
    list-style-type: lower-roman;
}

.mainContent {
    /*	position:relative;*/
    /*	padding-top:1.875rem;*/
}

.mainContent .left_img {
    width: 360px;
    position: absolute;
}

.mainContent .right_cont {
    padding-left: 360px;
}

.mainContent .list_anchor {
    padding-top: 1.5rem;
    border-top: 2px solid #133c8b;
    margin-bottom: 5rem;
}

.mainContent .list_anchor ul {
    padding-left: 0;
    list-style-type: none;
}

.list_anchor li {
    float: left;
    display: inline-block;
    position: relative;
    margin: 0;
}

.list_anchor li span {
    position: absolute;
    left: 0;
    top: 0;
}

.list_anchor li.fst a {
    padding-left: 0;
}

.list_anchor li.lst a {
    padding-right: 0;
}

.list_anchor li a {
    display: block;
    padding: 0 2em;
    color: #000 !important;
    text-decoration: none !important;
}

.list_anchor li.active a {
    color: #32569a !important;
}

/*====*/
.iconPdf {
    margin-left: 5px;
    margin-right: 5px;
    vertical-align: middle;
}

.iconPdf img {
    margin-top: -12px;
}

.iconDoc {
    margin-left: 5px;
    margin-right: 5px;
    vertical-align: text-bottom;
}

.system_maintenance_schedule table {
    width: 100%;
}

.system_maintenance_schedule table ul {
    padding-left: 5px;
}

.uppercase {
    text-transform: uppercase;
}

.AML h3 {
    padding-bottom: 0.625rem;
}

.alerts .cont .panel .panel-title a {
    text-decoration: none !important;
    font-weight: bold !important;
}

.subMenu {
    border-top: 1px #bdbdbd solid;
    text-align: left;
    margin: 0;
    padding: 0;
    width: 300px;
    max-width: 100%;
}

.subMenu>li {}

.subMenu>li>a {
    font-size: 1.25rem;
    font-weight: bold;
    text-transform: uppercase;
    padding-top: 1rem;
    padding-bottom: 1rem;
    padding-left: 1.25rem;
    color: #757575;
    border-bottom: 1px solid #bdbdbd;
    display: block;
    position: relative;
    text-decoration: none;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

.subMenu>li>a:hover,
.subMenu>li>a:focus {
    color: #fff;
    background-color: #3058cc;
}

.leftMenu .subMenu>li.active>a,
.subMenu>li>a.leftbtn.active_sub_section,
.subMenu>li a.leftbtn.active_sub_section,
.subMenu>li>a.active_section.active_section_sub {
    color: #fff;
    background-color: #000;
}

.panel-body h3 {
    text-align: justify;
}

.table_sub_title {
    font-weight: bold !important;
}

.alerts .cont:after {
    content: " ";
    clear: both;
    display: block;
}

.membershop_list {
    padding-left: 0.625rem;
}

.download_pdf_remark {
    font-style: italic;
    margin-top: 1.875rem;
}

ol ol.future_terms2 {
    list-style-type: lower-roman;
}

ol.future_terms {
    list-style-type: lower-alpha;
}

/*============================*/
.tMenu.menuLv0>li>a {
    position: absolute;
}

.tMenu.menuLv0>li>a.excLi:before {
    /*	content:" ";
        display:block;
        width:11px;
        height:0.375rem;
    /*	background-image:url(../images/icon_arrow.png);
        background-repeat:no-repeat;
        position:absolute;
        left:0;
        top:50%;
        margin-top:-3px;*/
}

/*==============*/
.myboard_nl {
    position: relative;
    display: inline-block;
    width: 100%;
    max-width: 240px;
    margin: auto;
    padding: 12px;
    color: #3f3f3f;
    border: 1px solid #cecece;
    border-radius: 5px;
}

.myitem_list.whatsnew_list .myboard_nl {
    min-height: 300px;
}

.myitem_list.my_pdf_div.activities_photo .myboard_nl {
    max-width: 190px;
    min-height: 235px;
}

.myitem_list.my_pdf_div.tv_series_list .myboard_nl {
    max-width: 195px;
    border: none;
}

.myboard_nl .id {
    position: absolute;
    top: 12px;
    left: 12px;
    font-size: 2rem;
    line-height: 1em;
}

.myboard_nl .cover {
    margin: auto;
    text-align: center;
}

.myboard_nl .date {
    float: right;
    margin-top: 0.625rem;
    font-weight: normal;
    margin-bottom: 0.625rem;
    font-size: .8rem;
    color: #575757;
}

/*=======================*/
.mytab ul {
    text-align: center;
    border-bottom: 1px solid #cbcbcb;
}

.mytab li {
    display: inline-block;
    width: 24%;
    margin: 0;
    border: 0;
}

.mytab a {
    padding-bottom: 12px;
    display: inline-block;
    text-align: center;
    color: #424242;
    font-size: 1.6rem;
    font-weight: bold;
    text-decoration: none !important;
    position: relative;
}

.chineseVersion .mytab a {
    letter-spacing: .16em;
}

.mytab li.active a {
    color: #08836e;
}

.mytab li.active a:after {
    content: " ";
    position: absolute;
    left: 0;
    right: 0;
    height: 0.625rem;
    bottom: -5px;
    background-color: #08836e;
}

/*===========*/
.rightImg {
    float: right;
    width: 200px;
    margin-left: 1.875rem;
}

.wrapper-expandable.active .box-style-wrapper {
    z-index: 1000;
    position: relative;
    height: auto;
    width: auto;
    opacity: 1;
    filter: alpha(opacity=100);
    visibility: visible;
}

.wrapper-expandable .box-style-wrapper,
.wrapper-expandable.hide .box-style-wrapper {
    z-index: -1;
    position: fixed;
    height: 0;
    width: 0;
    -webkit-transition: height 0.5s ease;
    -moz-transition: height 0.5s ease;
    -o-transition: height 0.5s ease;
    transition: height 0.5s ease;
    -webkit-transition: opacity .5s;
    -moz-transition: opacity .5s;
    -o-transition: opacity .5s;
    transition: opacity .5s;
    opacity: 0;
    filter: alpha(opacity=0);
    visibility: hidden;
    overflow: hidden;
}

.wrapper-expandable {
    margin-bottom: 0.625rem;
}

.wrapper-expandable.active {
    margin-bottom: 1.25rem;
}

.expandable-title {
    margin-bottom: 15px;
}

.expandable-title h3 {
    padding: 0;
    margin: 0;
}

.expandable-title a {
    color: #404042 !important;
    text-decoration: none !important;
    padding: 1.25rem 1rem;
    padding-right: 1.875rem;
    background-color: #c6e6f5;
    display: block;
    border-radius: 0.25rem;
    position: relative;
}

.active .expandable-title a {
    background-color: #b9d483;
}

.expandable-title a:after {
    content: " ";
    position: absolute;
    right: 0.625rem;
    top: 50%;
    margin-top: -0.625rem;
    width: 17px;
    height: 1.125rem;
    background-image: url('../images/icon_expansion.png');
    background-repeat: no-repeat;
}

.active .expandable-title a:after {
    background-image: url('../images/icon_expansion_on.png');
}

/*=============Close Up===============*/
#close_up {
    z-index: -1;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    opacity: 0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    -webkit-opacity: 0;
    -moz-opacity: 0;
    filter: alpha(opacity=0);
    -webkit-transition: all .4s ease;
    -moz-transition: all .4s ease;
    -ms-transition: all .4s ease;
    -o-transition: all .4s ease;
    transition: all .4s ease;
}

.fixCloseUp #close_up.transition,
#close_up.active.transition {
    opacity: 0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    -webkit-opacity: 0;
    -moz-opacity: 0;
    filter: alpha(opacity=0);
}

.fixCloseUp #close_up,
#close_up.active {
    z-index: 9000;
    opacity: 1;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    -webkit-opacity: 1;
    -moz-opacity: 1;
    filter: alpha(opacity=100);
}

#close_up .bg {
    z-index: 9100;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: rgba(0, 0, 0, 0.5);
    /* background-image: linear-gradient(0deg, #4676E2 0%, #1FA1D9 85%, #1DADD8 100%); */
}

#close_up .area {
    z-index: 9200;
    position: relative;
    width: 100%;
    min-height: 100vh;
}

#close_up .close {
    position: fixed;
    top: 0.5rem;
    right: 0.5rem;
}

#close_up .close:hover {}

#close_up .close a {
    display: block;
    position: relative;
    text-decoration: none;
    text-transform: uppercase;
    text-align: center;
    font-size: 1.5rem;
    font-weight: bold;
    padding: 1.125rem 1.5rem;
    padding-right: 3.5rem;
}

#close_up .close a:before {
    content: "";
    position: absolute;
    top: 1.5rem;
    right: 1.5rem;
    width: 1.5rem;
    height: 1.5rem;
    background-image: url(../images/icon/icon_close.svg);
}

#close_up .close:hover a {
    background-color: rgba(255, 255, 255, .8);
}

#close_up .area .title {
    /*
        font-weight: bold;
        font-size: 1em;
        background-color: #fff;
        color: #444;
        padding: 20px 20px 40px 20px;*/
}

#close_up .area .main {
    padding: 5rem 7.5rem;
    position: relative;
    text-align: center;
    width: 1535px;
    max-width: 100%;
    min-height: 100vh;
    background-color: #fff;
    margin-left: auto;
}

#close_up .area .main .left {
    width: 40%;
    float: left;
}

#close_up .area .main .right {
    width: 60%;
    float: right;
}

#close_up .area .main .img {
    padding: 5px;
}

#close_up .area .main .img img {
    width: 100%;
}

#close_up .area .main .caption {
    padding: 5px;
}

#close_up .area .main .cont {
    padding: 5px;
    padding-left: 15px;
}

#close_up .area .main .cont p {
    margin-bottom: 15px;
}

#close_up .main img {
    max-height: 800px;
}

#close_up .sticky-header {
    position: sticky;
    top: 0;
    z-index: 2;
    background-color: #fff;
    padding-top: 0.5rem;
}

/*=================*/
.pop_photo ul {
    margin: 0;
    padding: 0;
    list-style-type: none;
}

.pop_photo li {
    display: inline-block;
    width: 25%;
    min-width: 120px;
    margin: 0;
    padding: 0.625rem;
}

/*=================*/
/*.my_pdf {
        background-image: url(../images/icon_pdf_title.png);
        background-repeat: no-repeat;
        background-position: 12px 0.375rem;
        background-color: #e2e3e2;
        display: inline-block;
        border-radius: 0.375rem;
    }
    
    .my_pdf a {
        text-decoration: none !important;
        color: #4b4b4b;
        font-size: 1.2rem;
        padding: 22px 12px 0.375rem 71px;
        min-height: 65px;
        display: block;
    }
    
    .chineseVersion .my_pdf a {
        letter-spacing: .16em;
    }
    */
/*=============================*/
.fix_line {
    position: absolute;
    left: 0;
    right: 0;
    height: 3px;
    background-color: #504098;
}

.fix_line.under {
    margin-top: -3px;
}

ul.lo_alp>li {
    list-style-type: lower-alpha;
}

ul.lo_rom>li {
    list-style-type: lower-roman;
}

ul.disc>li {
    list-style-type: disc;
}

ol>li::marker {
    content: "(" counter(list-item)") ";
}

.chineseVersion ol>li::marker {
    content: "(" counter(list-item, trad-chinese-informal)") ";
}

.leftMenu {}

.subMenu li>a:before {}

/*=======================================*/
.sliderArea {
    height: 275px;
    overflow: hidden;
    margin-bottom: 2.5rem;
}

.sliderArea img {
    top: 0;
}

.sliderBg {
    position: absolute;
    left: 0;
    right: 0;
    height: 275px;
    background-color: #fff;
}

div.flexslider {
    margin-bottom: 0;
    border: 0;
}

.bodyArea .flexslider ul,
.bodyArea .flexslider ol {
    margin: 0;
    padding: 0;
}

.bodyArea .flexslider .slides {
    margin-bottom: 0;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
}

.bodyArea .flexslider .flex-control-paging {
    position: relative;
    bottom: auto;
    padding-top: 2.5rem;
    height: 0.5rem;
}

.flex-control-nav li {
    margin: 0 0.375rem;
    display: inline-block;
    zoom: 1;
}

.bodyArea #flexslider-fns .flex-control-paging li {
    -webkit-box-flex: 0;
    -ms-flex: 0 1 2.5rem;
    flex: 0 1 2.5rem;
}

.bodyArea #flexslider-fns .flexslider .flex-control-paging li a {
    width: 100%;
}

.bodyArea .flexslider .flex-control-paging li {
    vertical-align: middle;
}

.bodyArea .flexslider .flex-control-paging li.myFFPrev a,
.bodyArea .flexslider .flex-control-paging li.myFFNext a {
    border-radius: 0;
    box-shadow: none;
    width: 1rem;
    height: 1rem;
    position: relative;
    background-color: transparent;
    font-size: 0;
}

.bodyArea .flexslider .flex-control-paging li:not(.myFFPrev):not(.myFFNext) a {
    border-radius: 0;
    box-shadow: none;
    width: 2.5rem;
    height: 0.5rem;
    position: relative;
    background-color: transparent;
    font-size: 0;
    display: flex;
    align-items: center;
}

.bodyArea .flexslider .flex-control-paging li:not(.myFFPrev):not(.myFFNext) a:before {
    content: "";
    background: #bdbdbd;
    display: block;
    width: 100%;
    height: 1px;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

.bodyArea .flexslider .flex-control-paging li a:hover {}

.bodyArea .flexslider .flex-control-paging li a:focus:before,
.bodyArea .flexslider .flex-control-paging li a:hover:before {
    background: #444;
}

.bodyArea .flexslider .flex-control-paging li a.flex-active {
    background-color: transparent;
    cursor: default;
}

.bodyArea .flexslider .flex-control-paging li a.flex-active:before {
    background: #000 !important;
    height: 100% !important;
}

#flexslider {
    overflow: hidden;
}

#flexslider ul {
    padding: 0;
    margin: 0;
}

.flexslider .flex-control-nav {
    bottom: 3rem;
    z-index: 4000;
}

.flexslider.video_gallery {
    margin-bottom: 0;
}

#flexslider .flex-control-nav {
    /*	position: relative;
        width: auto;
        display: block;
        margin-top: -1.875rem;*/
}

#flexslider .flex-control-nav {
    position: absolute;
    bottom: 3rem;
    left: 50%;
    z-index: 4000;
    width: auto;
    display: inline-block;
    -webkit-transform: translate(-50%, 50%);
    -ms-transform: translate(-50%, 50%);
    transform: translate(-50%, 50%);
    height: 0.625rem;
}

#flexslider .flex-pauseplay {
    position: absolute;
    bottom: 3rem;
    left: 50%;
    z-index: 4100;
}

#flexslider .flex-pauseplay a {
    color: #fff;
    -webkit-transform: translate(-50%, 50%);
    -ms-transform: translate(-50%, 50%);
    transform: translate(-50%, 50%);
}

#flexslider .flex-control-paging li a {
    background-color: #fff;
    width: 2.5rem;
    height: 3px;
}

#flexslider .flex-control-paging li a.flex-active {
    background-color: #f8c641;
}

/*===========*/
.cd_area>ol {
    padding-left: 0;
    position: relative;
    font-weight: bold;
    border-top: 1px solid #ddd;
    list-style-type: none;
}

.cd_area>ol>li.active {
    background-color: #fff;
}

.cd_area>ol>li:hover,
.cd_area>ol>li.active:hover {
    background-color: #fff;
    -webkit-transition: background-color .2s;
    -moz-transition: background-color .2s;
    -o-transition: background-color .2s;
    transition: background-color .2s;
}

.cd_area>ol>li {
    margin: 0;
    padding-left: 0;
    padding-left: 3.75rem;
    position: relative;
}

.cd_area>ol>li:after {
    content: " ";
    left: 0;
    right: 0;
    bottom: 0;
    height: 1px;
    background-color: #ddd;
    position: absolute;
}

.cd_area>ol>li:before {
    /*
        content:"";
        width: 33px;
        height: 33px;
        position: absolute;
        left: 0;
        top: 13px;
        background-image: url(../images/btn_cdlist.png);
        background-repeat: no-repeat;*/
}

.cd_area>ol>li.active:before {
    /*
        background-image: url(../images/btn_cdlist_on.png);*/
}

.cd_area .active .cd_div .cont {
    z-index: 1000;
    position: relative;
    height: auto;
    width: auto;
    opacity: 1;
    filter: alpha(opacity=100);
    visibility: visible;
}

.cd_area .cd_div .cont,
.cd_area .cd_div.hide .cont {
    z-index: -1;
    position: fixed;
    height: 0;
    width: 0;
    -webkit-transition: height 0.5s ease;
    -moz-transition: height 0.5s ease;
    -o-transition: height 0.5s ease;
    transition: height 0.5s ease;
    -webkit-transition: opacity .5s;
    -moz-transition: opacity .5s;
    -o-transition: opacity .5s;
    transition: opacity .5s;
    opacity: 0;
    filter: alpha(opacity=0);
    visibility: hidden;
    overflow: hidden;
    padding: 0 1rem;
    border-left: 3px solid #35b59e;
    font-weight: normal;
}

.cd_area .cd_div {
    margin: 0;
    position: relative;
}

.cd_area .active .cd_div {
    padding-bottom: 1.25rem;
}

.cd_area .cd_div .title {
    padding: 0;
    margin: 0;
}

.cd_area .cd_div .title a {
    color: #404042 !important;
    text-decoration: none !important;
    padding: 1.25rem 1rem;
    padding-right: 1.875rem;
    font-weight: bold;
    display: block;
    position: relative;
}

.cd_area .active .cd_div .title a {}

.cd_area .cd_div .cont p:last-child {
    margin-bottom: 0;
}

.cd_area .number {
    position: absolute;
    right: 100%;
    top: 1.25rem;
    margin-right: -65px;
}

.graphicBanner {
    position: absolute;
    right: 0;
    top: 0;
    max-height: 215px;
    max-width: none;
    z-index: -1;
}

body abbr[title]:after {
    content: '';
}

body .close {
    float: none;
    font-size: 1rem;
    font-weight: inherit;
    line-height: inherit;
    color: inherit;
    text-shadow: inherit;
    opacity: 1;
    z-index: 10;
    position: relative;
}

body .close:focus,
body .close:hover {
    color: inherit;
    text-decoration: inherit;
    opacity: 1;
}

/*====================================*/
.mainContent ul.flex-control-nav,
.mainContent ol.flex-control-nav {
    margin-bottom: 0;
    bottom: auto;
}

.list_table {
    width: 100%;
    border-spacing: 0;
    border: solid #ccc 1px;
    -moz-border-radius: 0.375rem;
    -webkit-border-radius: 0.375rem;
    border-radius: 0.375rem;
    -webkit-box-shadow: 0 1px 1px #ccc;
    -moz-box-shadow: 0 1px 1px #ccc;
    box-shadow: 0 1px 1px #ccc;
}

.list-table td:first-child,
.bordered th:first-child {
    border-left: none;
}

.list_table th {
    background: #e2f3fd;
    text-align: left;
    border-left: 1px solid #ccc;
    border-top: 1px solid #ccc;
    padding: 0.625rem;
}

.list_table td {
    text-align: left;
    border-left: 1px solid #ccc;
    border-top: 1px solid #ccc;
    padding: 0.625rem;
}

.list_table tr:nth-child(even) {
    background: #fafdf4;
}

.list_table_rowspan {
    width: 100%;
    border-spacing: 0;
    border: solid #ccc 1px;
    -moz-border-radius: 0.375rem;
    -webkit-border-radius: 0.375rem;
    border-radius: 0.375rem;
    -webkit-box-shadow: 0 1px 1px #ccc;
    -moz-box-shadow: 0 1px 1px #ccc;
    box-shadow: 0 1px 1px #ccc;
}

.list_table_rowspan th {
    background: #e2f3fd;
    text-align: left;
    border-left: 1px solid #ccc;
    border-top: 1px solid #ccc;
    padding: 0.625rem;
}

.list_table_rowspan td {
    text-align: left;
    border-left: 1px solid #ccc;
    border-top: 1px solid #ccc;
    padding: 0.625rem;
}

.div_acrobat_reader {
    background-color: #EAEAEA;
    padding: 5px;
}

.div_acrobat_reader>.div_acrobat_reader_icon {
    display: inline-block;
    width: 160px;
    margin-right: 5px;
    padding: 0.625rem 0;
}

.div_acrobat_reader>.div_acrobat_reader_description {
    display: inline-block;
    width: 75%;
}

/*======================*/
.photo_title,
.photo_area>li .title {
    margin-bottom: 1.5rem;
    font-weight: bold;
    display: block;
}

.mainContent ul.photo_group {
    /*margin: 0 -1em;*/
    padding: 0;
    text-align: left;
}

.mainContent .photo_area ul.photo_group {
    margin: 0 -0.8em;
    text-align: left;
}

.photo_group li {
    display: inline-block;
    vertical-align: top;
    /*width:	200px;*/
    width: 190px;
    text-align: center;
    margin: 0;
    margin-bottom: 0.25rem;
    padding: .1em;
}

.photo_group li.photo_thumb>a>img {
    border: 2px solid #b4b4b4;
    display: block;
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -ms-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}

.photo_group li.photo_thumb>a:focus>img,
.photo_group li.photo_thumb>a:hover>img {
    border: 2px solid #c30819;
}

body div.light_square .pp_left,
body div.light_square .pp_middle,
body div.light_square .pp_right,
body div.light_square .pp_content {
    background-color: transparent;
}

body .pp_nav .pp_play,
body .pp_nav .pp_pause,
body a.pp_arrow_previous,
body a.pp_arrow_next {
    font-size: 0;
}

body .pp_nav .pp_play:before,
body .pp_nav .pp_pause:before,
body a.pp_arrow_previous:before,
body a.pp_arrow_next:before {
    display: none;
}

body .pp_nav .pp_play,
body .pp_nav .pp_pause,
body a.pp_arrow_previous,
body a.pp_arrow_next {
    background-color: transparent;
    width: 44px;
    height: 44px;
    position: absolute;
    top: 50%;
    margin-top: -56px;
}

body a.pp_arrow_previous {
    background-image: url(../images/btn_arrow_prev.png);
}

body a.pp_arrow_next {
    background-image: url(../images/btn_arrow_next.png);
}

body .pp_content_container .pp_details {
    margin: 0;
    background-color: #fff;
}

body div.light_square .pp_description {
    text-align: left;
    padding: 0.5rem 0;
}

body .pp_nav {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    margin: 0;
}

body a.pp_arrow_previous {
    left: 0;
}

body a.pp_arrow_next {
    right: 0;
}

body a.pp_close {
    font-size: 0;
    background-color: transparent;
    background-image: url(../images/btn_close.png);
    background-repeat: no-repeat;
    width: 35px;
    height: 33px;
    box-shadow: none;
}

body .ppt {
    display: none !important;
}

body a.pp_previous,
body a.pp_next {
    background: none !important;
}

/*=========================*/
#flexslider .flex-direction-nav a {
    font-size: 0;
    width: 3rem;
    height: 3rem;
    color: rgba(255, 255, 255, 1);
    background-color: #303030;
    margin-top: -1.5rem;
}

#flexslider.flexslider:hover .flex-direction-nav .flex-prev {
    left: 0;
}

#flexslider.flexslider:hover .flex-direction-nav .flex-next {
    right: 0;
}

#flexslider .flexslider:hover .flex-direction-nav a {
    /*
        opacity: .9;*/
}

#flexslider .flex-direction-nav a:before {
    font-size: 1.5rem;
    color: rgba(255, 255, 255, 1);
    left: 45%;
    top: 50%;
    position: absolute;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

#flexslider .flex-direction-nav a.flex-next:before {
    left: auto;
    right: 45%;
    -webkit-transform: translate(50%, -50%);
    -ms-transform: translate(50%, -50%);
    transform: translate(50%, -50%);
}

/*================*/
body .mainHeader.active {
    display: block;
}

.section_left_banner {
    float: left;
    width: 360px;
    margin-right: 1.5rem;
}

.mainContent table {
    width: 100%;
    margin-bottom: 1em;
}

.mainContent table th,
.mainContent table td {
    /*
        line-height: 1.2;*/
    vertical-align: top;
    padding: 0.375rem 0.5rem;
}

.mainContent table.form-table th,
.mainContent table.form-table td {
    vertical-align: baseline;
    padding: 0.5rem;
}

.mainContent table tr.center th,
.mainContent table tr.center td {
    text-align: center;
}

.mainContent table h2 {
    font-size: 1rem;
    color: #2b3944;
    font-weight: normal;
    padding-top: 0;
    margin-top: 0;
    margin-bottom: 0;
    padding-bottom: 0;
    margin-bottom: 0;
}

.mytablestyle {
    overflow: auto;
    width: 100%;
}

.header_date {
    margin-bottom: 1.25rem;
    background-color: #ccc;
    color: #000099;
    padding: 0.5rem 12px;
    font-weight: bold;
}

.cont_detail {
    margin-bottom: 2.5rem;
}

.cont_detail>div {
    display: inline-block;
}

.cont_detail>div:nth-child(1) {
    width: 20%;
}

.cont_detail>div:nth-child(2) {
    width: 80%;
}

.cont_detail>div img {
    margin: 0 0.625rem;
}

.toggleTable table tr {
    vertical-align: top;
    border-bottom: 1px solid #637481;
    /*#194567;*/
}

.toggleTable table tr:nth-child(odd) {
    /*	background-color:#e2f0fa;*/
    background-color: #d6eeff;
}

.toggleTable table tr:nth-child(even) {
    /*	background-color:#d2e1ec;*/
    background-color: #cecfcf;
}

.toggleTable.toggleHeader table tr:nth-child(1) {
    /*	background-color:#e1ecf4;*/
    font-weight: bold;
    background-color: #bad4e6;
}

.section_header_banner {
    text-align: center;
}

/*======================*/
ul.latin {
    list-style-type: lower-latin;
}

.num_anchor {
    vertical-align: super;
    font-size: .8rem;
}

.divExpand {
    background-color: #f0d5ba;
    /*margin-bottom: 5px;
        border: 1px solid #e8e8e8;*/
    margin-bottom: 0.25rem;
    border: 3px solid #bdbdbd;
    overflow: hidden;
}

.divExpand>div:nth-child(1) h2 {
    margin: 0;
    padding: 0;
}

.divExpand>div:nth-child(1) a {
    display: block;
    padding: 0.5rem 0.875rem;
    position: relative;
    /*    font-size: 1.4rem;*/
    padding-right: 45px;
}

.divExpand>div:nth-child(1) a:after {
    content: "";
    width: 22px;
    height: 22px;
    background-image: url(../images/icon_ec_arrow.png);
    background-repeat: no-repeat;
    background-position: center center;
    right: 12px;
    top: 9px;
    padding: 0;
    position: absolute;
    /*	-webkit-transform: rotate(0deg);
        transform: rotate(0deg);*/
    -webkit-transition: -webkit-transform .2s ease-out, color .2s ease-out;
    transition: -webkit-transform .2s ease-out, color .2s ease-out;
    transition: transform .2s ease-out, color .2s ease-out;
    transition: transform .2s ease-out, -webkit-transform .2s ease-out, color .2s ease-out;
    font-size: 1.4rem;
    -webkit-transform: rotate(-90deg);
    transform: rotate(-90deg);
}

.divExpand.active>div:nth-child(1) a:after {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
    /*    color: #ce4300;*/
}

.divExpand>div:nth-child(2) {
    display: none;
    -webkit-transition: opacity 0.3s ease-in-out, height 0.3s ease-in-out;
    -moz-transition: opacity 0.3s ease-in-out, height 0.3s ease-in-out;
    -ms-transition: opacity 0.3s ease-in-out, height 0.3s ease-in-out;
    -o-transition: opacity 0.3s ease-in-out, height 0.3s ease-in-out;
    transition: opacity 0.3s ease-in-out, height 0.3s ease-in-out;
    opacity: 0;
    height: 0;
    border-top: 3px solid #bdbdbd;
    background-color: #fffced;
}

.divExpand.activating>div:nth-child(2) {
    display: block;
    position: static;
    opacity: 0;
    height: auto;
}

.divExpand.active>div:nth-child(2) {
    display: block;
    position: static;
    opacity: 1;
    height: auto;
    padding: 0.5rem 0.875rem;
}

.divExpand_control {
    float: right;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
}

.divExpand_control a {
    display: block;
    font-size: 1.4rem;
    color: #fff !important;
    background-color: #096fb9;
    padding: 0.5rem 1.25rem;
    margin-left: 1.25rem;
    margin-bottom: 1.25rem;
}

/*=============*/
.border_table th,
.border_table td {
    border-collapse: collapse;
    border: 1px solid #888;
    text-align: center;
}

.float_img_tl {
    float: left;
    padding: 0 1em 1em 0;
}

.footerMenuArea .mail {
    margin-bottom: 1.25rem;
}

.footerMenuArea .tel {
    margin-bottom: 1.25rem;
}

.footerMenuArea .mail:before {
    content: '';
    display: inline-block;
    width: 2rem;
    height: 2rem;
    background-image: url(../images/icon_cus_1.png);
    background-repeat: no-repeat;
    vertical-align: middle;
    margin-right: 1.25rem;
}

.footerMenuArea .fax {
    margin-bottom: 1.25rem;
}

.footerMenuArea .fax:before {
    content: '';
    display: inline-block;
    width: 2rem;
    height: 2rem;
    background-image: url(../images/icon_cus_2.png);
    background-repeat: no-repeat;
    vertical-align: middle;
    margin-right: 1.25rem;
}

.footerMenuArea .tel:before {
    content: '';
    display: inline-block;
    width: 2rem;
    height: 2rem;
    background-image: url(../images/icon_cus_3.png);
    background-repeat: no-repeat;
    vertical-align: middle;
    margin-right: 1.25rem;
}

.footerMenuArea .share li {
    margin-right: 15px;
}

/*===========*/
.cok_logo {
    margin-top: 31%;
    box-shadow: 0 0 1.25rem -2px #000;
}

.main_secBanner {
    margin: 15px -15px;
    text-align: center;
    margin-top: 1.25rem;
    top: auto;
    /*
        margin-top:31%;*/
    /*
        margin-top: 100px;*/
}

.main_secBanner>div {
    display: inline-block;
    width: 413px;
    max-width: 100%;
    background-color: #FFF;
    margin: 0.625rem;
    box-shadow: 0 0 1.25rem -2px #000;
}

.main_secBanner>div>div {
    padding: 15px;
}

.main_secBanner>div>div>a {
    display: block;
}

.main_secBanner>div>div .cover {
    display: block;
    overflow: hidden;
}

.main_secBanner>div>div .cover.c_v {
    height: 0;
    padding-bottom: 50.868486352357320099255583126551%;
    position: relative;
}

.main_secBanner>div>div .cover.c_v video {
    bottom: 0;
    position: absolute;
}

.main_secBanner>div .cover img {
    transform: scale(1);
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
}

.main_secBanner>div:hover .cover img,
.main_secBanner>div>div>a:focus .cover img {
    transform: scale(1.08);
}

.main_secBanner>div>div .cont {
    display: block;
}

.main_secBanner .title {
    position: relative;
    background-color: #fff;
    font-size: 1.14286rem;
    font-weight: bold;
    line-height: 1.4em;
    height: 5rem;
    overflow: hidden;
    /*	box-shadow: 0 0 0.625rem -2px #000;*/
    display: block;
    font-family: "Dancing Script";
    padding-top: 12px;
    padding-right: 0px;
    padding-bottom: 12px;
    padding-left: 0px;
    color: #000;
    text-align: justify;
}

.main_secBanner .title:before {
    content: '';
    position: absolute;
    top: 15px;
    left: 12px;
}

.ibDiv>div {
    display: inline-block;
}

.ibDiv>.my_img {
    width: 25%;
    padding-right: 1.25rem;
}

.ibDiv>.txt_w_img {
    width: 75%;
}

/*================*/
.photoAlbums {
    margin: 0;
    text-align: left;
    margin-bottom: 100px;
    padding: 0.625rem;
}

.photoAlbums .area {
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

.photoAlbums .year,
.photoAlbums .country {
    display: none;
    position: relative;
    width: 50%;
    padding: 0.625rem;
    margin-bottom: 1.875rem;
}

.photoAlbums .year.active,
.photoAlbums .country.active {
    display: inline-block;
}

.photoAlbums .full,
.photoAlbums .year.active.full,
.photoAlbums .country.active.full {
    display: block;
    width: 100%;
}

.photoAlbums .photoArea {
    /*
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
        -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;*/
}

.photoAlbums .photoArea>div {
    /*
        width:50%;
        padding:0.625rem;*/
}

.photoAlbums .photoArea .cover {
    text-align: center;
    margin-bottom: 0.625rem;
    height: 337.5px;
    overflow: hidden;
    position: relative;
}

.photoAlbums .photoArea .cover img {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

.photoAlbums .photoArea .title {
    width: 400px;
    max-width: 90%;
    margin: auto;
}

.photoAlbums .yearSelect li {
    display: inline-block;
    margin: 0;
}

.photoAlbums .yearSelect li a {
    padding: 0.25rem 12px;
}

/*
    .photoAlbums>div>div {*/
.photoAlbums>div>ul.slides>li {
    padding: 0.5rem;
    background-color: #fff;
    border: 1px solid #fff;
    box-shadow: 0 0 0.625rem -2px #000;
    /*
        display: inline-block;*/
    position: relative;
}

.photoAlbums .cont {
    position: absolute;
    left: 0.625rem;
    right: 0.625rem;
    bottom: 0.625rem;
    min-height: 3.125rem;
    padding: 0.5rem 0.625rem;
    background-color: rgba(0, 0, 0, .7);
    color: #fff;
    padding-right: 72px;
    width: auto;
}

.photoAlbums .more {
    position: absolute;
    color: #fff;
    right: 0.5rem;
    bottom: 0.5rem;
    padding: 0.5rem 0.625rem;
    font-size: .8rem;
}

.photoAlbums .border_table td>span,
.photoAlbums .border_table td>a {
    display: inline-block;
    max-width: 48%;
    margin: 0.625rem 1%;
    /*
        display:inline-block;
        max-width: 48%;
        width: 260px;
        height: 200px;
        margin: 0.625rem 1%;
        overflow:hidden;
        text-align:center;*/
}

.mainContent .myfilter>table {
    width: auto;
    max-width: 100%;
    margin: auto;
}

.mainContent .myfilter input {
    width: 100%;
}

.my_select>div {
    display: inline-block;
    margin-bottom: 1.25rem;
}

.my_select select {
    font-size: 1.07142857rem;
    padding: 0.5rem 1.25rem 0.5rem 0.625rem;
    border-radius: 0.375rem;
}

.my_select .mys_btn>a {
    display: block;
    padding: 12px 1.875rem;
    margin: 0 0.625rem;
    border-radius: 0.375rem;
    background-color: #05499c;
    color: #fff;
    font-size: 1.07142857rem;
}

body a.pp_expand {
    display: none !important;
}

p.line {
    text-decoration: underline;
}

/*============*/
.headerTool .language {
    position: relative;
    display: inline-block;
    vertical-align: middle;
    font-weight: bold;
    /*
        margin-right: 0.625rem;*/
    padding: 0;
}

.headerTool .language .langBtn a {
    display: block;
    padding: 0.375rem;
}

.myheaderTool>div.clientTool div.language ul li {
    margin-bottom: 1px;
    display: block;
}

.headerTool .language .langSelect {
    padding-right: 15px;
}

.headerTool .language .langSelect a:after {
    content: "";
    position: absolute;
    width: 15px;
    height: 15px;
    right: 5px;
    top: 0.25rem;
    background-image: url(../images/icon_arrow2.png);
    background-size: 100% auto;
    background-repeat: no-repeat;
    -webkit-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    transform: rotate(0deg);
}

.headerTool .language.active .langSelect a:after {
    -webkit-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    transform: rotate(180deg);
}

.headerTool .language>ul {
    /*
        position: absolute;
        left: -9999px;
        -webkit-transition: opacity 0.3s ease-in-out;
        -moz-transition: opacity 0.3s ease-in-out;
        -ms-transition: opacity 0.3s ease-in-out;
        -o-transition: opacity 0.3s ease-in-out;
        transition: opacity 0.3s ease-in-out;
        opacity: 0;*/
}

.headerTool .language.active>ul {
    left: auto;
    right: 0;
    top: 100%;
    line-height: normal;
    opacity: 1;
    margin-top: -5px;
    z-index: 8000;
}


.myheaderTool .clientTool .social a {
    padding: 0.625rem .9vw;
}

/*
    .headerTool .language ul{
        display: none;
        position: absolute;
        top: auto;
        text-align: left;
        z-index: 9000;
        background: #FFF;
        box-shadow: 0px 3px 0.25rem rgba(150, 150, 150, 0.2);
        border-top: 2px solid #3447a3;
    }
    .headerTool .language.active  ul{
        display: block;
    }*/
.headerTool .AStyleArea,
.headerTool .searchTool {
    position: relative;
    /*
        display: inline-block;
        vertical-align: middle;*/
}

.mobTitle {
    display: none;
}

/* ------------------------------------------ */
/* Style for share-btns */
/* ------------------------------------------ */
.headerTool .clientTool .shareTool {
    position: relative;
    display: inline-block;
    padding-right: 1.5rem;
}

.headerTool .clientTool .shareList a {
    font-size: 0;
}

.headerTool .shareTool>a {}

.headerTool .shareTool>a img {}

.headerTool .shareTool>.shareList {
    display: none;
    position: absolute;
    top: 2.125rem;
    right: 0;
    padding: 0.5rem 0.9375rem 0.75rem;
    text-align: left;
    z-index: 9000;
    min-width: 5rem;
    background: #FFF;
    box-shadow: 0px 3px 0.25rem rgba(150, 150, 150, 0.2);
    border-top: 2px solid #3447a3;
}

.headerTool .shareTool>.shareList:before {
    display: none;
}

.headerTool .shareTool.active>.shareList {
    display: block;
}

.share-btns {
    position: relative;
    margin-top: 15px;
}

ul.share-btns {
    list-style-type: none;
    margin: 0;
    padding: 0;
}

ul.share-btns>li {

    display: inline-block;

}

ul.share-btns>li:not(:last-child) {
    margin-right: 0.5rem;
}


.header-nav__tool--share {
    /*	text-align: center;*/
}

.header-nav__tool--share .share-btns {
    white-space: nowrap;
}

.headerArea li .share-btns__btn {
    display: inline-block;
    vertical-align: top;
    width: 2.125rem;
    height: 2.125rem;
    margin-right: 0.25rem;
    position: relative;
    transition: 0.2s;
}

.mob-nav__control .share-btns__btn {
    width: 1.875rem;
    height: 1.875rem;
    vertical-align: middle;
}

.share-btns__btn:before {
    content: '';
    width: 1.625rem;
    height: 1.625rem;
    left: 0.25rem;
    top: 0.25rem;
    display: block;
    position: absolute;
    background: url() center top;
    background-size: 100% auto;
    transition: 0.2s;

}

.header-nav__tool--share .share-btns__btn:before {
    background-position-y: -1.625rem;
}

.mob-nav__control .share-btns__btn:before {
    background-position-y: -1.375rem;
}

.mob-nav__control .share-btns__btn:before {
    width: 1.125rem;
    height: 1.125rem;
    left: 0.25rem;
    top: 0.25rem;
}



.share-btns__btn.share-btns__btn--email:before {
    background-image: url(../images/share/icon-social-email-white.png);
}

.mob-nav__control .share-btns__btn.share-btns__btn--email,
.header-nav__tool--share .share-btns__btn.share-btns__btn--email,
.share-btns__btn.share-btns__btn--email:hover {
    background-color: yellowgreen;
}

.share-btns__btn.share-btns__btn--fb:before {
    background-image: url(../images/share/icon-social-facebook-white.png);
}

.mob-nav__control .share-btns__btn.share-btns__btn--fb,
.header-nav__tool--share .share-btns__btn.share-btns__btn--fb,
.share-btns__btn.share-btns__btn--fb:hover {
    background-color: #3b5998;
}

.share-btns__btn.share-btns__btn--wa:before {
    background-image: url(../images/share/icon-social-whatsapp-white.png);
}

.mob-nav__control .share-btns__btn.share-btns__btn--wa,
.header-nav__tool--share .share-btns__btn.share-btns__btn--wa,
.share-btns__btn.share-btns__btn--wa:hover {
    background-color: #1bd741;
}

.share-btns__btn.share-btns__btn--wb:before {
    background-image: url(../images/share/icon-social-weibo-white.png);
}

.mob-nav__control .share-btns__btn.share-btns__btn--wb,
.header-nav__tool--share .share-btns__btn.share-btns__btn--wb,
.share-btns__btn.share-btns__btn--wb:hover {
    background-color: #df2029;
}

.share-btns__btn.share-btns__btn--wc:before {
    background-image: url(../images/share/icon-social-wechat-white.png);
}

.mob-nav__control .share-btns__btn.share-btns__btn--wc,
.header-nav__tool--share .share-btns__btn.share-btns__btn--wc,
.share-btns__btn.share-btns__btn--wc:hover {
    background-color: #09b83e;
}

.share-btns__btn.share-btns__btn--tw:before {
    background-image: url(../images/share/icon-social-twitter-white.png);
}

.mob-nav__control .share-btns__btn.share-btns__btn--tw,
.header-nav__tool--share .share-btns__btn.share-btns__btn--tw,
.share-btns__btn.share-btns__btn--tw:hover {
    background-color: #00aff0;
}

.share-btns__btn.share-btns__btn--ig:before {
    background-image: url(../images/share/icon-social-ig-white.png);
}

.mob-nav__control .share-btns__btn.share-btns__btn--ig,
.header-nav__tool--share .share-btns__btn.share-btns__btn--ig,
.share-btns__btn.share-btns__btn--ig:hover {
    background-color: #bc2a8d;
}

.share-btns__btn.share-btns__btn--rss:before {
    background-image: url(../images/share/icon-rss.png);
}

.mob-nav__control .share-btns__btn.share-btns__btn--rss,
.header-nav__tool--share .share-btns__btn.share-btns__btn--rss,
.share-btns__btn.share-btns__btn--rss:hover {
    background-color: #f26522;
}

.share-btns__btn:last-child {
    margin-right: 0;
}

/* END Style share-btns */
#menu>.mm-panels>.mm-panel>.mm-listview>.mm-listitem:last-child {
    background-color: transparent;
}

#menu>.mm-panels>.mm-panel>.mm-listview>.mm-listitem:last-child:after {
    display: none;
}

/*====================================*/
.your_justify,
.your_justify p {
    text-align: justify;
}

.pp_pic_holder a.pp_previous {
    width: 50%;
}

.pp_pic_holder a.pp_next {
    width: 50%;
}

body #wrap .headerArea .headerTool .headerMenu>ul.tMenu {
    /*
        font-size: 1.35rem;*/
}

/*=========*/
.myVideo {
    margin-bottom: 2.5rem;
}

/*================*/
.desktop {
    display: block;
}

.mobile {
    display: none;
}

/*=======*/
.u-lList {
    list-style-type: upper-latin;
}

.iconButton {
    display: inline-block;
}

.iconButton a {
    display: block;
    padding: 0.625rem;
    position: relative;
    color: #444;
    background-color: #ddf5ff;
    background-image: radial-gradient(#ddf5ff 40%, #dcf2fa 70%, #dbedf4 90%);
    border-radius: 0.5rem;

    font-size: 1.6rem;
    line-height: 1em;
}

.iconButton a:before {
    content: "";
    display: inline-block;
    margin-right: 5px;
    width: 45px;
    height: 45px;
    background-image: url(../images/icon_cok.png);
    background-size: 100% 100%;
    background-repeat: no-repeat;
}

.iconButton .calico {
    width: 2.5rem;
    margin-left: 5px;
    vertical-align: text-bottom;
}

/*====================*/
.leftMenu .menuLv1 .extmenu {
    display: none;
}

.pdf_area {
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    width: 850px;
    margin: auto;
    max-width: 100%;
}

.pdf_area>div {
    width: 100%;
    text-align: center;
    padding: 0.625rem 0.625rem;
}

.pdf_area>div img {
    margin: auto;
    margin-bottom: 1.25rem;
    display: block;
    width: 100px;
}

.pdf_area a {
    font-weight: bold;
    color: #2b3944;
}

/*==============*/
.detail_area {
    margin: 0 1.25rem 2.5rem 1.25rem;
    box-shadow: 0 0 3.125rem -0.625rem #9ca1ff;
}

.detail_area>div {
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    position: relative;
    border-radius: 0.5rem;
}

.detail_area>div:after {
    content: "";
    position: absolute;
    left: 1.25rem;
    right: 1.25rem;
    bottom: 0;
    height: 1px;
    background-color: #cfcfcf;
}

.detail_area>div:last-child:after {
    display: none;
}

.detail_area>div>div {
    vertical-align: top;
    padding: 1.25rem;
}

.detail_area>div>div {
    border-bottom: none;
}

.detail_area>div>div:nth-child(1) {
    width: 20%;
    display: inline-block;
    background-color: #ededed;
    font-weight: bold;
}

.detail_area>div>div:nth-child(2) {
    width: 80%;
    display: inline-block;
    background-color: #fff;
}

.detail_area>div:nth-child(1)>div:nth-child(1) {
    border-radius: 0.625rem 0 0 0;
}

.detail_area>div:nth-child(1)>div:last-child {
    border-radius: 0 0.625rem 0 0;
}

.detail_area>div:last-child>div:nth-child(1) {
    border-radius: 0 0 0.625rem 0;
}

.detail_area>div:last-child>div:last-child {
    border-radius: 0 0 0 0.625rem;
}

.lt_list {
    list-style-type: lower-latin;
}

.mainContent .detail_area li {
    margin-top: 0;
}

.detailTable {
    overflow: auto;
    max-width: 100%;
}

.detailTable table td:nth-child(1),
.detailTable table td:nth-child(1) img {
    width: 300px;
}

.detailTable tr:nth-child(1) td,
.detailTable tr:nth-child(1) th {
    font-weight: bold;
}

.detailTable td,
.detailTable th {
    border-collapse: collapse;
    border: 1px solid #444;
}

.detailTable.d1 td:nth-child(1) {
    min-width: 130px;
}

.detailTable.f4 td:nth-child(4) {
    min-width: 230px;
}

.headerTable {
    overflow: auto;
    width: 100%;
}

.headerTable table td,
.headerTable table th {
    border-collapse: collapse;
    border: 1px solid #2b2b2b;
}

.txtico {
    color: #fff;
    text-decoration: none;
    display: inline-block;
    text-align: center;
    padding: 0 0.5rem;
    margin: 0.25rem;
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 0.625rem 0 rgba(0, 0, 0, 0.12);
    /*background-color: #790707;
        background-image: linear-gradient(141deg, #500606 0%, #880505 51%, #770909 75%);
        opacity: 0.95;
        border: 2px solid #920e0e;*/

    background-color: #774609;
    background-image: linear-gradient(141deg, #502506 0%, #a55c11 51%, #774609 75%);
    opacity: 0.95;
    border: 2px solid #8c5a15;
    font-size: 0.9rem;
}

/*============*/
.iconButton {
    margin-left: 1.25rem;
}

.iconButton.fst {
    margin-left: 0;
}

.iconButton .iconPdf img {
    width: 2.5rem;
}

.tableArea {
    overflow: auto;
    max-width: 100%;
}

.youtubeDiv {
    position: relative;
    width: 100%;
    padding-bottom: 56.25%;
}

.youtubeDiv>iframe {
    width: 100%;
    height: 100%;
    position: absolute;
}

.pop_video a {
    position: relative;
    display: block;
}

.pop_video a:after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background-image: url(../images/icon_video_play.png);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 30% auto;
    opacity: .8;
}

.pop_video a:hover:after,
.pop_video a:focus:after {
    opacity: 1;
}

/*================*/
.footerArea .logo_list {
    padding: 0 0;
}

.footerBannerArea {
    margin: 0 -1.25rem;
}

.footerArea #flexslider_footer .slides {
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
}

.footerArea #flexslider_footer .slides li {}

.footerArea #flexslider_footer .slides a {
    padding: 0 1.25rem;
    height: 100%;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}

.footerArea #flexslider_footer .slides img {
    width: 185px;
}

.footerBannerArea #flexslider_footer .flex-direction-nav {
    /*display:none;*/
}

.footerArea #flexslider_footer .flex-control-paging {
    position: relative;
    bottom: auto;
    padding-top: 2.5rem;
    padding-bottom: 0.625rem;
    display: flex;
    align-items: center;
    justify-content: center;
    /*height: 0.5rem;*/
}

.footerArea #flexslider_footer .flex-control-paging li {}

.footerArea #flexslider_footer .flex-control-paging li a {
    border-radius: 0;
    box-shadow: none;
    width: 2.5rem;
    height: 0.5rem;
    position: relative;
    background-color: transparent;
    font-size: 0;
    display: flex;
    align-items: center;
}

.footerArea #flexslider_footer .flex-control-paging li a:before {
    content: "";
    background: #bdbdbd;
    display: block;
    width: 100%;
    height: 1px;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

.footerArea #flexslider_footer .flex-control-paging li a:hover {}

.footerArea #flexslider_footer .flex-control-paging li a:focus:before,
.footerArea #flexslider_footer .flex-control-paging li a:hover:before {
    background: #444;
}

.footerArea #flexslider_footer .flex-control-paging li a.flex-active {
    background-color: transparent;
    cursor: default;
}

.footerArea #flexslider_footer .flex-control-paging li a.flex-active:before {
    background: #000 !important;
    height: 100% !important;
}

/*==========*/
.footerTitle {
    background-color: #e4e4e4;
}

.footerTitle .title {
    text-align: center;
    padding: 0.625rem 0;
    font-size: 1.4rem;
    display: block;
}

.footerTitle .title:after {
    content: "";
    display: inline-block;
    background-image: url(../images/icon_arrow_top.png);
    background-repeat: no-repeat;
    background-size: 100% auto;
    width: 1.5rem;
    height: 1.5rem;
    margin: 0 0.625rem;
    vertical-align: top;
}

/*==============*/
.search_year ul {
    margin: 0;
    padding: 0;
}

.search_year li {
    display: inline-block;
    margin: 0;
    margin-bottom: 0.625rem;
}

.mainContent a.search_btn {
    /*
        padding:0.5rem 1.625rem;
        background-color:#1d8191;
        color:#fff;
        border-radius: 0.25rem;
        display: block;*/
    position: relative;
    padding: 0.5rem 1.625rem;
    color: #000;
    background-color: #f2dd2c;
    border-radius: 2.5rem;
    margin-left: 0.625rem;
}

.search_year select {
    background-color: #d6e1e7;
    border-radius: 0.25rem;
    border-color: transparent;
    margin: 0 0.625rem;
    padding: 0.625rem;
    max-width: 100%;
    width: 130px;
}

.headerMenu ul.listStyleBlank.menu_items>li:first-child a {
    /*
        padding-left: 1.5rem;*/
}

.d-lg-none {
    display: none !important;
}

.mobShare {
    padding: 0.625rem 0;
}

.mobShare>a {
    display: none !important;
}

.headerArea .headerMenu .mobShare li {
    display: inline-block;
}

.headerTool .mobSearchArea .cross_btn {
    display: none;
}

.simpleTable {
    width: 100%;
    overflow: auto;
}

.simpleTable table {
    border-top: 2px solid #1d8191;
    border-bottom: 2px solid #e3e7e6;
}

.simpleTable tr {
    background-color: #fff;
    border-left: 2px solid #e3e7e6;
    border-right: 2px solid #e3e7e6;
}

.simpleTable tr:nth-child(odd) {
    background-color: #f6f7f9;
}

.simpleTable table tr:nth-child(1) {
    background-color: #1d8191;
    color: #fff;
    border-left: 2px solid #1d8191;
    border-right: 2px solid #1d8191;
}

/*==========================*/
.footerMenuArea {}

.footerMenuArea.active {}

.footerMenuArea .footerTitle a {
    text-decoration: none;
}

.footerMenuArea .footerTitle .title:after {
    transform: rotate(180deg);

    -webkit-transition: transform 0.2s ease-in-out;
    -moz-transition: transform 0.2s ease-in-out;
    -ms-transition: transform 0.2s ease-in-out;
    -o-transition: transform 0.2s ease-in-out;
    transition: transform 0.2s ease-in-out;
}

.footerMenuArea.active .footerTitle .title:after {
    transform: rotate(0);
}

.footerMenuArea .footerMenu {
    -webkit-flex: 1 1 auto;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    /*	max-height:0;
        overflow:hidden;
    
        -webkit-transition: max-height 0.3s ease-in-out;
        -moz-transition: max-height 0.3s ease-in-out;
        -ms-transition: max-height 0.3s ease-in-out;
        -o-transition: max-height 0.3s ease-in-out;
        transition: max-height 0.3s ease-in-out;*/
}

.footerMenuArea .logo {
    padding: 0.625rem;
}

.footerMenuArea.active .footerMenu {
    max-height: 1000px;
}

/*===============*/
.myheader {
    font-weight: bold;
    font-size: 2.8rem;
}

.myheader.myheader_i {
    color: #fff;
}

.g_cont {
    font-size: 1.4rem;
}

.icon_list ul {
    list-style-type: none;
    margin: 0 -5px 1.25rem -5px;
    padding: 0;
}

.icon_list li {
    display: inline-block;
    padding: 0 5px;
}

.flex_area {
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
}

/*=======*/
.dl_list {
    text-align: right;
}

.dl_list a,
.dl_list a:hover,
.dl_list a:focus {
    display: inline-block;
    padding: 0.625rem 1.875rem;
    color: #fff;
    background-color: #007d8f;
}

.enquiries {
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
}

.lnr_span {
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
}

.lnr_span>span {
    -webkit-flex: 1 1 0px;
    -ms-flex: 1 1 0px;
    flex: 1 1 0px;
    text-align: left;
    padding-left: 0px;
    padding-right: 0.625rem;
    padding-top: 0.625rem;
    padding-bottom: 0.625rem;
}

.mainContent table[data-border="1"] th,
.mainContent table[data-border="1"] td {
    border-collapse: collapse;
    border: 1px solid #000;
}

.mainContent table th {
    /*
        color: #fff;
        background-color: #1E486E;
        border-top: 1px solid white;
        border-right: 1px solid white;*/
}

.mainContent table .width5 {
    width: 5%;
}

.mainContent table .width70 {
    width: 70%;
}

.mainContent table .width25 {
    width: 25%;
}

/*======*/
.mainbanner {}

.indexVersion .mainbanner {}

.indexVersion .mainbanner:before {}

.mainbanner:before {}

.mainbanner .txt {}

.mainbanner .txt {}

.mainbanner .txt>div {}

.mainbanner .txt>div:before {}

.mainbanner .txt span {}

.mainbanner>.container:before {}

.mainbanner .mb_area:after {}

/*=============================*/
.myflexSp {
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
}

.myflexSp>* {
    width: 100%;
}

.myflexSp>*.flex50 {
    width: 50%;
    margin-left: 0;
    margin-right: 0;
    padding-left: .6em;
    padding-right: .6em;
}

.myflex {
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
}

.flex11>div {
    -webkit-flex: 1 1 auto;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    max-width: 100%;
    width: 50%;
    /*
        padding:0 0.625rem;*/
}

.facc {
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}

/*=============*/
p.margin_left {
    margin-left: 2em;
}

/*=================*/
.mc-area {
    position: relative;
    min-height: 850px;
}

.white-box {
    position: absolute;
    left: 28%;
    right: 5%;
    bottom: 4%;
    background-color: rgba(255, 255, 255, .9);
    padding: 1.25rem;
    box-shadow: 5px 5px 0 0 rgba(0, 0, 0, .5);
}

.white-box h1:nth-child(1),
.white-box .h1:nth-child(1) {
    margin-top: 0;
}

/*================*/
.member-table td:nth-child(1) {
    width: 20%;
}

/*
    .yearselector tr[data-year]{
        display:none;
    }
    .yearselector.ya2021 tr[data-year="2021"],
    .yearselector.ya2021 tr[data-year="2021"],
    .yearselector.ya2021 tr[data-year="2021"],
    .yearselector.ya2021 tr[data-year="2021"],
    .yearselector.ya2021 tr[data-year="2021"],
    .yearselector.ya2021 tr[data-year="2021"],
    .yearselector.ya2021 tr[data-year="2021"]{
        display:block;
    }*/
.yearselector {
    border: 2px solid #000;
}

.mainContent table.form-table.yearselector th,
.mainContent table.form-table.yearselector td {
    padding: 12px 1.25rem;
}

.yearfilter ul {
    list-style-type: none;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    padding: 0;
    margin: 0;
}

.yearfilter li {
    padding: 0;
    margin: 0;
}

.yearfilter a {
    display: block;
    padding: 0.5rem 1.25rem;
    max-width: 100%;
    width: 110px;
    color: #000;
    background-color: hsl(51deg, 88%, 88%);
}

.yearfilter a:hover,
.yearfilter a:focus,
.yearfilter a:active {
    color: #000;
}

.yearfilter li:nth-child(7n+1) a {
    background-color: hsl(51deg, 88%, 88%);
}

.yearfilter li:nth-child(7n+2) a {
    background-color: hsl(103deg, 88%, 88%);
}

.yearfilter li:nth-child(7n+3) a {
    background-color: hsl(154deg, 88%, 88%);
}

.yearfilter li:nth-child(7n+4) a {
    background-color: hsl(206deg, 88%, 88%);
}

.yearfilter li:nth-child(7n+5) a {
    background-color: hsl(257deg, 88%, 88%);
}

.yearfilter li:nth-child(7n+6) a {
    background-color: hsl(309deg, 88%, 88%);
}

.yearfilter li:nth-child(7n+7) a {
    background-color: hsl(360deg, 88%, 88%);
}

/*==============*/
.fm-banner {
    background-image: url(../images/bg_btn_ft.jpg);
    background-repeat: no-repeat;
    width: 162px;
    height: 52px;
    text-align: center;
}

.fm-banner a {
    height: 100%;
    width: 100%;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}

.footerlink {
    text-align: center;
}

.footerlink .useful_list {
    display: -ms-inline-flexbox;
    display: -webkit-inline-flex;
    display: inline-flex;
    list-style-type: none;
    padding: 0 0.625rem;
    margin: 0.625rem 0;
}

.footerlink .useful_list a {
    padding: 0 0.625rem;
}

/*==================*/
ul.summary {
    background-color: #F0F0F0;
    padding-top: 0.625rem;
    padding-bottom: 0.625rem;
    -moz-border-radius: 0.625rem;
    border-radius: 0.625rem;
    border-top: 2px solid #FF7200;
}

.mainContent table[data-cellspacing] td,
.mainContent table[data-cellpadding] td {
    border: 2px solid #fff;
}

.mainContent table[data-cellspacing] th,
.mainContent table[data-cellpadding] th {
    border: 2px solid #fff;
    border-bottom: 2px solid #ff7200;
}

.mainContent table[data-border="0"] td {
    background-color: #f0f0f0;
}

.mainContent table[data-border="0"] th {
    color: #000;
    background-color: #e6dfda;
    text-align: center;
    vertical-align: middle;
    font-weight: bold;
}

.mainContent td p:last-child {
    margin-bottom: 0;
}

.mainContent th[data-align="center"],
.mainContent table[data-border="0"] th[data-align="center"],
.mainContent td[data-align="center"],
.mainContent tr[data-align="center"],
.mainContent td[data-align="center"] p {
    text-align: center;
}

.mainContent th[data-align="left"],
.mainContent table[data-border="0"] th[data-align="left"],
.mainContent td[data-align="left"],
.mainContent tr[data-align="left"],
.mainContent td[data-align="left"] p {
    text-align: left;
}

.mainContent table[data-width="100%"] {
    width: 100%;
}

.mainContent p.digest {
    font-size: 1.2rem;
    color: #000000;
    text-align: center;
}

.mainContent img.download {
    margin: 5px;
}

.mainContent label.filter {
    margin: 0 1.25rem 0 0;
}

.mainContent select.filter {
    font-size: 1rem;
    height: 1.5em;
    margin-right: 2.5rem;
    width: 100px;
    max-width: 100%;
}

.mainContent input[type="button"] {
    line-height: normal;
}

.mobileLogo {
    display: none;
}

.myUpdate {
    display: none !important;
}

/*===============================*/
/*=myPhoto=*/
.indexProg_list {
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

.indexProg_list>div {
    width: 320px;
    height: 320px;
    margin: 0;
    padding: 0.625rem;
}

.indexProg_list>div>div {
    border: 5px solid #e1e1e1;
    background-color: #000;
    width: 100%;
    height: 100%;
    position: relative;
    overflow: hidden;
    cursor: pointer;
}

.indexProg_itemImg {
    width: auto;
    max-width: none;
    height: 300px;
    position: absolute;
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%) scale(1);
    -ms-transform: translate(-50%, -50%) scale(1);
    transform: translate(-50%, -50%) scale(1);
    -webkit-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
}

.indexProg_list>div>div:hover .indexProg_itemImg {
    -webkit-transform: translate(-50%, -50%) scale(1.08);
    -ms-transform: translate(-50%, -50%) scale(1.08);
    transform: translate(-50%, -50%) scale(1.08);
}

.indexProg_itemMask {
    display: none;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    opacity: 0.5;
    display: none;
    background-color: #000000;
}

.indexProg_list>div>div:hover .indexProg_itemMask {
    display: block;
}

.indexProg_item_title {
    background-color: rgba(66, 66, 66, .66);
    height: auto;
    width: 100%;
    position: absolute;
    left: 0px;
    bottom: 0;
    color: #ffffff;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=90)";
    filter: alpha(opacity=90);
    -khtml-opacity: 0.9;
    -moz-opacity: 0.9;
    opacity: 0.9;
}

.indexProg_item_title:after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 1.25rem;
    background: #000;
    background: -webkit-linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 1));
    background: -moz-linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 1));
    background: -ms-linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 1));
    background: -o-linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 1));
    background: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 1));
    background: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 1));
}

.indexProg_item_title .header {
    margin: 0.625rem;
    display: block;
    font-size: 1.2rem;
    font-weight: bold;
    color: #fff;
}

.indexProg_item_title .cont {
    margin: 0.625rem;
    display: none;
}

.indexProg_list a span {
    line-height: normal;
    font-size: 1rem;
}

/*====================*/
/*.headerBorder{
        background-color: #2E8F57;
        height:1.25rem;
    }*/
.headerAreaPop {
    background-color: #084A87;
    color: #fff;
    font-size: 1.4rem;
    position: relative;
    overflow: hidden;
    max-height: 1.25rem;
    -webkit-transition: max-height 0.3s ease-in-out;
    -moz-transition: max-height 0.3s ease-in-out;
    -ms-transition: max-height 0.3s ease-in-out;
    -o-transition: max-height 0.3s ease-in-out;
    transition: max-height 0.3s ease-in-out;
}

.headerAreaPop.active {
    max-height: 270px;
}

.headerAreaPop a {
    color: #fff;
}

.headerAreaPop .hidden-text {
    position: absolute;
    display: block;
    height: 0;
    width: 0;
    overflow: hidden;
}

.headerAreaPop .close a {
    display: block;
    position: absolute;
    right: 1.25rem;
    top: 1.25rem;
    width: 1.25rem;
    height: 1.25rem;
    background-image: url(../images/icon_pop_close.png);
    background-size: 100%;
    background-repeat: no-repeat;
    display: none;
}

.headerAreaPop.active .close a {
    display: block;
}

.headerAreaPop .close .hap-close {}

.headerAreaPop .area {
    position: relative;
    max-width: 1000px;
    width: 90%;
    margin: 0 auto;
    padding: 35px 0 35px 0;
    height: 100%;
    max-height: 270px;
}

.headerAreaPop.active .area {}

.headerAreaPop .tit {
    text-align: left;
    padding: 1.25rem;
    border-bottom: 1px solid #fff;
}

.headerAreaPop .cont {
    text-align: left;
    padding: 1.5rem;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
}

.headerAreaPop .detail {
    padding: 0 15px;
}

.headerAreaPop .toggle-area {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 1.25rem;
    background-color: #2E8F57;
    z-index: 10;
}

.headerAreaPop .toggle-area a {
    display: block;
    position: absolute;
    right: 1.875rem;
    width: 1.5rem;
    height: 1.25rem;
    background-color: #084A87;
}

.headerAreaPop .toggle-area a:before {
    content: "";
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    width: 12px;
    height: 12px;
    background-image: url(../images/icon_pop_arrow.png);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 100%;
    -webkit-transform: translate(-50%, -50%) rotate(0deg);
    -ms-transform: translate(-50%, -50%) rotate(0deg);
    transform: translate(-50%, -50%) rotate(0deg);
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

.headerAreaPop.active .toggle-area a:before {
    -webkit-transform: translate(-50%, -50%) rotate(180deg);
    -ms-transform: translate(-50%, -50%) rotate(180deg);
    transform: translate(-50%, -50%) rotate(180deg);
}

.headerAreaPop .toggle-area .hap-open,
.headerAreaPop.active .toggle-area .hap-close {
    display: block;
}

.headerAreaPop .toggle-area .hap-close,
.headerAreaPop.active .toggle-area .hap-open {
    display: none;
}

/*================*/
.mainArea div.more {
    text-align: right;
    padding-bottom: 3.75rem;
    display: inline-block;
}

.mainArea .more a {
    position: relative;
    font-weight: bold;
    text-transform: uppercase;
    /*display: inline-block;*/
    display: flex;
    align-items: center;
    padding: 1rem 2.2rem;
    padding-right: 4rem;
    border: 2px solid #000;
    background-color: #fff;
    color: #000;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
    z-index: 10;
}

.mainArea .more a:hover,
.mainArea .more a:focus {
    background-color: rgba(0, 0, 0, 0);
    color: #fff;
}

.mainArea .more a:before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: -1px;
    background-color: #000;
    height: 0;
    -webkit-transition: all .3s ease-out;
    -ms-transition: all .3s ease-out;
    transition: all .3s ease-out;
    z-index: -1;
}

.mainArea .more a:hover:before,
.mainArea .more a:focus:before {
    height: calc(100% + 1px);
}

.mainArea .more a:after {
    content: "";
    position: absolute;
    width: 1.25rem;
    height: 1.375rem;
    right: 1.875rem;
    background-image: url(../images/icon/icon_arrow.svg);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 100% auto;
    -webkit-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    transform: rotate(180deg);
}

.mainArea .more a:hover:after,
.mainArea .more a:focus:after {
    background-image: url(../images/icon/icon_arrow_i.svg);
}

.mainArea .svg_arrow.left_arrow {
    -webkit-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    transform: rotate(0deg);
}

.mainArea .svg_arrow.right_arrow {
    -webkit-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    transform: rotate(180deg);
}

.mainArea .flex13>*:nth-child(1) {
    width: 25%;
    padding-right: 1.25rem;
}

.mainArea .flex13>*:nth-child(2) {
    width: 75%;
}

.mainArea {
    padding: 3.75rem 0;
}

.mainArea h1 {}

.mainArea.mainAreaBC,
.mainArea.mainAreaMC,
.mainArea.mainArea1 {
    padding: 0;
}

body:not(.indexVersion) .mainArea.mainAreaMC {
    /*padding-top: 5rem;*/
}

.mainArea1 .container {
    position: relative;
}

.mainArea1 .topic {
    position: absolute;

    /*
        top:35%;*/
    bottom: 16%;
    z-index: 10;
    background-color: #4676E2;
    /*background-image: linear-gradient(to right, #c143d1 -18%, #fd536d 100%);*/
    background-image: linear-gradient(to right, #4676E2 0%, #1FA1D9 85%, #1DADD8 100%);
    -ms-background-clip: text;
    background-clip: text;
    -webkit-background-clip: text;
    color: transparent;

    -webkit-animation-duration: 2s;
    -ms-animation-duration: 2s;
    animation-duration: 2s;
    -webkit-animation-fill-mode: both;
    -ms-animation-fill-mode: both;
    animation-fill-mode: both;
    opacity: 0;
}

.mainArea1 .topic .sub {
    font-size: 4.5rem;
    text-transform: uppercase;
    font-family: openSans, Open Sans, "Arial", "Helvetica", "sans-serif", "microsoft jhenghei";
    font-weight: 900;
}

.mainArea1 .topic .main {
    font-size: 8rem;
    text-transform: uppercase;
    line-height: 1em;
    width: 900px;
    max-width: 100%;
    font-family: openSans, Open Sans, "Arial", "Helvetica", "sans-serif", "microsoft jhenghei";
    font-weight: 900;
}

@-webkit-keyframes fadeInLeft {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(-100%, 0, 0);
        -ms-transform: translate3d(-100%, 0, 0);
        transform: translate3d(-100%, 0, 0);
    }

    to {
        opacity: 1;
        -webkit-transform: translateZ(0);
        -ms-transform: translateZ(0);
        transform: translateZ(0);
    }
}

@-ms-keyframes fadeInLeft {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(-100%, 0, 0);
        -ms-transform: translate3d(-100%, 0, 0);
        transform: translate3d(-100%, 0, 0);
    }

    to {
        opacity: 1;
        -webkit-transform: translateZ(0);
        -ms-transform: translateZ(0);
        transform: translateZ(0);
    }
}

@keyframes fadeInLeft {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(-100%, 0, 0);
        -ms-transform: translate3d(-100%, 0, 0);
        transform: translate3d(-100%, 0, 0);
    }

    to {
        opacity: 1;
        -webkit-transform: translateZ(0);
        -ms-transform: translateZ(0);
        transform: translateZ(0);
    }
}

.animate-fadeInLeft {
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
    -webkit-animation-name: fadeInLeft;
    animation-name: fadeInLeft;
}

@-webkit-keyframes fadeInUp {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0)
    }

    to {
        opacity: 1;
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

@keyframes fadeInUp {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0)
    }

    to {
        opacity: 1;
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

.animate__fadeInUp {
    -webkit-animation-name: fadeInUp;
    animation-name: fadeInUp
}

.mainArea1 .bannerArea {
    width: 75%;
    margin-left: auto;
}

.mainArea1 .bannerArea #flexslider-mb li .cover {
    height: 100%;
    background-color: #000;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}

.mainArea1 .bannerArea .title {
    position: absolute;
    right: 0;
    padding-top: 0.5rem;
    max-width: 100%;
    text-align: right;
    padding-left: 50%;
    font-size: 1rem;
}

.mainArea1 .bannerArea #flexslider-mb .flex-control-paging {
    text-align: left;
    padding-top: 1.25rem;
    padding-bottom: 1.25rem;
    margin: 0 -0.375rem;
    width: auto;
    display: inline-block;
}

.mainArea1 .bannerArea #flexslider-mb .flex-direction-nav {
    display: none;
}

.mainArea1 .bannerArea #flexslider-mb .flex-pauseplay {
    display: inline-block;
    padding-top: 13px;
    margin: 0 1.25rem;
    float: left;
}

.mainArea1 .bannerArea #flexslider-mb .flex-pauseplay a {
    position: relative;
    left: auto;
    bottom: auto;
    opacity: 1;
}

.mainArea1 .bannerArea #flexslider-mb .flex-direction-nav a:before {
    color: rgba(255, 255, 255, 0.8);
}

#flexslider-mb .flex-direction-nav,
#flexslider_footer .flex-direction-nav {
    margin: 0;
}

#flexslider-mb li .cover .youtube {
    max-width: 1320px;
    max-height: 940px;
    width: 100%;
    height: 100%;
}

#flexslider-mb li .cover iframe {
    width: 100%;
    height: 100%;
}

.mainArea2 {}

.mainArea2 .msgArea {}

.mainArea2 .msgArea .border {
    padding-right: 70px;
}

.mainArea2 .msgArea .title {
    margin-bottom: 0.625rem;
    font-size: 1.5rem;
    font-weight: bold;
}

.mainArea2 .msgArea .content {
    min-height: 100px;
    margin-bottom: 1.25rem;
    font-size: 1.375rem;
}

.mainArea2 .introArea {
    font-size: 2rem;
}

.mainArea2 #flexslider-msg .flex-direction-nav li {
    display: inline-block;
}

.mainArea2 #flexslider-msg .flex-direction-nav a {
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    position: relative;
    left: auto;
    top: auto;
    right: auto;
    width: 4.5rem;
    height: 4.5rem;
    opacity: 1;
    margin: 0;
    border: 2px solid #000;
    border-left: 2px solid #000;
    border-right: 1px solid #000;
    background-color: #fff;
    -webkit-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    transform: rotate(0deg);
}

.mainArea2 #flexslider-msg .flex-direction-nav a:hover,
.mainArea2 #flexslider-msg .flex-direction-nav a:focus {
    background-color: #000;
}

.mainArea2 #flexslider-msg .flex-direction-nav a.flex-next {
    -webkit-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    transform: rotate(180deg);
}

/*
    .mainArea2 #flexslider-msg .flex-direction-nav li:nth-child(1) a{
        border-left: 2px solid #000;
    }
    .mainArea2 #flexslider-msg .flex-direction-nav li:nth-child(2) a{
        border-right: 2px solid #000;
    }*/
.mainArea2 #flexslider-msg .flex-direction-nav a:before {
    content: "";
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    width: 1.8rem;
    height: 1.35rem;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    color: #000;
    text-shadow: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='27.118' height='21.414' viewBox='0 0 27.118 21.414' fill='%23000'%3E%3Cg%3E%3Cpath d='M1.118 9.707h26v2h-26z'/%3E%3Cpath d='m10.707 0 1.414 1.414-9.293 9.293L12.121 20l-1.414 1.414L0 10.707z'/%3E%3C/g%3E%3C/svg%3E%0A");
    background-size: 100% auto;
    background-position: center center;
    background-repeat: no-repeat;
}

.mainArea2 #flexslider-msg .flex-direction-nav a:hover:before,
.mainArea2 #flexslider-msg .flex-direction-nav a:focus:before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='27.118' height='21.414' viewBox='0 0 27.118 21.414' fill='%23fff'%3E%3Cg%3E%3Cpath d='M1.118 9.707h26v2h-26z'/%3E%3Cpath d='m10.707 0 1.414 1.414-9.293 9.293L12.121 20l-1.414 1.414L0 10.707z'/%3E%3C/g%3E%3C/svg%3E%0A");
}

.mainArea2 #flexslider-msg .flex-direction-nav a span {
    width: 0;
    height: 0;
    overflow: hidden;
    text-indent: -9999px;
}

.mainArea2 #flexslider-msg .flex-direction-nav .svg_arrow {
    /*	display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;*/
}

.mainArea3 .areaHL {
    /*
        width:75%;
        margin-left:auto;*/
}

.mainArea3 .highlightsList {
    padding: 1.25rem 0;
    position: relative;
}

.mainArea3 .highlightsList .data {
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
}

.mainArea3 .highlightsList>.data {
    /*
        min-height: 740px;*/
}

.mainArea3 .highlightsList .data>.scroll-content {
    padding-bottom: 2.5rem;
}

.mainArea3 .highlightsList .data>div:not(.scroll-content):not(.scroll-element) {
    width: 600px;
    max-width: 100%;
    -webkit-flex: 0 0 auto;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}

.mainArea3 .highlightsList .data>div:not(.scroll-content):not(.scroll-element):nth-child(1) {
    margin-left: -2.5rem;
}

.mainArea3 .highlightsList .data .border {
    padding-left: 2.5rem;
    padding-right: 2.5rem;
    color: #000;
}

/*
    .mainArea3 .highlightsList .scroll-x .scroll-element_track{
        position:relative;
        background-color:transparent;
    }
    .mainArea3 .highlightsList .scroll-x .scroll-element_track:before{
        content:"";
        position:absolute;
        height:1px;
        left:0;
        right:0;
        top:50%;
        -webkit-transform: translate(0,-50%);
        -ms-transform: translate(0,-50%);
        transform: translate(0,-50%);
        background-color: #bdbdbd;
    }
    .mainArea3 .highlightsList .scroll-x .scroll-bar{
        background-color:#000;
    }
    .mainArea3 .highlightsList .scrollbar-outer > .scroll-element .scroll-element_outer,
    .mainArea3 .highlightsList .scrollbar-outer > .scroll-element .scroll-element_track,
    .mainArea3 .highlightsList .scrollbar-outer > .scroll-element .scroll-bar{
        border-radius:2px;
    }*/
.mainArea3 .highlightsList .border>div {
    margin: 1.25rem 0;
}

.mainArea3 .highlightsList .border .cover {
    max-width: 480px;
    margin-bottom: 0.5rem;
    aspect-ratio: 16/9;
}

.mainArea3 .highlightsList .border .cover img {
    width: 100%;
    max-height: 100%;
    object-fit: cover;
    object-position: center;
}

.mainArea3 .highlightsList .border .tag {
    padding: 1rem 0;
    font-size: 0.9rem;
}

.mainArea3 .highlightsList .border .type {
    margin-right: 0.6rem;
    padding: 0.25rem 0.85rem;
    border: 1px solid #000;
}

.mainArea3 .highlightsList .border .date {
    position: relative;
    padding-left: 1.5rem;
    display: flex;
    align-items: center;
}

.mainArea3 .highlightsList .border .date:before {
    content: "";
    position: absolute;
    left: 0;
    width: 1rem;
    height: 1rem;
    background-image: url(../images/icon/icon_time.svg);
}

.mainArea3 .highlightsList .title {
    font-size: 1.5rem;
    font-weight: bold;
    color: #212121;
    position: relative;
}

/*.whatsnewList .title a:after,*/
.mainArea3 .highlightsList .title a:after,
.mainArea6 .lastestNewList .title a:after,
.whatsnewList .link a:after,
.statistics-list .title a:not(.nolink):after {
    content: "";
    display: inline-block;
    width: 1.25rem;
    height: 1.25rem;
    margin-left: 1rem;
    background-image: url(../images/icon/icon_newwindow.svg);
    background-repeat: no-repeat;
    background-size: 100% auto;
    background-position: center center;
}

.mainArea3 .highlightsList .content {
    color: #424242;
}

.mainArea3 .highlightsList .video {
    font-family: IBMPlexMono;
    padding-left: 3.125rem;
    position: relative;
    font-size: 0.7778rem;
}

.mainArea3 .highlightsList .video:before {
    content: "";
    position: absolute;
    left: 0;
    top: -0.5rem;
    width: 2.5rem;
    height: 2.5rem;
    background-image: url(../images/icon/icon_video.svg);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 100% auto;
}

.mainArea3.mainArea .more {
    position: absolute;
    right: 0;
    bottom: 1.5rem;
    padding: 0;
    padding-left: 3.5rem;
    background-color: #fff;
    -webkit-transform: translate(0, 50%);
    -ms-transform: translate(0, 50%);
    transform: translate(0, 50%);
    z-index: 10;
}

.mainArea3 .scrollbar-outer>.scroll-element.scroll-x {
    max-width: calc(100% - 250px);
}

.mainArea7 .ma7-area1 {
    margin-bottom: 145px;
}

.mainArea7 .ma7-area1 .grid-container {
    padding: 3rem;
    --grid-layout-gap: 8rem;
    --grid-item--min-width: 200px;
}

.mainArea7 .flexborder .title {
    font-size: 1.5rem;
    font-weight: bold;
}

.mainArea7 .ma7-area2 {}

.mainArea7 .ma7-area2 .myflex.flex111>div {
    padding: 0 1.5rem;
}

.mainArea7 .ma7-area2 .border {
    padding: 1.25rem;
    background-color: #f9f9f9;
    position: relative;
    padding-right: calc(1.25rem + 1.875rem);
    /* display: flex; */
    /* height: 100%; */
}

.mainArea7 .ma7-area2 .border::before {
    content: "";
    position: absolute;
    width: 1.25rem;
    height: 1.375rem;
    right: 1.875rem;
    bottom: 1.5rem;
    background-image: url(../images/icon/icon_arrow.svg);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 100% auto;
    -webkit-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    transform: rotate(180deg);
}

.mainArea7 .ma7-area2 .border:hover::before {
    background-image: url(../images/icon/icon_arrow_i.svg);
}

.mainArea7 .ma7-area2 .border:hover {
    background-color: #3058cc;
    color: white;
}

.mainArea7 .ma7-area2 .border:hover .icon img {
    filter: invert(1);
}

.mainArea7 .ma7-area2 .border:hover .title {
    color: white;
    text-decoration: none;
}

.mainArea7 .ma7-area2 .flexborder .title {
    margin: 0 1rem;
}

.mainArea7 .fstborder {
    position: relative;
    border-top: 1px solid #BDBDBD;
    border-bottom: 1px solid #BDBDBD;
}

.mainArea7 .fstborder .myflex.flex111>div {
    padding-top: 3.75rem;
    padding-right: 1.25rem;
    padding-bottom: 3.75rem;
    padding-left: 1.25rem;
}

.indexVersion .mainArea7 .icon {
    width: 7.5rem;
    margin-bottom: 1rem;
}

.mainArea7.mainArea .more {
    position: absolute;
    right: 0;
    bottom: 0;
    padding: 0;
    padding-left: 3.5rem;
    background-color: #fff;
    -webkit-transform: translate(0, 50%);
    -ms-transform: translate(0, 50%);
    transform: translate(0, 50%);
}

.mainArea9 .my_promotion {
    position: relative;
    display: flex;
}

.mainArea9 .myImgHead2 {
    position: absolute;
    z-index: 70;
    width: 70%;
    height: 100%;
    max-width: 1000px;
}

.mainArea9 .myImgHead2>div:first-child {
    background-image: url(../images/banner/img_a9_banner.jpg);
    background-position: left top;
    background-repeat: no-repeat;
    background-size: cover;
    /*height: 39.2vw;*/
    height: 100%;
    width: 100%;
}

.mainArea9 .myImgHead {
    background-image: url(../images/banner/img_a9_banner.jpg);
    background-position: left top;
    background-repeat: no-repeat;
    background-size: 63.2817% auto;
    padding-top: 100px;
}

.mainArea9 .border {
    width: 70%;
    max-width: 1000px;
    margin-left: auto;
    padding: 1.875rem;
    padding-left: 2.5rem;
    background-color: #fff;
    position: relative;
    z-index: 90;
    margin-top: 10%;
}

.mainArea9 .border .input {
    width: 400px;
    max-width: 100%;
}

.mainArea9 .mySearch .myform>div {
    margin: 2.5rem;
}

.mainArea9 .title {
    font-size: 2.2222222222222222222222222222222rem;
    font-weight: bold;
    line-height: 1.64em;
}

.mainArea9 .myform {
    /*
        font-size:1.1111rem;*/
    margin-bottom: 0;
}

.mainArea9 .myform .input {
    position: relative;
}

.mainArea9 .myform .input:after {
    content: "";
    position: absolute;
    width: 2rem;
    height: 2rem;
    left: 2px;
    /* right: 5px;*/
    top: 50%;
    background-repeat: no-repeat;
    background-image: url(../images/icon/icon_search.svg);
    background-position: center center;
    background-size: 100% auto;
    -webkit-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    transform: translate(0, -50%);
}

.mainArea9 .myform input[type="text"] {
    padding: 15px;
    padding-left: 45px;
    border: 0;
    border-bottom: 2px solid #000;
}

.mainArea9 .mySearch .myform>div.btnArea {}

.mainArea9 .fakeSelector .myLabel {
    margin-bottom: 12px;
}

.mainArea9 .multi-checkbox-field {
    width: 320px;
    max-width: 100%;
}

.mainArea9 .multi-checkbox-field a {
    text-transform: uppercase;
}

.mainArea9.mainArea .mybtn {
    margin: 0;
    margin-right: 2.5rem;
}

.mainArea9.mainArea .mybtn a {
    /*
        min-width:140px;
        max-width:100%;*/
}

.mainArea9.mainArea .mybtn.mybtn0 a {
    color: #595959;
    text-align: left;
    padding-left: 0;
    padding-right: 0;
}

.mainArea9.mainArea .borderName {
    font-size: 1.1rem;
    font-weight: bold;
    margin-top: 0.5rem;
}

.mainArea10 .border.banner {
    background-image: url(../images/banner/img_a10_banner.jpg);
    background-position: center left;
    background-size: cover;
    background-repeat: no-repeat;
}

.mainArea10 .border.detail {
    background-image: linear-gradient(124deg, rgba(70, 118, 226, .75) 0%, rgba(31, 161, 217, .75) 85%, rgba(29, 173, 216, .75) 100%);
    background-repeat: no-repeat;
    padding: 5rem;
}

.mainArea10 .border.detail .tit1 {
    font-size: 2.6666666666666666666666666666667rem;
    text-transform: uppercase;
}

.mainArea10 .border.detail .tit2 {
    font-size: 2.6666666666666666666666666666667rem;
    font-weight: bold;
    text-transform: uppercase;
}

.mainArea10 .border.detail .cont {
    padding: 2rem 0;
    color: #242424;
}

.mainArea10 .border.detail .cont ul {
    padding-left: 1.4em;
}

.mainArea10.mainArea .more {
    text-align: left;
}

.mainArea10.mainArea .more a {
    background-color: transparent;
}

/*============*/
.mainArea .flexImgText {
    margin-bottom: 3.75rem;
}

.mainArea p {
    color: #424242;
}

.mainArea .mybanner {
    margin: 1.25rem 0;
}

.breadcrumb {
    color: #212121;
    padding-left: 0;
    padding-top: 0;
    padding-bottom: 0;
    background: none;
    font-weight: 300;
    margin-bottom: 0;
    display: block;
    font-size: 1.5rem;
}

.breadcrumbbg {
    position: absolute;
    top: 8rem;
    left: 30%;
}

.breadcrumb ul,
.breadcrumb li {
    list-style: none;
}

.breadcrumb ul {
    padding: 0;
    margin: 0;
}

.breadcrumb li {
    margin-right: 0.25rem;
}

.breadcrumb ul>li:last-child {
    font-weight: bold;

}

.breadcrumb a {
    text-decoration: none;
    color: #000;
}

.breadcrumb a:hover,
.breadcrumb a:focus {
    color: #003e6f;
}

.breadcrumb span {
    padding-right: 0.8rem;
    margin-left: 0;
    margin-right: 0;
}

.indexVersion .breadcrumb {
    display: none;
}

.design-list .myflex {
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    gap: 1rem;
}

.design-list .border {
    position: relative;
    border-top: 1px solid #d3d3d3;
    margin-bottom: 5rem;
}

.design-list .type {
    position: absolute;
    left: auto;
    right: 0;
    top: 0;
    font-size: .8889rem;
    color: #fff;
    background-color: #000;
    padding: 0.25rem 12px;
    font-family: IBMPlexMono;
    font-weight: bold;
}

.design-list .border .type {
    left: 0;
    right: auto;
}

.design-list .cover {
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-align-items: flex-start;
    -ms-flex-align: start;
    align-items: flex-start;
    max-width: 500px;
    width: 100%;
}

.design-list .cover span {
    display: block;
    width: 100%;
    margin-top: 1.25rem;
}

.design-list .border .cover {
    -webkit-order: 1;
    -ms-flex-order: 1;
    order: 1;
    margin: 0 auto;
}

.design-list .detail {
    padding: 5.625rem 1.875rem 1.875rem 0;
    /*
        padding:1.875rem 1.875rem 1.875rem 0;
        min-height:250px;
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
        -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-align-content: center;
        -ms-flex-line-pack: center;
        align-content: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;*/
}

/* .design-list .detail>div {
        width: 100%;
    }  20220720*/

.design-list .detail>div.content {
    max-width: 100%;
    width: 450px;
}

.design-list .title {
    margin-bottom: 1.5rem;
}

.design-list .title a {
    position: relative;
    padding-right: 35px;
    font-size: 1.3333rem;
    color: #212121;
    font-weight: bold;
    display: inline-block;
}

.design-list .title a:not(.nolink):after {
    content: "";
    position: absolute;
    right: 0;
    top: 0.25rem;
    width: 1.5rem;
    height: 1.5rem;
    background-image: url(../images/icon/icon_newwindow.svg);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 100% auto;
}

.myImgHead {
    background-position: right top;
    background-repeat: no-repeat;
    background-size: 75% auto;
    padding-top: 130px;
}

.myImgHead .border {
    /*
        width: 900px;
        max-width: 100%;
        padding-right: 2.5rem;
        padding-left: 0.625rem;*/
    width: 55%;
    max-width: 100%;
}

.myImgHead .myheading {
    padding: 2.5rem 2.5rem 2.5rem 0;
    background-color: #fff;
}

.mainArea .scrollbar-outer>.scroll-element {
    background-color: transparent;
}

.mainArea .scrollbar-outer>.scroll-element .scroll-element_track,
.mainArea .scroll-x .scroll-element_track {
    position: relative;
    background-color: transparent;
}

.mainArea .scroll-x .scroll-element_track:before {
    content: "";
    position: absolute;
    height: 1px;
    left: 0;
    right: 0;
    top: 50%;
    -webkit-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    transform: translate(0, -50%);
    background-color: #bdbdbd;
}

.mainArea .scrollbar-outer>.scroll-element .scroll-bar,
.mainArea .scroll-x .scroll-bar {
    background-color: #000;
}

.mainArea .scrollbar-outer>.scroll-element .scroll-element_outer,
.mainArea .scrollbar-outer>.scroll-element .scroll-element_track,
.mainArea .scrollbar-outer>.scroll-element .scroll-bar {
    border-radius: 2px;
}

.mainAreaIntro2 {
    position: relative;
    color: #000;
    /*background-image: linear-gradient(105deg, #fd8e53, #fd5369 11%, #4a21f4 100%);*/
    background-image: linear-gradient(105deg, rgba(253, 142, 83, 90%), rgba(253, 83, 105, 90%) 11%, rgba(74, 33, 244, 90%) 100%);
}

.mainAreaIntro1 {}

.mainAreaIntro2 a {
    color: #000;
}

.mainAreaIntro2 .border {
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    /*min-height: 400px;*/
}

.mainAreaIntro2 .border:nth-child(even):before {
    content: "";
    position: absolute;
    left: 50%;
    right: auto;
    top: 0;
    bottom: 0;
    width: 1px;
    height: auto;
    background-color: #fff;
}

.mainAreaIntro2 .border>* {
    display: block;
    width: 640px;
    max-width: 100%;
    padding: 1.875rem;
}

.mainAreaIntro2 .type {
    display: inline-block;
    font-size: .8889rem;
    color: #fff;
    background-color: #000;
    padding: 0.25rem 12px;
    font-family: IBMPlexMono;
    font-weight: bold;
}

.mainAreaIntro2 .title {
    margin-top: 1.25rem;
    margin-bottom: 1.25rem;
    font-size: 1.5rem;
    font-weight: bold;
}

.mainAreaIntro3 .data {}

.mainAreaIntro3 .data .myflex {
    margin-left: -3.125rem;
    /*-webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;*/
}

.mainAreaIntro3 .data .myflex>div {
    min-width: 33.333%;
    max-width: 33.333%;
    padding: 3.125rem;
    -webkit-flex: 1 1 auto;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
}

.mainAreaIntro3 .data .cover {
    margin-bottom: 1.5rem;
}

.mainAreaIntro3 .data .title {
    font-size: 2rem;
    font-weight: bold;
}

.mainAreaIntro3 .data .sub-title {
    font-size: 1.1111rem;
}

.mainAreaIntro4 {
    position: relative;
}

.mainAreaIntro4 .area-oc {
    background-color: #e0e0e0;
    padding: 35px 0;
    margin: 2.5rem 0;
}

.mainAreaIntro4 .area-oc .head {
    font-size: 1.7778rem;
    text-align: center;
    font-weight: bold;
    border-bottom: 1px solid #707070;
    padding: 1.5rem 0;
}

.mainAreaIntro4 .area-oc .sub-head {
    font-size: 1.3333rem;
    font-weight: bold;
    padding: 2.5rem 0;
    border-bottom: 1px solid #707070;
}

.mainAreaIntro4 .area-oc .flex31 {
    min-width: 1440px;
    -webkit-flex-wrap: nowrap;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
}

.mainAreaIntro4 .area-oc .flex31>div {
    padding: 0 15px;
    margin-left: -15px;
    margin-right: 15px;
}

.mainAreaIntro4 .area-oc .flex-title {
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    font-weight: bold;
}

.mainAreaIntro4 .area-oc .cont {
    padding: 1.75rem 0;
    margin: 0 -0.625rem;
}

.mainAreaIntro4 .area-oc .cont>div {
    padding: 0 0.625rem;
    -webkit-flex: 1 1 0px;
    -ms-flex: 1 1 0px;
    flex: 1 1 0px;
}

.mainAreaIntro4 .tree-title>div>span {
    display: block;
    font-weight: bold;
    margin-bottom: 0.625rem;
}

.mainAreaIntro4 .tree-title .sub {
    position: relative;
    padding-left: 1.5rem;
    padding-top: 1.25rem;
    padding-bottom: 0.625rem;
}

.mainAreaIntro4 .tree-title .sub:before {
    content: "";
    position: absolute;
    left: 0;
    top: 0.5rem;
    width: 1rem;
    height: 2rem;
    border-left: 1px solid #000;
    border-bottom: 1px solid #000;
}

.mainAreaIntro4 .my-dl {
    position: absolute;
    right: 5rem;
    top: 3.125rem;
}

.mainArea .dl-pdf {
    padding-top: 1.25rem;
    padding-bottom: 1.25rem;
}

.mainArea .dl-pdf a {
    position: relative;
    display: inline-block;
    padding-left: 3.5em;
    padding-right: 1.25rem;
    font-size: 1.1671rem;
}

.mainArea .dl-pdf a:before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 2.5em;
    height: 3em;
    background-image: url(../images/icon/icon_pdf.svg);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 100% auto;
}

.mainArea .my-dl-text {
    font-size: 1.3333rem;
    font-family: IBMPlexMono;
    padding: 1.25rem 0;
}

.mainAreaFns1 .myImgHead {
    background-image: url(../images/banner/img_banner3.jpg);
}

.imgChart {
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    border-top: 1px solid #d3d3d3;
    border-bottom: 1px solid #d3d3d3;
    border-collapse: collapse;
}

.imgChart>div {
    position: relative;
    padding: 100px 0.625rem;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: space-around;
    -ms-flex-pack: distribute;
    justify-content: space-around;
    -webkit-align-items: flex-end;
    -ms-flex-align: end;
    align-items: flex-end;
    border-top: 1px solid #d3d3d3;
    border-bottom: 1px solid #d3d3d3;
    border-collapse: collapse;
}

.imgChart .full {
    width: 100%;
    -webkit-justify-content: flex-end;
    -ms-flex-pack: end;
    justify-content: flex-end;
}

.imgChart .full .cover {
    padding: 0 5rem;
}

.imgChart .half {
    width: 50%;
}

.imgChart .half.right:before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    28px bottom: 0;
    width: 1px;
    background-color: #d3d3d3;
}

.imgChart .type {
    position: absolute;
    left: 0;
    top: 0;
    font-size: .8889rem;
    color: #fff;
    background-color: #000;
    padding: 0.25rem 12px;
    font-family: IBMPlexMono;
    font-weight: bold;
}

.mainAreaFns2 .my-dl {
    width: 428px;
    max-width: 100%;
}

.mainAreaFns2 .my-dl>div {
    border-top: 1px solid #d3d3d3;
}

.myform {
    margin-bottom: 5rem;
    --inputpadding: 1.75rem;
    /* it should be in (1.75)em , but px should be acceptable **here**, not a real big deal. */
}

.myform h3 {
    font-size: 1.78rem;
}

.myform .myform-input {
    padding: 1.25rem 0;
}

.myform .myform-input>*>*:nth-child(1) {
    padding-top: var(--inputpadding);
}

.myform .myform-input>.myflex+.myflex {
    margin-top: 52px;
}

.myform .myform-input-area {
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    border-top: 1px solid #949494;
    margin-bottom: 1.75rem;
}

.myform .myform-input-area>div {
    padding: 0;
    border-bottom: 1px solid #949494;
}

.myform .myform-input-area>div.right {
    border-left: 1px solid #949494;
}

.myform .myform-input-area .full {
    width: 100%;
}

.myform .myform-input-area .half {
    width: 50%;
}

.myform .myform-input-area .half.right {}

.myform-border-area {
    padding: 1.75rem;
}

.myform-border-area p:last-of-type {
    margin-bottom: 0;
}

.myform select,
.myform textarea,
.myform input[type="text"],
.myform input[type="number"],
.myform input[type="tel"],
.myform input[type="email"],
.myform .datePicker input[type="date"],
.myform .timePicker input[type="time"] {
    border: 0;
    width: 100%;
    transition: all .4s;
}

/* make the input + label aligning middle *as a whole*, sharing a unified padding top/bottom on input*/
.myform .floating-label select,
.myform .floating-label textarea,
.myform .floating-label input[type="text"],
.myform .floating-label input[type="number"],
.myform .floating-label input[type="tel"],
.myform .floating-label input[type="email"],
.myform .floating-label .datePicker input[type="date"],
.myform .floating-label .timePicker input[type="time"] {
    padding: calc(var(--inputpadding) / 2 * 3) var(--inputpadding) calc(var(--inputpadding) / 2) var(--inputpadding);
}

.myform textarea {
    height: 12.5em;
    /* override browser default */
}

.myform .half>input:not([type="date"]):not([type="time"]) {
    height: 100%;
}

.myform .datePicker,
.myform .timePicker {
    display: flex;
    flex-direction: column;
}

.myform .datePicker>label,
.myform .timePicker>label {
    color: gray;
}

.myform .datePicker input[type="date"],
.myform .timePicker input[type="time"] {
    line-height: unset;
    /* override browser default */
    padding: calc(var(--inputpadding) / 2 * 3) var(--inputpadding) calc(var(--inputpadding) / 2) var(--inputpadding);
    /* override original */
}

.myform .myform-input-area .control-items {
    border: 0;
    padding: 1em var(--inputpadding);
    /* put 1em on top/bottom, and align left padding with others */
    flex-wrap: wrap;
}

.myform .myform-input-area .control-items button {
    position: relative;
    background: transparent;
    padding: 0;
    margin: 0 1em 0 0;
    /* margin left 1em (same as top/bottom margin defined above)*/
    min-width: 135px;
    padding: 0.25rem 12px;
    padding-left: 1.5rem;
    white-space: nowrap;
    font-weight: normal;
}

.myform .myform-input-area .control-items button:disabled {
    border: 1px solid #949494;
    color: #757575;
}

.myform .myform-input-area:not(.last) .control-items .plus-button {
    display: none;
}

.myform .myform-input-area .control-items .plus-button {
    border: 1px solid #000;
}

.myform .myform-input-area .control-items .plus-button:not(:disabled):hover {
    background-color: #000;
    color: #fff;
}

.myform .myform-input-area .control-items .minus-button {
    border: 1px solid #f00;
    color: #f00;
}

.myform .myform-input-area .control-items .minus-button:not(:disabled):hover {
    background-color: #f00;
    color: #fff;
}

.myform .myform-input-area .control-items .plus-button:before,
.myform .myform-input-area .control-items .minus-button:before {
    position: absolute;
    left: 2px;
    width: 1.5rem;
    height: 1.5rem;
}

.myform .myform-input-area .control-items .plus-button:before {
    content: "+";
}

.myform .myform-input-area .control-items .minus-button:before {
    content: "-";
}

.myform .myTextInput {
    padding-left: 3rem;
    margin: 1.25rem 0;
}

.myform .myTextInput input[type="text"] {
    border-bottom: 1px solid #9e9e9e;
    padding: 2px;
}

.myform textarea {
    border: 0;
    padding: 1.75rem;
    width: 100%;
    height: 200px;
    resize: none;
    display: block;
}

.myform select {
    border: 0;
    padding: 1.75rem;
    width: 100%;
}

.myform .selectBorder {
    position: relative;
    overflow: hidden;
    height: 100%;
}

.myform .selectBorder select {
    padding-right: 3.125rem;
    -webkit-appearance: none;
    -ms-appearance: none;
    appearance: none;
}

.myform .selectBorder:before {
    content: "";
    position: absolute;
    width: 1.5rem;
    height: 1.5rem;
    top: 50%;
    right: 12px;
    background-image: url(../images/icon/icon_arrow.svg);
    background-repeat: no-repeat;
    background-size: 1rem 1rem;
    background-position: center center;
    -webkit-transform: translate(0, -50%) rotate(-90deg);
    -ms-transform: translate(0, -50%) rotate(-90deg);
    transform: translate(0, -50%) rotate(-90deg);
    z-index: 10;
    pointer-events: none;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

.myform .selectBorder:focus-within:before {
    -webkit-transform: translate(0, -50%) rotate(90deg);
    -ms-transform: translate(0, -50%) rotate(90deg);
    transform: translate(0, -50%) rotate(90deg);
}

.myform .selectBorder:hover:before {
    /*
        right:-3.125rem;*/
}

.myform select:required:invalid {
    color: gray;
}

.myform option {
    color: #000;
}

.myform option[value=""][disabled] {
    display: none;
}

.myform .myform-submit {
    padding: 1.25rem 0;
}

.myform .myform-submit input[type="submit"] {
    font-size: 1.1111rem;
    background-color: #fff;
    border: 2px solid #000;
    padding: 1rem;
    width: 280px;
    max-width: 100%;
    text-align: center;
}

.myform .myform-submit input[type="submit"]:focus,
.myform .myform-submit input[type="submit"]:hover {
    color: #fff;
    background-color: #000;
}

.myform .floating-label,
.myform .myform-input-area .myFileUploader>div.title {
    position: relative;
}

.myform .floating-label>select+label,
.myform .floating-label>input+label,
.myform .floating-label>textarea+label {
    display: block;
    top: calc(var(--inputpadding) / 2);
    /* 0.9rem; label move to top, with font-size reduced */
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: calc(100% - var(--inputpadding) * 2);
}

.myform .floating-label>select+label {
    pointer-events: none;
}

@supports (not (-ms-ime-align:auto)) {

    .myform .floating-label>select+label,
    .myform .floating-label>input+label,
    .myform .floating-label>textarea+label {
        color: #757575;
        transition: all 0.2s ease-out;
        position: absolute;
        top: calc((100% - 1em) / 2);
        /* put the label in the middle like placeholder */
        left: var(--inputpadding);
        white-space: normal;
        margin: 0 0 0 0;
    }

    .myform .floating-label>select:focus~label,
    .myform .floating-label>select:not([value=""]):valid~label,
    .myform .floating-label>input:focus+label,
    .myform .floating-label>input:not(:placeholder-shown)+label,
    .myform .floating-label>textarea:focus+label,
    .myform .floating-label>textarea:not(:placeholder-shown)+label {
        color: #757575;
        /* overriding original */
        top: calc(var(--inputpadding) / 2);
        /* 0.875rem; label move to top, with font-size reduced */
        white-space: nowrap;
        font-size: 0.9rem;
    }
}

.contact-list {
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    border-top: 1px solid #d3d3d3;
    border-bottom: 1px solid #d3d3d3;
    border-collapse: collapse;
    margin: 2.5rem 0;
}

.contact-list>div {
    position: relative;
    padding: 3.75rem 3.75rem;
    border-top: 1px solid #d3d3d3;
    border-bottom: 1px solid #d3d3d3;
    border-collapse: collapse;
}

.contact-list>div.full,
.contact-list>div:not(.right) {
    padding-left: 0;
}

.contact-list .full {
    width: 100%;
    padding: 3.75rem 0;
}

.contact-list .full .myflex>div {
    padding: 0 3.75rem;
}

.contact-list .full .myflex>div:nth-child(1) {
    padding-left: 0;
}

.contact-list .half {
    width: 50%;
}

.contact-list .half.right:before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 1px;
    background-color: #d3d3d3;
}

.contact-list .type {
    position: absolute;
    left: 0;
    top: 0;
    font-size: .8889rem;
    color: #fff;
    background-color: #000;
    padding: 0.25rem 12px;
    font-family: IBMPlexMono;
    font-weight: bold;
}

.contact-list .title {
    font-size: 1.3333rem;
    margin: 1.25rem 0 2.5rem 0;
}

.contact-list .title,
.contact-list .title a {
    color: #212121;
}

.contact-list .title a {
    position: relative;
    display: inline-block;
    padding-right: 45px;
}

.contact-list .title a:after {
    content: "";
    position: absolute;
    width: 1.5rem;
    height: 1.5rem;
    right: 0;
    top: 2px;
    background-image: url(../images/icon/icon_newwindow.svg);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 100% auto;
}

.contact-list .time,
.contact-list .location,
.contact-list .mail,
.contact-list .tel,
.contact-list .fax {
    position: relative;
    padding-left: 2.5rem;
    margin: 1.25rem 0;
}

.contact-list .time:before,
.contact-list .location:before,
.contact-list .mail:before,
.contact-list .tel:before,
.contact-list .fax:before {
    content: "";
    position: absolute;
    width: 1.25rem;
    height: 1.25rem;
    left: 0;
    top: 2px;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
}

.contact-list .time:before {
    background-image: url(../images/icon/icon_time.svg);
}

.contact-list .location:before {
    background-image: url(../images/icon/icon_location.svg);
}

.contact-list .mail:before {
    background-image: url(../images/icon/icon_mail.svg);
}

.contact-list .tel:before {
    background-image: url(../images/icon/icon_tel.svg);
}

.contact-list .fax:before {
    background-image: url(../images/icon/icon_print.svg);
}

.ffFilter {
    /*  gap: 0.5rem 0.3125rem; */
    gap: 0.5rem;
    max-width: 100%;
}

.ffFilter>div {
    margin-bottom: 0;
    max-width: 100%;
    display: flex;
}

.ffFilter.right>:first-child {
    margin-left: auto;
}

.myFilter:not(.faqFilter) .ffFilter>div {
    /*height: 100%;*/
}



.ffFilter .multi-checkbox-field-toggle {
    line-height: normal;
    height: 100%;
}

.mypage_wn .ffFilter>div {
    /*height: auto;*/
}

.ffFilter.nomargin {
    margin-right: 0;
    margin-top: 0;
    padding: 1.25rem 0;
    -webkit-justify-content: flex-start;
    -ms-flex-pack: start;
    justify-content: flex-start;
}

.ffFilter.nomargin>div {
    margin: 0;
}

.ffFilter .selectBorder {
    position: relative;
    overflow: hidden;
}

.ffFilter .selectBorder:before {
    content: "";
    position: absolute;
    width: 1.5rem;
    height: 1.5rem;
    top: 50%;
    right: 12px;
    background-image: url(../images/icon/icon_arrow.svg);
    background-repeat: no-repeat;
    background-size: 1rem 1rem;
    background-position: center center;
    -webkit-transform: translate(0, -50%) rotate(-90deg);
    -ms-transform: translate(0, -50%) rotate(-90deg);
    transform: translate(0, -50%) rotate(-90deg);
    z-index: 10;
    pointer-events: none;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

.ffFilter .selectBorder:hover:before {
    /*
        right:-3.125rem;*/
}

.ffFilter select,
.ffFilter input[type=submit] {
    border: 0;
    padding: 1.125rem 1.125rem;
    /*width:428px;
        max-width: 100%;*/
    padding-right: 3.125rem;
    -webkit-appearance: none;
    -ms-appearance: none;
    appearance: none;
    background-color: #f2f2f2;
    line-height: normal;
    width: 100%;
}

.ffFilter select:required:invalid {
    color: gray;
}

.ffFilter option[value=""][disabled] {
    display: none;
}

.ffFilter option {
    color: #000;
}

.ffResult {
    border-collapse: collapse;
    margin: 1.25rem 0;
}

.ffResult .border {
    position: relative;
    border-top: 1px solid #d3d3d3;
    border-collapse: collapse;
    padding-top: 1.875rem padding-bottom: 3.75rem;
}

.ffResult .mylabel {
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;

    margin-bottom: 1.25rem;
}

.ffResult .mylabel>div {}

.ffResult .type {
    font-size: .8889rem;
    color: #fff;
    background-color: #000;
    padding: 0.25rem 12px;
    font-family: IBMPlexMono;
    font-weight: bold;
}

.ffResult .organiser {
    padding: 0.625rem 1.25rem;
    font-size: 0.7778rem;
    font-family: IBMPlexMono;
    overflow: hidden;
    /*white-space: nowrap;*/
    text-overflow: ellipsis;
    max-width: 100%;
    width: calc(100vw - 900px);
    min-width: 25vw;
}

.ffResult .organiser .name {
    font-size: 1.2857rem;
    font-weight: bold;
    font-family: IBMPlexSans;
}

.ffResult .cover img {
    max-width: 100%;
    max-height: 418px;
    width: auto;
    height: auto;
    padding: 2.5rem;
}

.ffResult .main {
    max-width: 100%;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-bottom: 5rem;
}

.ffResult .detail {
    max-width: 66.66% -webkit-flex: 1 1 0;
    -ms-flex: 1 1 0;
    flex: 1 1 0;
}

.ffResult .detail>* {
    margin-bottom: 1.25rem;
}

.ffResult .title {
    font-size: 1.3333rem;
    font-weight: bold;
}

.ffResult .title a {
    position: relative;
    display: inline-block;
    padding-right: 2.5rem;
}

.ffResult .title a:after {
    content: "";
    position: absolute;
    top: 0.25rem;
    right: 0;
    width: 1.5rem;
    height: 1.5rem;
    background-image: url(../images/icon/icon_newwindow.svg);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 100% auto;
}

.ffResult .tag {
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-bottom: 0.25rem;
    margin-right: -1rem;
}

.ffResult .tag>div {
    margin-right: 1rem;
    margin-bottom: 1rem;
}

.ffResult .tag a {
    font-family: IBMPlexMono;
    display: block;
    border-radius: 1rem;
    background-color: #ebebeb;
    padding: 0.5rem 1rem;
    font-size: 0.7778rem;
    text-decoration: none;
    background-color: #000;
}

.ffResult .tag .tag1 a {
    background-color: #ffa0b2;
}

.ffResult .tag .tag2 a {
    background-color: #ffa231;
}

.ffResult .tag .tag3 a {
    background-color: #FFF176;
}

.ffResult .tag .tag4 a {
    background-color: #0EEAFF;
}

.ffResult .tag .tag5 a {
    background-color: #45ffbe;
}

.ffResult .tag .tag6 a {
    background-color: #80baff;
}

.ffResult .tag .tag7 a {
    background-color: #d6baff;
}

.ffResult .tag .tag8 a {
    background-color: #ebebeb;
}

.ffResult .tag .tag9 a {
    background-color: #baffcb;
}

.ffResult .content {}

.ffResult .cover {
    width: 33.33%;
    max-width: 100%;
    text-align: center;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: space-around;
    -ms-flex-pack: distribute;
    justify-content: space-around;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-order: 1;
    -ms-flex-order: 1;
    order: 1;
}


.whatsnewList {
    margin: 0 -2.8%;
}

.ffResult-news .grid-item {
    width: 33.333%;
    padding: 1.25rem 2.8%;
    /*
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;*/
}

.ffResult-news .grid-item img {
    width: 100%;
}

/*
    .ffResult-news .cover~.detail{
        width:0;
        min-width:100%;
    }*/
.ffFilter .filterBtn a {
    display: inline-block;
    font-size: 1.1111rem;
    padding: 1rem 1rem;
    border: 2px solid #000;
    display: inline-block;
    width: 282px;
    max-width: 100%;
    text-align: center;
}

.ffFilter .filterBtn a.active,
.ffFilter .filterBtn a:focus,
.ffFilter .filterBtn a:hover {
    background-color: #000;
    color: #fff;
}

.ffFilter .filterBtn a span {
    display: inline-block;
    position: relative;
    padding: 0 0.625rem;
}

.ffFilter .filterBtn a span:before {
    content: "";
    width: 27px;
    height: 27px;
    position: absolute;
    right: 100%;
    background-repeat: no-repeat;
    background-position: center center;
}

.ffFilter .keyword .filterBtn a span:before {
    background-image: url(../images/icon/icon_radio.svg);
}

.ffFilter .keyword .filterBtn a.active span:before,
.ffFilter .keyword .filterBtn a:focus span:before,
.ffFilter .keyword .filterBtn a:hover span:before {
    background-image: url(../images/icon/icon_radio_i.svg);
}

.ffFilter .timeline .filterBtn a span:before {
    background-image: url(../images/icon/icon_timeline.svg);
}

.ffFilter .timeline .filterBtn a.active span:before,
.ffFilter .timeline .filterBtn a:focus span:before,
.ffFilter .timeline .filterBtn a:hover span:before {
    background-image: url(../images/icon/icon_timeline_i.svg);
}

.timeline .popmore {
    opacity: 0;
}

.timeline .popmore .whatsnew-timeline {
    display: none;
}

.ffKeywordTag {
    opacity: 0;
    margin: 0 -12px;
    max-height: 0;
    overflow: hidden;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

.ffKeywordTag.active {
    opacity: 1;
    max-height: 100vh;
    overflow: auto;
}

.ffKeywordTag .closeBtn {
    margin-bottom: 12px;
}

.ffKeywordTag .closeBtn a {
    font-family: IBMPlexMono;
    position: relative;
    display: inline-block;
    font-size: 0.7778rem;
    padding-left: 45px;
    text-transform: uppercase;
}

.ffKeywordTag .closeBtn a:before {
    content: "";
    position: absolute;
    left: 1rem;
    top: 0;
    width: 1.125rem;
    height: 1.125rem;
    background-image: url(../images/icon/icon_threelines.svg);
    background-size: 100% auto;
    background-repeat: no-repeat;
    background-position: center center;
}

.ffKeywordTag .ffKeywordTagList {
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

.ffKeywordTag .ffKeywordTagList a {
    display: inline-block;
    font-size: 1.3333rem;
    background-color: #f4f4f4;
    padding: 1rem 1.25rem;
    margin: 12px;
}

.publicationList {
    margin: 0 -2.3%;
}

.publicationList .grid-item {
    width: 33.333%;
    padding: 1.25rem 2.3%;
}

.publicationList .grid-item img {
    width: 100%;
}

.publicationList .detail {
    padding: 1.25rem 0;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

.publicationList .detail .title {
    font-size: 1.3333rem;
    font-weight: bold;
    margin-bottom: 1.25rem;
}

.publicationList .detail .time {
    position: relative;
    font-size: .8889rem;
    font-family: IBMPlexMono;
    color: #616161;
    padding-left: 1.875rem;
}

.publicationList .detail .time:before {
    content: "";
    position: absolute;
    left: 0;
    width: 1.125rem;
    height: 1.125rem;
    background-image: url(../images/icon/icon_time2.svg);
    background-position: center center;
    background-size: 100% auto;
    background-repeat: no-repeat;
}

.whatsnewList .cover .vidoeArea {
    position: relative;
    width: 100%;
    height: 0;
    padding-bottom: 56.25%;
}

.whatsnewList .cover .vidoeArea iframe {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
}

.whatsnewList .detail {
    padding: 1.25rem 0;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

.whatsnewList .detail .tag {
    font-size: .7778rem;
    font-family: IBMPlexMono;
    margin-bottom: 0.25rem;
}

.whatsnewList .detail .tag .type {
    display: inline-block;
    padding: 0.25rem 12px;
    margin-right: 1rem;
    margin-bottom: 1rem;
    border: 1px solid #000;
}

.whatsnewList .detail .title {
    font-size: 1.3333rem;
    font-weight: bold;
    margin-bottom: 1.25rem;
    width: 100%;
}

.whatsnewList .detail .link {
    margin-bottom: 1.25rem;
    width: 100%;
}

.whatsnewList .detail .content p {
    margin-bottom: 1.25rem;
}

.whatsnewList .detail .content .more {
    font-family: IBMPlexMono;
}

.whatsnewList .detail .time {
    position: relative;
    font-size: .8889rem;
    font-family: IBMPlexMono;
    color: #616161;
    padding-left: 1.875rem;
}

.whatsnewList .detail .time:before {
    content: "";
    position: absolute;
    left: 0;
    width: 1.125rem;
    height: 1.125rem;
    background-image: url(../images/icon/icon_time2.svg);
    background-position: center center;
    background-size: 100% auto;
    background-repeat: no-repeat;
}

.whatsnew-timeline .inprogress-list,
.whatsnew-timeline .comingsoon-list {
    margin-bottom: 3.75rem;
}

.whatsnew-timeline .inprogress-list>div,
.whatsnew-timeline .comingsoon-list>div {
    border-top: 1px solid #d3d3d3;
}

.whatsnew-timeline .myflex {}

.whatsnew-timeline .myflex>div {
    width: 22%;
    position: relative;
}

.whatsnew-timeline .myflex>div:nth-child(1) {
    width: 56%;
}

.whatsnew-timeline .detail {
    padding: 1.5rem 0;
}

.whatsnew-timeline .type {
    font-size: .8889rem;
    color: #fff;
    background-color: #000;
    padding: 0.25rem 12px;
    font-family: IBMPlexMono;
    font-weight: bold;
    display: inline-block;
    margin-bottom: 0.625rem;
}

.whatsnew-timeline .title {
    font-size: 1.3333rem;
    font-weight: bold;
    margin-bottom: 1.75rem;
}

.whatsnew-timeline .location {
    position: relative;
    padding-left: 2.5rem;
}

.whatsnew-timeline .location:before {
    content: "";
    width: 1.625rem;
    height: 1.625rem;
    position: absolute;
    left: 0;
    background-image: url(../images/icon/icon_location.svg);
    background-repeat: no-repeat;
    background-position: center left;
}

.statistics-list {
    padding: 1.5rem 0;
}

.statistics-list>.myflex {}

.statistics-list>.myflex>div {
    width: 22%;
    position: relative;
}

.statistics-list>.myflex>div:nth-child(1) {
    width: 56%;
}

.statistics-list .type {
    font-size: .8889rem;
    color: #fff;
    background-color: #000;
    padding: 0.25rem 12px;
    font-family: IBMPlexMono;
    font-weight: bold;
    display: inline-block;
    margin-bottom: 0.625rem;
}

.statistics-list thead tr,
.statistics-list>div {
    border-top: 1px solid #d3d3d3;
}

.statistics-list .detail {
    padding: 1.5rem 0px 1.5rem 12px;
}

.statistics-list .title {
    font-size: 1.1671rem;
}

.statistics-list .xls,
.statistics-list .pdf,
.statistics-list .eform {
    width: 50%;
}

.statistics-list .link {
    width: 90%;
}

.statistics-list .xls a,
.statistics-list .pdf a,
.statistics-list .link a,
.statistics-list .eform a {
    display: block;
    font-size: 1rem;
    font-family: IBMPlexMono;
    position: relative;
    padding-left: 2.5rem;
    padding-right: 1.25rem;
    white-space: nowrap;
}

.statistics-list .xls a:before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 27px;
    height: 27px;
    background-image: url(../images/icon/icon_table.svg);
    background-repeat: no-repeat;
}

.statistics-list .pdf a:before {
    content: "";
    position: absolute;
    left: 0;
    top: -0.25rem;
    width: 1.5rem;
    height: 1.5rem;
    background-image: url(../images/icon/icon_pdf.svg);
    background-repeat: no-repeat;
}

.statistics-list .eform a:before {
    content: "";
    position: absolute;
    left: 0;
    top: -0.25rem;
    width: 1.5rem;
    height: 1.5rem;
    background-image: url(../images/icon/icon_eform.svg);
    background-repeat: no-repeat;
}

.statistics-list .link a:before {
    content: "";
    position: absolute;
    left: 0;
    top: -0.25rem;
    width: 27px;
    height: 31px;
    background-image: url(../images/icon/icon_newwindow.svg);
    background-repeat: no-repeat;
}

.statistics-list.statistics3 .detail {
    padding: 1.75rem 0px 1.75rem 12px;
}


.statistics-list.statistics3>.myflex {
    -webkit-flex-wrap: nowrap;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    border-top: 1px solid #bdbdbd;
}


.statistics-list thead tr th {
    padding-top: 0;
    padding-bottom: 0;
}

.statistics-list.statistics3 tbody td,
.statistics-list.statistics3>.myflex:nth-last-child(1) {
    border-bottom: 1px solid #bdbdbd;
}


.statistics-list.statistics3 tbody tr:nth-child(even) td,
.statistics-list.statistics3>.myflex:nth-child(even) {
    background-color: #eee;
}

.statistics-list.statistics3 tbody tr td,
.statistics-list.statistics3>.myflex>div {
    width: 21%;
}

.statistics-list.statistics3 tbody tr td:nth-child(1),
.statistics-list.statistics3>.myflex>div:nth-child(1) {
    padding-left: 0;
}

.statistics-list.statistics3 tbody tr td:nth-child(2),
.statistics-list.statistics3>.myflex>div:nth-child(2) {
    width: 70%;
}

.statistics-list.statistics3>.myflex>div:last-child {
    padding-right: 0;
}

.fso_permit .statistics-list .type {
    white-space: nowrap;
}

.statistics-list.statistics4>.myflex>div:first-child {
    display: flex;
    flex-direction: column;
}

.statistics-list.statistics4>.myflex>div:first-child .type {
    flex: 0 1 auto;
    width: max-content;

}

.statistics-list.statistics4>.myflex>div:first-child .detail {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
}

.statistics-list.statistics4>.myflex>div:first-child .detail .more-info {
    flex: 0 1 auto;
    width: max-content;
    margin-top: auto;
    margin-bottom: 1rem;
}

.statistics-list.statistics4>.myflex>div:nth-child(n+1) {
    width: 33.333333%;
}

.statistics-list.statistics4>.myflex>div:last-child {}

.statistics-list.statistics4>div:nth-child(even) {
    background-color: #eee;
}

.statistics-list.statistics4>.myflex:nth-child(n+2) .type {
    display: none;
    /* hide n+2 COMPANY / CONTACT INFO / TAGS tag */
}

.statistics-list.statistics4 .myflexList {
    margin-bottom: 1.25rem;
}

.myTagFilter .myfArea .tag,
.myDocumentContent .headingWith .tag,
.statistics-list.statistics4 .tag {
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin: 0 -0.625rem;
    margin-bottom: 0.5rem;
    font-size: 1rem;
}

.myTagFilter .myfArea .tag {
    margin: 0;
    padding: 0 1rem;
}

.statistics-list.statistics4 .detail {
    padding: 1.5rem 12px 1.5rem 12px;
}

.tag-selector {
    margin-left: -0.625rem;
    margin-right: -0.625rem;
}

.myTagFilter .myfArea .tag>div,
.tag-selector>div,
.myDocumentContent .headingWith .tag>div,
.mDocTitleList .type>div,
.statistics-list.statistics4 .tag>div {
    padding: 0.5rem 0.625rem;
}

.myTagFilter .myfArea .tag>div a,
.tag-selector>div a,
.tags a,
.myDocumentContent .headingWith .tag>div a,
.mDocTitleList .type>div a,
.statistics-list.statistics4 .tag>div a {
    display: block;
    padding: 0.25rem 12px;
    border: 1px solid #000;
    transition: all 0.25s;
}

.myTagFilter .myfArea .tag>div a:hover,
.tag-selector>div a:hover,
.tags a:not(.active):hover,
.tags a.active:not(:hover),
.myDocumentContent .headingWith .tag>div a:hover,
.myDocumentContent .type>div a:hover,
.statistics-list.statistics4 .tag>div a:not(.active):hover,
.statistics-list.statistics4 .tag>div a.active:not(:hover) {
    background: #3058cc;
    border-color: #3058cc;
    color: white;
    text-decoration: none;
}

/* production credits list */

.mygrid {
    display: -ms-grid;
    display: grid;
    gap: 0 1rem;
    -ms-grid-columns: 20% 1rem auto 1rem 20%;
    grid-template-columns: 20% auto 20%;
}

.statistics5 tr td:nth-child(1) {
    width: 20%;
}

.statistics5 tr td:nth-child(2) {
    width: 60%;
}

.statistics5 tr td:nth-child(3) {
    width: 20%;
}

.statistics-list.statistics5>.mygrid.no-cover {
    -ms-grid-columns: 20% auto;
    grid-template-columns: 20% auto;
}

.statistics-list.statistics5 .h4 {
    margin-bottom: 35px;
    margin-top: 0;
}

.statistics-list.statistics5 .h4 .yearspan {
    font-size: 0.9rem;
    display: none;
}

.statistics-list.statistics5 .no-cover .image {
    display: none;
}

/* production credits list ends */

.linksList {
    padding: 0 0 5rem 0;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

.linksList .type {
    position: absolute;
    left: 0.5rem;
    top: 0.5rem;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    font-size: .7778rem;
    color: #000;
    background-color: #ffa231;
    padding: 0.5rem 1rem;
    font-family: IBMPlexMono;
    border-radius: 1rem;
}

.linksList .type.type1 {
    background-color: #ffa231;
}

.linksList .type.type2 {
    background-color: #ffa0b2;
}

.linksList .type.type3 {
    background-color: #fff176;
}

.linksList>div {
    width: 50%;
    position: relative;
    border-top: 1px solid #d3d3d3;
    border-bottom: 0;
    border-collapse: collapse;
    min-height: 15rem;
    padding: 2.5rem;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}

.linksList>div:nth-last-child(-n+2) {
    border-bottom: 1px solid #d3d3d3;
}

.linksList>div:nth-child(even):before {
    content: "";
    position: absolute;
    right: 100%;
    width: 1px;
    top: 0;
    bottom: 0;
    background-color: #d3d3d3;
}

.linksList .cover,
.linksList .cover a {
    text-align: center;
}

/*============*/
.myflex.flex334>div {
    width: 32%;
    padding: 0 0.625rem;
}

.myflex.flex334>div:nth-child(3) {
    width: 35%;
    padding: 0 0.625rem;
}

.myflex.flex21>div:nth-child(1) {
    width: 66.666%;
    padding: 0 0.625rem;
}

.myflex.flex21>div:nth-child(2) {
    width: 33.333%;
    padding: 0 0.625rem;
}

.myflex.flex111>div {
    min-width: 33.333%;
    width: 400px;
    max-width: 100%;
    padding: 0 15px;
}

.myflex.flex221>div:nth-child(1) {
    width: 38%;
    padding: 0 15px;
}

.myflex.flex221>div:nth-child(2) {
    width: 40%;
    padding: 0 15px;
}

.myflex.flex221>div:nth-child(3) {
    width: 22%;
    padding: 0 15px;
}

.myflex.flex34>div:nth-child(1) {
    width: 44%;
    padding: 0 15px;
}

.myflex.flex34>div:nth-child(2) {
    width: 56%;
    padding: 0 15px;
}

.myflex.flex41>div:nth-child(1) {
    width: 80%;
    padding: 0 15px;
}

.myflex.flex41>div:nth-child(2) {
    width: 20%;
    padding: 0 15px;
}

.myflex.flex1111>div {
    width: 25%;
    padding: 0 5px;
}

.myflex.flex111111>div {
    position: relative;
    min-width: 16.666%;
    padding: 0.5rem;
    width: 260px;
    max-width: 100%;
}

.myflex.flex31>div:nth-child(1) {
    width: 75%;
}

.myflex.flex31>div:nth-child(2) {
    width: 25%;
}

.myflex.flexMw50>div {
    max-width: 50%;
}

/*============*/
.svg_arrow.up_arrow .svg_arrow_svg {
    overflow: visible;
    width: 1rem;
    height: 1rem;
    transform: translate(0px, 0px) matrix(1, 0, 0, 1, 0, 0) rotate(-90deg);
    transform-origin: center;
}

.svg_arrow.up_arrow .svg_arrow_path {
    fill: #fff;
}

/*============*/
.myflex.flexPhoto {
    -webkit-flex-wrap: nowrap;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
}

.myflex.flexPhoto>div {
    -webkit-flex: 1 1 auto;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
}

.flexPhoto>div:nth-child(1) {
    text-align: left;
    width: 150px;
    max-width: 100%;
    padding-right: 1.25rem;
    -webkit-flex: 0 0 auto;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
}

.flexPhoto>div:nth-child(1) img {
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 0.625rem;
}

.flexPhoto>div:nth-child(1) p {
    line-height: normal;
    font-size: .8333rem;
}

/*============*/
.mainContent ul.a {
    padding-left: 6em;
    margin: 2em 0;
    list-style-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Ccircle cx='5' cy='5' r='.8' stroke='black' stroke-width='8' fill='none'/%3E%3C/svg%3E");
}

.myflex.flexBBtn {
    -webkit-flex-wrap: nowrap;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin: 5rem 0 1.25rem 0;
}

.myflex.flexBBtn a {
    position: relative;
    display: block;
    width: 3.75rem;
    height: 3.75rem;
    border-radius: 100px;
    background-color: #A6AABE;
    color: transparent;
    overflow: hidden;
    font-size: 0;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
    z-index: 10;
}

.myflex.flexBBtn a:before {
    content: "";
    display: block;
    -webkit-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transform-origin: center;
    -ms-transform-origin: center;
    transform-origin: center;
    overflow: visible;
    width: 3.75rem;
    height: 3.75rem;
    position: relative;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' class='svg_arrow_svg' width='26' height='26' style='overflow: visible !important; position: absolute; top: 50%25; left: 50%25; -webkit-transform: matrix(1,0,0,1,0,0) translate(-40%25,-50%25); -ms-transform: matrix(1,0,0,1,0,0) translate(-40%25,-50%25); transform: matrix(1,0,0,1,0,0) translate(-40%25,-50%25);' viewBox='1991.397 129.484 19.313 26.46'%3E%3Cpath class='svg_arrow_path' style='fill: rgba(0,0,0,0); stroke: rgba(255,255,255,1); stroke-width: 0.25rem; stroke-linejoin: round; stroke-linecap: round; stroke-miterlimit: 4; shape-rendering: auto;' d='M 1991.3974609375 147.8847961425781 L 1991.3974609375 129.4844055175781 L 2010.7109375 141.6504058837891 L 1991.3974609375 155.9443054199219'%3E%3C/path%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center center;
}

.myflex.flexBBtn>div:nth-child(1) a:before {
    -webkit-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    transform: rotate(180deg);
}

/*================================*/
.cpmb {
    color: #424242;
    font-size: 1.125rem;
}

.cpmb .heading {
    font-size: 1.7778rem;
    font-weight: bold;
    color: #212121;
    margin-bottom: 15px;
}

.cpmb .date {
    font-weight: bold;
    margin-bottom: 15px;
}

.cpmb .marea {
    padding: 5rem 0;
}

.cpmb .flexcover>div:nth-child(1) {
    width: 60%;
}

.cpmb .flexcover>div:nth-child(2) {
    width: 40%;
}

.cpmb .mylogo {
    padding: 0 1.25rem;
}

.cpmb .mylogo>div {
    margin-bottom: 2.5rem;
}

.cpmb .mylogo a {
    display: block;
    text-align: center;
}

.cpmb .mylogo .cover {
    text-align: center;
}

#close_up .area .cpmb .mylogo .title {
    position: relative;
    font-size: 1.3333rem;
    font-weight: bold;
    padding: 0.625rem;
    padding-right: 35px;
    display: inline-block;
}

.cpmb .mylogo .title:after {
    content: "";
    position: absolute;
    right: 0;
    top: 13px;
    width: 1.5rem;
    height: 1.5rem;
    background-image: url(../images/icon/icon_newwindow.svg);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 100% auto;
}

.cpmb .myvideo {
    padding: 2.5rem 0;
}

.cpmb .flexslider {
    padding: 2.5rem 0;
}

.cpmb .flexslider .flex-control-paging {
    text-align: left;
    padding-top: 1.25rem;
    padding-bottom: 1.25rem;
    margin: 0 -0.375rem;
    width: auto;
    position: relative;
    bottom: auto;
    height: 0.5rem;
}

.cpmb .flexslider .flex-control-paging li a {
    border-radius: 0;
    box-shadow: none;
    width: 2.5rem;
    height: 0.5rem;
    position: relative;
    background-color: transparent;
}

.cpmb .flexslider .flex-control-paging li a:before {
    content: "";
    position: absolute;
    background: #bdbdbd;
    top: 3.5px;
    bottom: 3.5px;
    left: 0;
    right: 0;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

.cpmb .flexslider .flex-control-paging li a:focus:before,
.cpmb .flexslider .flex-control-paging li a:hover:before {
    background: #444;
}

.cpmb .flexslider .flex-control-paging li a.flex-active {
    background-color: transparent;
    cursor: default;
}

.cpmb .flexslider .flex-control-paging li a.flex-active:before {
    background: #000;
    top: 0;
    bottom: 0;
}

/*================================*/
.myflex.flexCenter {
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.myflex.flexRight {
    -webkit-justify-content: flex-end;
    -ms-flex-pack: end;
    justify-content: flex-end;
}

.myflex.flexBetween {
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

.myflex.flexAround {
    -webkit-justify-content: space-around;
    -ms-flex-pack: distribute;
    justify-content: space-around;
}

.myflex.flexBottom {
    -webkit-align-items: flex-end;
    -ms-flex-align: end;
    align-items: flex-end;
}

.myflex.flexMiddle {
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}

.myflex.flexWrap {
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

.myflex.flexNoWrap {
    -webkit-flex-wrap: nowrap;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
}

.myflex.flexNoFit {
    -webkit-align-content: flex-start;
    -ms-flex-line-pack: start;
    align-content: flex-start;
}

.myflex.flexFit>div {
    -webkit-flex: 1 1 auto;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
}

.myflexList>div {
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
}

.flexTitleList>div>div:nth-child(1),
.flexTitleList>div .title {
    min-width: 9.5rem;
    width: 9.5rem;
    padding-right: 15px;
}

/*===================*/
.expand_list {
    counter-reset: question;
    margin-bottom: 2rem;
    /*border-top:1px solid #bdbdbd;*/
}

.expand_list>div {
    border-bottom: 1px solid #bdbdbd;
}

.expand_list .title a {
    position: relative;
    display: block;
    padding: 2rem 6.25rem 2rem 3rem;
    font-weight: bold;
    font-size: 1.5rem;
    text-decoration: none;
    color: #000;
}

.expand_list .title a:not(.number):before {
    content: "";
    position: absolute;
    left: 0;
    width: 2rem;
    height: 2rem;
    background-image: url(../images/icon/icon_faq.png);
    background-repeat: no-repeat;
    background-size: contain;
    top: 2rem;
}

.expand_list .title a.number:before {
    counter-increment: question;
    content: counter(question);
    position: absolute;
    left: 0;
    background-repeat: no-repeat;
    background-size: 100% auto;

    border: 3px solid #282828;
    text-align: center;
    border-radius: 100px;
    width: 1.6em;
    height: 1.6em;
    top: 22px;
}

.expand_list .title a:active:before,
.expand_list .title a:hover:before,
.expand_list .title a:focus:before {
    border-color: #0d2e4a;
}

.expand_list .title a:after {
    content: "";
    position: absolute;
    top: 2.5rem;
    right: 0.3rem;
    width: 1.25rem;
    height: 1.25rem;
    background-image: url(../images/icon/icon_cross.svg);
    background-repeat: no-repeat;
    background-size: 100% auto;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
    -webkit-transition: -webkit-transform .2s ease-out, color .2s ease-out;
    -ms-transition: -ms-transform .2s ease-out, color .2s ease-out;
    transition: transform .2s ease-out, color .2s ease-out;
}

.expand_list .title a:hover:after,
.expand_list .title a:active:after {
    background-image: url(../images/icon/icon_cross_i.svg);
}

.expand_list>div.active .title a:after {
    -webkit-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    transform: rotate(0deg);
}

.expand_list .content {
    display: none;
    padding: 0 100px 1.5rem 3.125rem;
    -webkit-transition: opacity 0.3s ease-in-out, max-height 0.3s ease-in-out;
    -ms-transition: opacity 0.3s ease-in-out, max-height 0.3s ease-in-out;
    transition: opacity 0.3s ease-in-out, max-height 0.3s ease-in-out;
    opacity: 0;
    max-height: 0;
}

.expand_list>div.activating .content {
    display: block;
    opacity: 0;
    max-height: 0;
}

.expand_list>div.active .content {
    display: block;
    opacity: 1;
    max-height: 9999px;
}

.mainArea div.nomargin,
.mainContent div.nomargin {
    margin-top: 0;
    margin-bottom: 0;
}

/*=============================*/
.section5 .leftMenu .menuLv0>li>a {
    position: relative;
    padding-right: 55px;
}

.section5 .leftMenu .menuLv0>li>a:after {
    content: '';
    display: inline-block;
    width: 2.25rem;
    height: 2.25rem;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    position: absolute;
    right: 0.75rem;
    top: 0.75rem;
}

.section5 .leftMenu .menuLv0>li:nth-child(1)>a:after {
    background-image: url(../images/icon/icon_section5_1.svg);
}

.section5 .leftMenu .menuLv0>li:nth-child(2)>a:after {
    background-image: url(../images/icon/icon_section5_3.svg);
}

.section5 .leftMenu .menuLv0>li:nth-child(3)>a:after {
    background-image: url(../images/icon/icon_section5_4.svg);
}

/* .section5 .leftMenu .menuLv0>li:nth-child(4)>a:after {
        background-image: url(../images/icon/icon_section5_4.svg);
    } */

.section5 .leftMenu .menuLv0>li:nth-child(1)>a:hover:after,
.section5 .leftMenu .menuLv0>li:nth-child(1)>a:focus:after,
.section5 .leftMenu .menuLv0>li:nth-child(1).active>a:after,
.section5 .leftMenu .menuLv0>li:nth-child(1)>a.leftbtn.active_sub_section:after,
.section5 .leftMenu .menuLv0>li:nth-child(1)>a.leftbtn.active_sub_section:after,
.section5 .leftMenu .menuLv0>li:nth-child(1)>a.active_section.active_section_sub:after {
    background-image: url(../images/icon/icon_section5_1_i.svg);
}

.section5 .leftMenu .menuLv0>li:nth-child(2)>a:hover:after,
.section5 .leftMenu .menuLv0>li:nth-child(2)>a:focus:after,
.section5 .leftMenu .menuLv0>li:nth-child(2).active>a:after,
.section5 .leftMenu .menuLv0>li:nth-child(2)>a.leftbtn.active_sub_section:after,
.section5 .leftMenu .menuLv0>li:nth-child(2)>a.leftbtn.active_sub_section:after,
.section5 .leftMenu .menuLv0>li:nth-child(2)>a.active_section.active_section_sub:after {
    background-image: url(../images/icon/icon_section5_3_i.svg);
}

.section5 .leftMenu .menuLv0>li:nth-child(3)>a:hover:after,
.section5 .leftMenu .menuLv0>li:nth-child(3)>a:focus:after,
.section5 .leftMenu .menuLv0>li:nth-child(3).active>a:after,
.section5 .leftMenu .menuLv0>li:nth-child(3)>a.leftbtn.active_sub_section:after,
.section5 .leftMenu .menuLv0>li:nth-child(3)>a.leftbtn.active_sub_section:after,
.section5 .leftMenu .menuLv0>li:nth-child(3)>a.active_section.active_section_sub:after {
    background-image: url(../images/icon/icon_section5_4_i.svg);
}

/* .section5 .leftMenu .menuLv0>li:nth-child(4)>a:hover:after,
    .section5 .leftMenu .menuLv0>li:nth-child(4)>a:focus:after,
    .section5 .leftMenu .menuLv0>li:nth-child(4).active>a:after,
    .section5 .leftMenu .menuLv0>li:nth-child(4)>a.leftbtn.active_sub_section:after,
    .section5 .leftMenu .menuLv0>li:nth-child(4)>a.leftbtn.active_sub_section:after,
    .section5 .leftMenu .menuLv0>li:nth-child(4)>a.active_section.active_section_sub:after {
        background-image: url(../images/icon/icon_section5_4_i.svg);
    } */

.myStatHeading {
    margin-top: 3.75rem;
    margin-bottom: 2.5rem;
}

.myStatList {
    margin-bottom: 1.25rem;
}

.myStatList>div {
    position: relative;
    /*width:430px;*/
    max-width: 100%;
    padding-right: 1.25rem;
    padding-left: 55px;
    padding-top: 0.625rem;
    padding-bottom: 0.625rem;
}

.myStatList>div:before,
.myStatList .list_0 img {
    content: "";
    position: absolute;
    left: 0;
    width: 3rem;
    height: 3rem;
    background-repeat: no-repeat;
    background-size: 100% auto;
}

.myStatList .list_1:before {
    background-image: url(../images/icon/icon_stat_1.svg);
}

.myStatList .list_2:before {
    background-image: url(../images/icon/icon_stat_2.svg);
}

.myStatList .list_3:before {
    background-image: url(../images/icon/icon_stat_3.svg);
}

.myStatList .list_4:before {
    background-image: url(../images/icon/icon_stat_4.svg);
}

.myStatList .list_5:before {
    background-image: url(../images/icon/icon_stat_5.svg);
}

.myStatList .value {
    font-size: 1.3333rem;
    font-weight: bold;
}

.myStatList .detail {
    color: #424242;
}

/*=============*/
.mytag_wn,
.mytag_ev {
    font-size: 1.7778rem;
    margin: 0 -1.5rem 0 -1.5rem;
}

.mytag_wn>div {}

.mytag_wn a,
.mytag_ev a {
    display: block;
    padding: 1.25rem 2rem;
    font-weight: bold;
    color: #595959;
}

.mytag_wn .active a,
.mytag_ev .active a,
.mytag_wn a.active {
    color: #212121;
}

.filterBtn a {
    display: inline-block;
    font-size: 1.1111rem;
    padding: 1rem 1rem;
    padding-left: 45px;
    border: 2px solid #000;
    display: inline-block;
    max-width: 100%;
    text-align: center;
}

.filterBtn a.active,
.filterBtn a:focus,
.filterBtn a:hover {
    background-color: #000;
    color: #fff;
}

.filterBtn a span {
    display: inline-block;
    position: relative;
    padding: 0 0.625rem;
}

.filterBtn a span:before {
    content: "";
    width: 27px;
    height: 27px;
    position: absolute;
    right: 100%;
    background-repeat: no-repeat;
    background-position: center center;
}

.timeline .filterBtn a span:before {
    background-image: url(../images/icon/icon_timeline.svg);
}

.timeline .filterBtn a.active span:before,
.timeline .filterBtn a:focus span:before,
.timeline .filterBtn a:hover span:before {
    background-image: url(../images/icon/icon_timeline_i.svg);
}

.fnk_hd {
    position: relative;
    margin-top: 1.25rem;
    padding-left: 35px;
    font-family: IBMPlexMono;
}

.fnk_hd:before {
    content: "";
    width: 1.25rem;
    height: 1.25rem;
    position: absolute;
    top: 0;
    left: 0;
    background-image: url(../images/icon/icon_radio.svg);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 100% auto;
}

.tool_wn {
    /*
        margin-bottom: 2.5rem;*/
}

.ft_wn {
    margin: 0 -1.25rem;
}

.ffFilter.ft_wn>div {
    /* width: 320px; */
    padding: 1.25rem;
    margin: 0;
}

.dptool {
    font-family: IBMPlexMono;
    font-size: 0.9rem;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    margin-left: auto;
    margin-top: 1rem;
}

.dptool .tit {
    text-transform: uppercase;
    margin: 0.625rem 15px;
}

.dptool .mydisplay a {
    position: relative;
    display: block;
    padding: 0 0.625rem;
    padding-left: 55px;
    margin: 0.625rem 0;
}

.dptool .mydisplay .active a,
.dptool .mydisplay a:hover,
.dptool .mydisplay a:focus {
    color: #2C4FBA;
}

.dptool .mydisplay a:before {
    content: "";
    position: absolute;
    top: 50%;
    left: 0.625rem;
    width: 2.5rem;
    height: 2.5rem;
    background-repeat: no-repeat;
    background-size: 100% auto;
    -webkit-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    transform: translate(0, -50%);
}

.dptool .mydisplay .mdp_grid a:before {
    background-image: url(../images/icon/icon_grid.svg);
}

.dptool .mydisplay .mdp_grid.active a:before,
.dptool .mydisplay .mdp_grid a:hover:before,
.dptool .mydisplay .mdp_grid a:focus:before {
    background-image: url(../images/icon/icon_grid_i.svg);
}

.dptool .mydisplay .mdp_list a:before {
    background-image: url(../images/icon/icon_list.svg);
}

.dptool .mydisplay .mdp_list.active a:before,
.dptool .mydisplay .mdp_list a:hover:before,
.dptool .mydisplay .mdp_list a:focus:before {
    background-image: url(../images/icon/icon_list_i.svg);
}

/*==================*/
.mainArea .page_control {
    font-family: IBMPlexMono;
    margin: 1.875rem 0;
}

.mainArea .page_control,
.mainArea .page_control a {
    color: #757575;
}

.mainArea .page_control .active,
.mainArea .page_control .active a {
    color: #000;
}

.mainArea .page_control>.myflex {
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}

.mainArea .page_control>.myflex>div {
    padding: 0 0.375rem;
}

.mainArea .page_control>.myflex>div a {
    position: relative;
    padding: 0.625rem 0.625rem;
    text-decoration: none;
    display: block;
}

.mainArea .page_control>.myflex>div a:hover,
.mainArea .page_control>.myflex>div a:focus {
    text-decoration: none;
    color: #444;
}

.mainArea .page_control>.myflex .next,
.mainArea .page_control>.myflex .prev {
    font-size: .8889rem;
    margin: 0 1.25rem;
}

.mainArea .page_control>.myflex .pagenum a:before {
    content: "";
    position: absolute;
    background: #bdbdbd;
    height: 1px;
    bottom: 3.5px;
    left: 0;
    right: 0;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

.mainArea .page_control>.myflex .pagenum.active a:before {
    background: #000;
    bottom: 0;
    height: 0.5rem;
}

.mainArea .page_control>.myflex .pagenum a:focus:before,
.mainArea .page_control>.myflex .pagenum a:hover:before {
    background: #444;
}

.ffFilter.flexLeft {
    -webkit-justify-content: flex-start;
    -ms-flex-pack: start;
    justify-content: flex-start;
}

.ev2aFilter {
    position: relative;
    border-top: 1px solid #e0e0e0;
    border-bottom: 1px solid #e0e0e0;
}

.activeFilter .tit {
    font-family: IBMPlexMono;
    text-transform: uppercase;
    font-size: 0.7778rem;
    padding-right: 1.25rem;
}

.activeFilter .tit:after {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    margin-left: 1.25rem;
    width: 1px;
    background-color: #e0e0e0;
}

.activeFilter .tag a {
    content: "";
    position: relative;
    padding: 0 3.125rem;
    color: #732dd9;
}

.activeFilter .tag a:after {
    content: "";
    position: absolute;
    top: 2px;
    right: 0;
    width: 1.125rem;
    height: 1.125rem;
    background-image: url(../images/icon/icon_closetag.svg);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 100% auto;
}

.clearFilter a {
    display: block;
    text-transform: uppercase;
    font-family: IBMPlexMono;
    color: #000;
    padding: 1.25rem;
    background-color: #f4f4f4;
}

.mypage_ev,
.eventOn .mypage_wn {
    display: none;
}

.eventOn .mypage_ev {
    display: block;
}

.eventOn .mypage_ev.mypage_ev1,
.eventOn .mypage_ev.mypage_ev2 {
    display: none;
}

.eventOn.event1 .mypage_ev.mypage_ev1,
.eventOn.event2 .mypage_ev.mypage_ev2 {
    display: block;
}

.eventOn .myflex.mypage_ev {
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
}

.mypage_ev .statistics-list .detail {
    padding: 22px 0px 1.25rem 12px;
}

.mypage_ev .statistics-list .title {
    font-size: 1.3333rem;
    font-weight: bold;
    margin-bottom: 1rem;
}

.mypage_ev .statistics-list .location {
    position: relative;
    margin: 0.625rem 0;
    padding-left: 1.75rem;
}

.mypage_ev .statistics-list .location:before {
    content: "";
    position: absolute;
    left: 0;
    top: 2px;
    width: 1.25rem;
    height: 1.25rem;
    background-image: url(../images/icon/icon_location.svg);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: auto 100%;
}

.mypage_ev .statistics-list .ticket {
    position: relative;
    margin: 0.625rem 0;
    padding-left: 1.75rem;
}

.mypage_ev .statistics-list .ticket:before {
    content: "";
    position: absolute;
    left: 0;
    top: 2px;
    width: 1.25rem;
    height: 1.25rem;
    background-image: url(../images/icon/icon_ticket.svg);
    background-repeat: no-repeat;
    background-size: 100% auto;
}

.multi-checkbox-field {
    background: #fff;
    border: 1px solid #ebebeb;
    border-radius: 2px;
    position: relative;
    margin-bottom: 1rem;
}

.multi-checkbox-field-toggle {
    background: #fff;
    cursor: pointer;
    line-height: 1.5rem;
    padding: 0;
    position: relative;
    /*min-width: 200px;*/
}

.multi-checkbox-field-toggle>a {
    display: block;
    padding: 1.125rem 1.5rem;
    font-size: 1.25rem;
    color: #000;
    text-decoration: none;
    margin-right: 3.125rem;
}

.multi-checkbox-field-toggle:after {
    content: "";
    position: absolute;
    top: 50%;
    right: 1.25rem;
    width: 1.5rem;
    height: 1.5rem;
    -webkit-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    transform: translate(0, -50%);
    background-image: url(../images/icon/icon_arrow24.svg);
    transition: all .3s ease-in-out;
}

.multi-checkbox-field.active .multi-checkbox-field-toggle:after {
    -webkit-transform: translate(0, -50%) rotate(180deg);
    -ms-transform: translate(0, -50%) rotate(180deg);
    transform: translate(0, -50%) rotate(180deg);
}

.multi-checkbox-field .list {
    background: #fff;
    border: 1px solid #ebebeb;
    border-bottom-left-radius: 2px;
    border-bottom-right-radius: 2px;
    border-top: 0;
    display: none;
    margin: 0 -1px;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    z-index: 2;
    padding: 1rem 1.25rem 0.875rem;
    max-height: 282px;
    overflow-y: auto;
    min-width: 20rem;
}

.multi-checkbox-field .list,
.multi-checkbox-field.active {
    box-shadow: 0 0 1.25rem rgb(0 0 0 / 5%);

}

.multi-checkbox-field.active .list {
    display: block;
    padding-top: 0.5rem;
}

.multi-checkbox-field .cat_title {
    margin-bottom: 1rem;
    font-weight: bold;
    margin-top: 2rem;
}

.multi-checkbox-field .checkbox {
    cursor: pointer;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    margin-bottom: 1rem;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}


.myFilter .checkbox,
.myFilter .checkboxset,
.myFilter .optionset,
.myFilter .radio {
    margin-right: 1rem;
    margin-top: 0.25rem;
}

.mainArea .myFilter .mybtn {
    margin-left: 0;
}

.multi-checkbox-field .checkbox {
    padding-left: 0;
}

.multi-checkbox-field .checkbox input {
    margin: 0;
    margin-right: 1.25rem;
}

.ffFilter.fit input {
    width: auto;
}

.radio label,
.checkbox label {
    display: inline;
    font-weight: normal;
    cursor: pointer;
}

.multi-checkbox-field .checkbox label {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    margin-bottom: 0;
}

.myFilter .checkbox label,
.myFilter .checkboxset label,
.myFilter .optionset label,
.myFilter .radio label {
    margin-right: 0.5rem;
}

.myFilter .no-wrap .checkbox label,
.myFilter .no-wrap .checkboxset label,
.myFilter .no-wrap .optionset label,
.myFilter .no-wrap .radio label {
    white-space: nowrap;
}

.mybtn {
    display: inline-block;
    /*
        font-size: 1.1111rem;*/
    font-weight: bold;
    text-transform: uppercase;
    text-align: center;
    margin-left: 2rem;
}

.mybtn .ipBorder,
.mybtn a {
    display: block;
    text-align: center;
    /*min-width: 185px;*/
    padding: 1.125rem 1.5rem;
    font-size: 1.25rem;
}

.mybtn.mybtn1 a {
    position: relative;
    border: 2px solid #000;
    padding-right: 3.5rem;
}

.mybtn.mybtn1 .ipBorder:before,
.mybtn.mybtn1 a:before {
    content: "";
    position: absolute;
    right: 1.5rem;
    width: 1.5rem;
    height: 1.5rem;
    background-image: url(../images/icon/icon_arrow24_horizontal.svg);
}

.mybtn.mybtn1 .ipBorder:hover,
.mybtn.mybtn1 .ipBorder:focus,
.mybtn.mybtn1 a:hover,
.mybtn.mybtn1 a:focus {
    border: 2px solid #000;
    background-color: #000;
    color: #fff;
}

.mybtn.mybtn1 .ipBorder:hover input,
.mybtn.mybtn1 .ipBorder:focus input {
    color: inherit;
}

.mybtn.mybtn1 .ipBorder:hover:before,
.mybtn.mybtn1 .ipBorder:focus:before,
.mybtn.mybtn1 a:hover:before,
.mybtn.mybtn1 a:focus:before {
    background-image: url(../images/icon/icon_arrow24_horizontal_i.svg);
}

.mybtn.mybtn1 .ipBorder {
    position: relative;
    border: 2px solid #000;
    padding: 0;
}

.mybtn .ipBorder input,
.mybtn .ipBorder button {
    border: 0;
    background-color: transparent;
    display: block;
    width: 100%;
}

.mybtn .ipBorder input {
    padding: 1.125rem 1.5rem;
    padding-right: 56px;
    text-transform: inherit;
    font-weight: inherit;
    color: inherit;
}

.mybtn .ipBorder button {
    padding: 0;
    color: #4d4d4d;
}

.mybtn.mybtn1 .ipBorder:before {
    top: 50%;
    -webkit-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    transform: translate(0, -50%);
}

.mybtn .ipBorder>button:hover,
.mybtn .ipBorder>input[type=submit]:hover,
.mybtn .ipBorder>input[type=reset]:hover {
    text-decoration: underline;
}

.mybtn.mybtnNm {
    margin: 0;
}

.mybtn.mybtnSub {
    color: #4d4d4d;
}

.mybtn.mybtn1.iconAddUser a {
    padding-right: 1.5rem;
    padding-left: 4rem;
}

.mybtn.mybtn1.iconAddUser a:before {
    right: auto;
    left: 1.5rem;
    background-image: url(../images/icon/icon_add_user.svg);
}

.mybtn.mybtn1.iconAddUser a:focus:before,
.mybtn.mybtn1.iconAddUser a:hover:before {
    right: auto;
    left: 1.5rem;
    background-image: url(../images/icon/icon_add_user_i.svg);
}

.myflexFirstDiv,
.myflexFirstDiv .type {
    min-width: 130px;
}

.videoArea {
    margin-bottom: 70px;
}

.videoArea .border {
    position: relative;
    width: 100%;
    padding-bottom: 56.25%;
}

.videoArea .border iframe {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
}

/*
    body a:hover {
        color: unset;
    }*/

.left_arrow::before {
    font-family: "flexslider-icon";
    font-size: 1.25rem;
    display: inline-block;
    content: '\f001';
    color: rgba(0, 0, 0, 0.8);
    text-shadow: 1px 1px 0 rgb(255 255 255 / 30%);
}

.right_arrow::before {
    font-family: "flexslider-icon";
    font-size: 1.25rem;
    display: inline-block;
    content: '\f002';
    color: rgba(0, 0, 0, 0.8);
    text-shadow: 1px 1px 0 rgb(255 255 255 / 30%);
}

/*=========================*/
.table-wrapper {
    position: relative;
}

.table-wrapper:before {
    content: "";
    position: absolute;
    z-index: 25;
    top: 150px;
    right: 15px;
    width: 27.118px;
    height: 21.414px;
    -webkit-animation: fadeOutRight 1.45s ease-in-out linear infinite;
    animation: fadeOutRight 1.45s ease-in-out infinite;
    opacity: 0;
    -webkit-transform: translate3d(0, 0, 0) rotate(180deg);
    transform: translate3d(0, 0, 0) rotate(180deg);
    background: url(../images/icon/icon_arrow.svg) no-repeat center center;
    background-size: contain;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

.table-wrapper:after {
    content: "";
    position: absolute;
    z-index: 22;
    top: 0;
    right: -1px;
    bottom: 0;
    display: block;
    width: 3.75rem;
    pointer-events: none;
    background-image: -webkit-gradient(linear, left top, right top, from(rgba(255, 255, 255, 0)), color-stop(30%, rgba(255, 255, 255, .5)), to(#fff));
    background-image: -o-linear-gradient(left, rgba(255, 255, 255, 0) 0, rgba(255, 255, 255, .5) 30%, #fff 100%);
    background-image: linear-gradient(to right, rgba(255, 255, 255, 0) 0, rgba(255, 255, 255, .5) 30%, #fff 100%);
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

.table-wrapper.right-end:after,
.table-wrapper.right-end:before {
    opacity: 0;
    -webkit-animation: none;
    animation: none;
}

.table-wrapper.right-end.all-end:after,
.table-wrapper.right-end.all-end:before {
    display: none;
}

@-webkit-keyframes fadeOutRight {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0, 0, 0) rotate(180deg);
        transform: translate3d(0, 0, 0) rotate(180deg);
    }

    20% {
        opacity: 1;
        -webkit-transform: translate3d(0, 0, 0) rotate(180deg);
        transform: translate3d(0, 0, 0) rotate(180deg);
    }

    100% {
        opacity: 0;
        -webkit-transform: translate3d(100%, 0, 0) rotate(180deg);
        transform: translate3d(100%, 0, 0) rotate(180deg);
    }
}

@keyframes fadeOutRight {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0, 0, 0) rotate(180deg);
        transform: translate3d(0, 0, 0) rotate(180deg);
    }

    20% {
        opacity: 1;
        -webkit-transform: translate3d(0, 0, 0) rotate(180deg);
        transform: translate3d(0, 0, 0) rotate(180deg);
    }

    to {
        opacity: 0;
        -webkit-transform: translate3d(100%, 0, 0) rotate(180deg);
        transform: translate3d(100%, 0, 0) rotate(180deg);
    }
}

.eventOn .event-search {
    display: block !important;
}

.title_center {
    text-align: center;
}

div.alterColor {
    background: #fafafa !important;

}

.rightbtnwrap {
    text-align: right;
    width: 40%;
}

.rightbtnwrap>div {
    margin-left: 1rem;
    display: inline-block;
}

.detailBackBtn a span:before {
    background-image: url(../images/icon/east-black-24-dp-b.svg);
    content: "";
    width: 1.5rem;
    height: 1.5rem;
    position: absolute;
    right: 100%;
    background-repeat: no-repeat;
    background-position: center center;
    top: 54%;
    transform: translateY(-50%);
}

.detailBackBtn a:active span:before,
.detailBackBtn a:focus span:before,
.detailBackBtn a:hover span:before {
    background-image: url(../images/icon/east-black-24-dp-w.svg);
}

.detailBackBtn a.active,
.detailBackBtn a:focus,
.detailBackBtn a:hover {
    background-color: #000;
    color: #fff;
}

.detailBackBtn a span {
    display: inline-block;
    position: relative;
    padding: 0 0.625rem;
}

.detailBackBtn a {
    display: inline-block;
    font-size: 1.1111rem;
    padding: 1rem 1rem;
    padding-left: 45px;
    border: 2px solid #000;
    display: inline-block;
    max-width: 100%;
    text-align: center;
}

.timeline .filterBtn.archiveBtn a span:before {
    background-image: url(../images/icon/archive-24-dp-b.svg);
}

.timeline .filterBtn.archiveBtn a.active span:before,
.timeline .filterBtn.archiveBtn a:focus span:before,
.timeline .filterBtn.archiveBtn a:hover span:before {
    background-image: url(../images/icon/archive-24-dp-w.svg);
}

/*======================*/
body:not(.fixedHeader):not(.indexVersion) .bodyArea {
    padding-top: 3rem !important;
}

.headerArea {
    top: 0;
    background-color: #FFF;
}

.fixedHeader .headerArea {
    position: fixed;
    /*overflow-y: hidden;*/
    /* prevent share button being cropped */
    max-height: 5rem;
}

.fixedHeader .headerArea .myLogo .logo_0 a .dst {
    display: none;
}

.fixedHeader .headerArea .myLogo .logo_0 a .mob {
    display: block;
    width: 65%;
    max-height: 100%;
    overflow-y: hidden;
    object-fit: cover;
    object-position: top;
}


.footerArea .fMenu>li>a:hover,
.footerArea .fMenu>li>a:focus {
    text-decoration: none !important;
    cursor: auto;
}

.flexslider .flex-direction-nav .flex-prev {
    left: 0.625rem;
}

.flexslider .flex-direction-nav .flex-next {
    right: 0.625rem;
}




.rsMenu li span {
    float: left;
}

.heading-padding-top {
    margin-top: 3.75rem !important;
}

.footerArea #flexslider_footer.flexslider .flex-control-paging li.myFFPrev a,
.footerArea #flexslider_footer.flexslider .flex-control-paging li.myFFNext a,
.bodyArea .flexslider .flex-control-paging li.myFFPrev a,
.bodyArea .flexslider .flex-control-paging li.myFFNext a {
    position: relative;
    text-indent: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.bodyArea .flexslider .flex-control-paging li.myFFPrev a:before,
.bodyArea .flexslider .flex-control-paging li.myFFNext a:before {
    font-family: "flexslider-icon";
    font-size: 1.25rem;
    display: inline-block;
    color: rgba(0, 0, 0, 0.8);
    background-color: transparent;
}

.footerArea #flexslider_footer.flexslider .flex-control-paging li.myFFPrev a:before,
.footerArea #flexslider_footer.flexslider .flex-control-paging li.myFFNext a:before {
    font-family: "flexslider-icon";
    font-size: 1.25rem;
    display: inline-block;
    position: static;
    top: auto;
    bottom: auto;
    left: auto;
    right: auto;
    color: rgba(0, 0, 0, 0.8);
    background-color: transparent;
    -webkit-transform: translate(0%, -0.25rem);
    -ms-transform: translate(0%, -0.25rem);
    transform: translate(0%, -0.25rem);
}

.footerArea #flexslider_footer.flexslider .flex-control-paging li.myFFPrev a:before,
.bodyArea .flexslider .flex-control-paging li.myFFPrev a:before {
    content: '\f001';
}

.footerArea #flexslider_footer.flexslider .flex-control-paging li.myFFNext a:before,
.bodyArea .flexslider .flex-control-paging li.myFFNext a:before {
    content: '\f002';
}

.myFFPrev a span,
.myFFNext a span {
    position: absolute;
    width: 0;
    height: 0;
    overflow: hidden;
    left: -9999px;
}

.footerArea #flexslider_footer.flexslider .flex-control-paging li.myFFPrev a:focus:before,
.footerArea #flexslider_footer.flexslider .flex-control-paging li.myFFNext a:focus:before,
.bodyArea .flexslider .flex-control-paging li.myFFPrev a:hover:before,
.bodyArea .flexslider .flex-control-paging li.myFFNext a:hover:before {
    color: rgba(0, 0, 0, 1);
    background-color: transparent;
}

.headerTool .headerMenu .searchTool .overflowArea {
    margin-top: 2rem;
}

.headerArea .headerTool .clientTool .searchTool {
    display: none;
    float: none;
    /*
        display: block;
        margin-right: 15px;
        margin-top: 12px;/*
        margin-top: 45px;
        padding: 0;*/
    text-align: right;
    z-index: 8901;
    /*
        display: inline-block;*/
    position: absolute;
    top: 100%;
    right: 0;
    max-width: 100%;
    width: 600px;
    -webkit-box-shadow: 0 0 5px 2px rgb(0 0 0 / 10%);
    box-shadow: 0 0 5px 2px rgb(0 0 0 / 10%);
    padding: 15px;
    background-color: #fff;
}

.headerArea .headerTool .clientTool:not(.activeSearch) .searchSite img.close {
    display: none;
}

.headerArea .headerTool .clientTool.activeSearch .searchSite img.open {
    display: none;
}

.headerArea .headerTool .activeSearch .searchTool {
    display: block;
}

/*===============================*/
.headerMenu .cuMenu li {
    padding-top: 0.75rem;
    padding-bottom: 0.75rem;
    padding-left: 2.25rem;
}

.headerMenu .cuMenu {
    padding-left: 0;
    margin-left: 0;
    margin-bottom: 0;
}

.cuMenu li a {
    position: relative;
}

.cuMenu li a:before {
    content: "";
    position: absolute;
    left: 0;
    top: 1rem;
    width: 1.25rem;
    height: 1.25rem;
    background-size: contain;
}

.cuMenu li.my_menu0 a:before {
    background-image: url(../images/icon/icon_mail.svg);
}

.cuMenu li.my_menu1 a:before {
    background-image: url(../images/icon/icon_tel.svg);
}

.cuMenu li.my_menu2 a:before {
    background-image: url(../images/icon/icon_print.svg);
}

.cuMenu li.my_menu3 a:before {
    background-image: url(../images/icon/icon_time.svg);
}

.cuMenu li.my_menu4 a:before {
    background-image: url(../images/icon/icon_location.svg);
}

/*============================================*/
.fmOnly {
    display: none;
}

.footerArea .fmOnly {
    display: block;
}

/*================*/
.myFilter_n_Result {
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    flex-direction: column;
}

.mfsSearch .input {
    position: relative;
}

.mfsSearch .input input {
    width: 100%;
    padding: 15px;
    padding-right: 45px;
    border: 0;
    border-bottom: 2px solid #000;
}

.mfsSearch .input input:focus,
.mfsSearch .input input:hover {
    border-bottom: 2px solid #3058cc;
}

.mfsSearch .input:after {
    content: "";
    position: absolute;
    width: 1.75rem;
    height: 1.75rem;
    right: 0px;
    top: 50%;
    background-repeat: no-repeat;
    background-image: url(../images/icon/icon_search.svg);
    background-position: center center;
    background-size: 100% auto;
    -webkit-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    transform: translate(0, -50%);
}

.mainArea .mfsSearch .mybtn {
    margin: 1.25rem 0;
}

.mainArea .mfsSearch .mybtn a {
    min-width: 0;
}

.mfsFilter .border .content {
    padding: 1.25rem;
    border: 1px solid transparent;
}

.mfsFilter .border.cb .content {
    border: 1px solid #bdbdbd;
}

.mfsFilter .border .title a {
    position: relative;
    display: block;
    font-size: 1.3333333333333333333333333333333rem;
    font-weight: bold;
    padding: 1.5rem 0;
    padding-right: 2rem;
}

.ceTag .title a:after {
    content: "";
    position: absolute;
    right: 0px;
    top: 2rem;
    width: 1.5rem;
    height: 1.5rem;
    background-image: url(../images/icon/icon_arrow24.svg);
    -webkit-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

.ceTag.active .title a:after {
    -webkit-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    transform: rotate(180deg);
}

.ceTag .content {
    display: none;
    -webkit-transition: opacity 0.3s ease-in-out, max-height 0.3s ease-in-out;
    -ms-transition: opacity 0.3s ease-in-out, max-height 0.3s ease-in-out;
    transition: opacity 0.3s ease-in-out, max-height 0.3s ease-in-out;
    opacity: 0;
    max-height: 0;
}

.ceTag.activating .content {
    display: block;
    opacity: 0;
    max-height: 0;
}

.ceTag.active .content {
    display: block;
    opacity: 1;
    max-height: 9999px;
}

.myCheckList>div {
    margin: 0;
}

.myCheckList>div:not(:nth-child(1)) {
    margin-top: 1.25rem;
}

.myCheckList>div:not(:nth-last-child(1)) {
    margin-bottom: 1.25rem;
}

.myCheckList.mclMulti>div>div {
    margin: 0;
}

.myCheckList.mclMulti>div>div:not(:nth-child(1)) {
    margin-top: 1.25rem;
}

.myCheckList.mclMulti>div>div:not(:nth-last-child(1)) {
    margin-bottom: 1.25rem;
}

.myCheckList label {
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-align-self: center;
    -ms-flex-item-align: center;
    align-self: center;
    margin: 0;
    position: relative;
}

.myCheckList label input[type="checkbox"] {
    min-width: 22px;
    width: 22px;
    height: 22px;
    margin-top: 0;
}

.myCheckList label input[type="checkbox"]+span {
    padding-left: 1.625rem;
}

.myCheckList>div {
    margin-left: var(--inputpadding);
}

.myCheckList>div:first-child {
    margin-top: var(--inputpadding);
}

.myCheckList>div:last-child {
    margin-bottom: var(--inputpadding);
}

.myform .myform-input-area .myCheckList label>input:checked~span {
    color: #111;
    /* make color darker when checked */
}

.myCheckList>div>label {
    display: flex;
    align-items: center;
    /* align to middle */
}

.myCheckList>div>label:hover {
    text-decoration: underline;
    /* add underline on hover */
    cursor: pointer;
    /* add hand cursor */
    color: #111;
    /* make color dark */
}

.myform-border-area .myCheckList {
    margin-bottom: 0.625rem;
}

.mfsCat ul {
    padding: 0;
    list-style-type: none;
}

.mfsCat ul>li {
    margin-bottom: 1.25rem;
}

/* location list */

.mfsFilter .content>.scroll-wrapper {
    min-height: 200px;
    height: 600px;
    max-height: 80vh;
}

.mfsFilter .tool_wn {
    margin: 1rem 0;
}

.mfsResult {
    -webkit-flex: 1 1 auto;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    max-width: 100%;
}

.mfsResult .data-list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    --data-list-gap: 2rem;
    gap: var(--data-list-gap) var(--data-list-gap);
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -ms-flex-line-pack: stretch;
    align-content: stretch;
    padding: 1rem 0;
}

.mfsResult .data-list .border {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    width: calc(100% / 3 - var(--data-list-gap) * 2 / 3);
    min-height: 100%;
}

.mfsResult .cover img {
    width: 100%;
    aspect-ratio: 16 / 9;
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: center;
    object-position: center;
}

.mfsResult .myCount {
    padding-bottom: 1.5rem;
    border-bottom: 1px solid #d3d3d3;
}

.mfsResult .header {
    margin-bottom: 0.5rem;
}

.truncate-tags-display.truncated {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    gap: 1rem;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
}

.mfsResult .type {
    margin: 0 -0.5rem;
    font-size: 1rem;
}

.truncate-tags-display .tags {
    overflow-y: hidden;
    font-size: 1rem;
    /* tags-height: font-size + padding + margin + negative maring of .tags */
    --tags-height: calc(1rem + 0.5rem + 1rem + 0.5rem);
}

.truncate-tags-display .tags.empty {
    display: none;
}

.truncate-tags-display:not(.show-all) .tags {
    height: var(--tags-height);
}

.truncate-tags-display .tags a {
    display: inline-block;
    margin: 0.5rem;
    padding: 0.25rem 12px;
    border: 1px solid #000;
}

.truncate-tags-display .tt-down .more {
    padding: 0;
}

.truncate-tags-display:not(.truncated) .tt-down {
    display: none;
}

.truncate-tags-display.truncated.show-all .tt-down .more {
    display: none;
}

.mainArea .truncate-tags-display.show-all .mybtn.tt-down a:after {
    transform: rotate(180deg);
}

.truncate-tags-display.truncated:not(.show-all) .tt-down .less {
    display: none;
}

.truncate-tags-display.truncated .tt-down {
    padding: 0.75rem 0;
    flex: 1 0 auto;
}

.mfsResult .title {
    font-size: 1.3333333333333333333333333333333rem;
    margin-bottom: 1.625rem;
}

.mfsResult .detail {
    flex-grow: 1;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.mfsResult .detail .cont {
    display: none;
}

.mfsResult .detail .truncate-tags-display {
    width: 100%;
}

.mainArea .mfsResult .mybtn,
.mainArea .more-info {
    text-transform: uppercase;
    text-align: left;
    margin: 0;
}

.truncate-tags-display .mybtn.tt-down {
    flex: 0 0 auto;
    margin-left: auto;
}

.mainArea .mfsResult .mybtn:not(.submitbtn2) a,
.mainArea .more-info a,
.truncate-tags-display .mybtn.tt-down a,
a.clear-all {
    position: relative;
    display: block;
    font-size: 1rem;
    font-weight: normal;
    text-align: left;
    min-width: 0;
    padding: 0;
    padding-right: 2rem;
}

.mainArea .mfsResult .mybtn:not(.submitbtn2) a:after,
.mainArea .more-info a:after,
.truncate-tags-display .mybtn.tt-down a:after,
a.clear-all:after {
    content: "";
    position: absolute;
    right: 0;
    top: -2px;
    width: 1.5rem;
    height: 1.5rem;
    background-image: url(../images/icon/icon_arrow24_horizontal.svg);
    transition: transform 0.4s ease-in-out;
    transform: translateX(0);
}

.mainArea .mfsResult .mybtn.tt-up a:hover:after,
.mainArea .mfsResult .mybtn.tt-up a:hover:after,
.mainArea .more-info a:hover:after,
.mainArea .more-info a:focus:after {
    transform: translateX(0.5rem);
}

.mainArea .truncate-tags-display .mybtn.tt-down a:after {
    background-image: url(../images/icon/icon_arrow24.svg);
    top: -0.25rem;
    transition: all .3s;
    top: 50%;
    translate: 0 -50%;
}

a.clear-all:after {
    background-image: url(../images/icon/icon_clear_all.svg);
    top: 50%;
    translate: 0 -50%;
}

.mfsResult .page_control {
    font-family: IBMPlexMono;
    margin: 1.875rem 0;
}

.mfsResult .page_control,
.mfsResult .page_control a {
    color: #757575;
}

.mfsResult .page_control .active,
.mfsResult .page_control .active a {
    color: #000;
}

.mfsResult .page_control>.myflex {
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}

.mfsResult .page_control>.myflex>div {
    padding: 0 0.375rem;
}

.mfsResult .page_control>.myflex>div a {
    position: relative;
    padding: 0.625rem 0.625rem;
    text-decoration: none;
    display: block;
}

.mfsResult .page_control>.myflex>div a:hover,
.mfsResult .page_control>.myflex>div a:focus {
    text-decoration: none;
    color: #444;
}

.mfsResult .page_control>.myflex .next,
.mfsResult .page_control>.myflex .prev {
    font-size: .8889rem;
    margin: 0 1.25rem;
}

.mfsResult .page_control>.myflex .pagenum a:before {
    content: "";
    position: absolute;
    background: #bdbdbd;
    height: 1px;
    bottom: 3.5px;
    left: 0;
    right: 0;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

.mfsResult .page_control>.myflex .pagenum.active a:before {
    background: #000;
    bottom: 0;
    height: 0.5rem;
}

.mfsResult .page_control>.myflex .pagenum a:focus:before,
.mfsResult .page_control>.myflex .pagenum a:hover:before {
    background: #444;
}

.mfsResult .order {
    display: none;
    min-width: 3.125rem;
    padding-right: 0.625rem;
    padding-top: 0.625rem;
}

.displayList .mfsResult .data-list {
    gap: 0;
}

.displayList .mfsResult .mypage_content .border {
    padding: 2rem 0;
    width: 100%;
    border-bottom: 1px solid #e0e0e0 !important;
    flex-direction: row;
}

.displayList .mfsResult .mypage_content .order {
    display: block;
}

.displayList .mfsResult .mypage_content .cover {
    -webkit-order: 2;
    -ms-flex-order: 2;
    order: 2;
    width: 333px;
    max-width: 100%;
    flex-shrink: 0;
}

.displayList .mfsResult .mypage_content .detail {
    -webkit-order: 1;
    -ms-flex-order: 1;
    order: 1;
    padding-right: 1.25rem;
}

.displayList .mfsResult .mypage_content .detail .type.empty {
    display: none;
}

.displayList .mfsResult .mypage_content .detail .title {
    margin-top: 0;
    margin-bottom: 15px;
}

.displayList .mfsResult .mypage_content .detail .cont {
    position: relative;
    display: block;
    margin-bottom: 42px;
    padding-left: 2rem;
}

.displayList .mfsResult .mypage_content .detail .cont:before {
    content: "";
    position: absolute;
    left: 0;
    width: 1.5rem;
    height: 1.5rem;
    background-image: url(../images/icon/icon_lib_1.svg);
}

.displayList .mainArea .mfsResult .mybtn {
    margin-bottom: 0.625rem;
}

/* location list ends */

/*===========*/
.mainArea .headingWith {
    margin-bottom: 3.125rem;
}

.mainArea .headingWith h1 {
    margin-bottom: 0;
}

.mainArea .headingWith p {
    margin-top: 1rem;
}

.mainArea .headingWith a.mi_location {
    display: inline-block;
    line-height: 1.5rem;
    padding-right: 1.75rem;
}

.myDocument {
    margin-bottom: 3.75rem;
}

.myDocumentMenu {
    position: relative;
    min-width: 25%;
    width: 25%;
    padding-right: 3.75rem;
    z-index: 10;
}

.mainArea .myDocumentMenu .mybtn.mybtnBk {
    margin: 0;
    margin-bottom: 1.25rem;
}

.mainArea .myDocumentMenu .mybtn.mybtnBk a {
    min-width: 0;
    padding-left: 56px;
    padding-right: 1.5rem;
}

.mainArea .myDocumentMenu .mybtn.mybtn1.mybtnBk a:before {
    top: 50%;
    left: 1.5rem;
    right: auto;
    -webkit-transform: translate(0, -50%) rotate(180deg);
    -ms-transform: translate(0, -50%) rotate(180deg);
    transform: translate(0, -50%) rotate(180deg);
}

.myDocumentContent {
    padding-right: 3.75rem;
    -webkit-flex: 1 1 auto;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    max-width: 75%;
}

.myDocumentContent a.my_pdf {
    position: relative;
    padding-right: 100px;
    min-width: 200px;
    max-width: 100%;
    display: inline-block;
    margin-bottom: 0.625rem;
}

.myDocumentContent .iconPdf {
    position: absolute;
    right: 0;
    font-size: 1rem;
}

.mDocSlider {
    padding: 0 3.75rem;
    margin-left: -3.75rem;
    max-width: 1280px;
    padding-bottom: 3.125rem;
}

.mDocMainSlider {
    margin-bottom: 1.5rem;
}

.mDocMainSlider .flex-direction-nav a,
.mDocMainSlider .flexslider .flex-direction-nav .flex-prev,
.mDocMainSlider .flexslider:hover .flex-direction-nav a {
    position: absolute;
    top: 50%;
    left: -3.125rem;
    right: auto;
    width: 22px;
    height: 22px;
    margin: 0;
    opacity: 1;
    -webkit-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    transform: translate(0, -50%);
}

.mDocMainSlider .flex-direction-nav a.flex-next,
.mDocMainSlider .flexslider:hover .flex-direction-nav a.flex-next {
    left: auto;
    right: -3.125rem;
}

.mDocMainSlider .flex-direction-nav a:before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    font-size: 1rem;
    background-image: url(../images/icon/icon_arrow.svg);
    background-size: contain;
}

.mDocMainSlider .flex-direction-nav a.flex-next:before {
    content: "";
    -webkit-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    transform: rotate(180deg);
}

.bodyArea .mDocMainSlider .flexslider .flex-control-paging {
    position: absolute;
    padding: 1.5rem 0;
    top: calc(100% + 123px + 1.5rem);
}

.mDocThumbSlider {}

.mDocThumbSlider .cover {
    opacity: .5;
    cursor: pointer;
    transition: all 0.25s;
}

.mDocThumbSlider .cover:hover,
.mDocThumbSlider .flex-active-slide .cover {
    opacity: 1;
}

.mDocDetail {
    padding: 1.5rem 5px;
    line-height: 1.5555555555555555555555555555556em;
}

.mDocDetail ul,
.mDocDetail ol {
    padding-left: 1.5rem;
}

.mDocTitleList>div {
    padding: 1.5rem 0;
    border-bottom: 1px solid #BDBDBD;
}

.mDocTitleList .title {
    min-width: 30%;
    width: 30%;
    padding-right: 1.25rem;
    margin-bottom: 1.25rem;
    font-size: 1.1111111111111111111111111111111rem;
    font-weight: bold;
}

.mDocTitleList .cont {
    -webkit-flex: 1 1 auto;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    max-width: 100%;
}

/* add margin between li*/
.mDocDetail .cont>ul>li:not(:last-child) {
    margin-bottom: 1rem;
}

.mainArea ul.myPointList {
    margin-bottom: 1.625rem;
}

.myPointList li {
    padding: 0.875rem 0;
}

.w-100 {
    width: 100%;
}

.myFileUploader {
    max-width: 100%;
    flex: 1 0 auto;
}

.myFileUploader input[type=file] {
    padding: var(--inputpadding);
}

.myFileUploader>.title>label {
    color: #111;
    padding-top: var(--inputpadding);
    padding-left: var(--inputpadding);
}

.myFileUploader>div:not(.title) {
    margin-bottom: 1.25rem;
}

.myFileUploader .descript {
    width: 250px;
    max-width: 100%;
}

.myform-input-area .descript {
    padding-left: var(--inputpadding);
}

.full>.descript {
    max-width: 100%;
    padding: 0.5rem 1rem;
}

.myCaptcha {
    margin: 2.5rem 0;
}

.myCaptcha>div:first-of-type {
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: auto 1rem minmax(auto, 1fr);
    grid-template-columns: auto minmax(auto, 1fr);
    gap: 1rem;
}

.myCaptcha img {
    width: auto;
}

.myCaptcha img#captcha_image {
    width: auto;
    margin: auto 0;
    -ms-grid-row: 1;
    grid-row-start: 1;
    -ms-grid-row-span: 2;
    grid-row-end: 3;
}

.myCaptcha .captcha-control {
    margin-right: auto;
}

.myCaptcha #captcha_image_audio_controls {
    margin-top: 0.5rem;
}

.myCaptcha .captcha-control.refresh {
    margin-bottom: 0.5rem;
}

.subheading {
    margin-bottom: 1.625rem;
}

.myIndexList {
    margin: 0 -3.75rem;
}

.myIndexList .border {
    padding: 0 3.75rem;
    margin-bottom: 4.5rem;
    width: 50%;
    max-width: 50%;
}

.myIndexList .title {
    position: relative;
    padding: 1.125rem 0;
    padding-left: 4.75rem;
    margin: 0;
}

.myIndexList .title:before {
    content: "";
    position: absolute;
    left: 0;
    top: 0.5rem;
    width: 3.75rem;
    height: 3.75rem;
}

.myIndexList .cont ul,
.myIndexList .cont ul li {
    list-style-type: none;
    display: block;
}

.myIndexList .cont ul {
    border-top: 1px solid #bdbdbd;
    margin: 0;
    padding: 0;
}

.myIndexList .cont ul li {
    border-bottom: 1px solid #bdbdbd;
}

.myIndexList .cont ul li a {
    display: block;
    font-size: 1.25rem;
    padding: 1.125rem 1.25rem;
    color: #4d4d4d;
    text-transform: uppercase;
    font-weight: bold;
    text-decoration: none;
    position: relative;
}

.myIndexList .cont ul li a:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    bottom: -1px;
    background: #3058cc;
    width: 0;
    z-index: -1;
}

.myIndexList .cont ul li a:hover,
.myIndexList .cont ul li a:focus {
    color: white;
    -webkit-transition: all .25s ease-out .25s;
    -ms-transition: all .25s ease-out .25s;
    transition: all .25s ease-out .25s;
}

.myIndexList .cont ul li a:hover:before,
.myIndexList .cont ul li a:focus:before {
    width: calc(100% + 1px);
    -webkit-transition: all .25s ease-out .25s;
    -ms-transition: all .25s ease-out .25s;
    transition: all .25s ease-out .25s;
}


.mySearch2 {
    position: relative;
    flex: 1 1 auto;
    width: 400px;
    min-width: 175px;
    max-width: 100%;
}

.mySearch2:after {
    content: "";
    position: absolute;
    width: 2rem;
    height: 2rem;
    left: 2px;
    /*
        right:5px;*/
    top: 50%;
    background-repeat: no-repeat;
    background-image: url(../images/icon/icon_search.svg);
    background-position: center center;
    background-size: 100% auto;
    -webkit-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    transform: translate(0, -50%);
}

.mySearch2 input[type="text"] {
    width: 100%;
    max-width: 100%;
    padding: 1.25rem;
    line-height: 1.25rem;
    padding-left: 45px;
    border: 0;
    border-bottom: 2px solid #000;
}

.mySearch2 label {
    margin-bottom: 0;
    width: 100%;
}

.mySearch2 .mySearch2ListSkin {
    position: absolute;
    top: 100%;
    width: 100%;
    display: none;
    z-index: 10;
    max-height: 50vh;
    overflow-y: auto;
    box-shadow: 0 0 1.25rem rgb(0 0 0 / 5%);
}

.mySearch2.active .mySearch2ListSkin {
    display: block;
}

.mySearch2ListSkin>* {
    position: relative;
}

.mySearch2 .mySearch2ListSkin a {
    display: block;
    padding: 15px;
    padding-left: 45px;
    background-color: #fff;
    border: 1px solid #ebebeb;
    border-top: 0;
    text-decoration: none;
}

.mySearch2 .mySearch2ListSkin a:focus,
.mySearch2 .mySearch2ListSkin a:hover,
.mySearch2 .mySearch2ListSkin a.active {
    background-color: #cdcdcd;
    outline: none;
}

.mySearch2 .mySearch2ListSkin a:focus::before,
.mySearch2 .mySearch2ListSkin a.active::before {
    content: "";
    position: absolute;
    height: 100%;
    width: 4px;
    background: #3058cc;
    top: 0;
    left: 0;
}

.h1Area {
    margin-bottom: 3.75rem;
}

.h1Area * {
    max-width: 100%;
}

.h1Area .myflex {
    gap: 1rem;
}

.h1Area h1 {
    margin: 0;
}

.myCount {
    text-align: right;
}

.myTagFilter {
    margin-bottom: 3.75rem;
    border-top: 1px solid #d3d3d3;
    border-bottom: 1px solid #d3d3d3;
}

.myTagFilter.multi-line:not(.last-line) {
    margin: 0;
    border-bottom: 0;
}

.myTagFilter .title {
    text-transform: uppercase;
    font-size: 1rem;
    padding: 1.25rem 2rem;
    min-width: 150px;
    width: 12%;
}

.myTagFilter .myfArea {
    border-left: 1px solid #d3d3d3;
    width: 88%;
}

.myTagFilter .myfArea :not(.tags):not(.mybtn)>a {
    position: relative;
    display: inline-block;
    font-size: 1rem;
    padding: 0.6rem 2rem 0.6rem 1.4rem;
}

.myTagFilter .myfArea> :not(.tags):not(.mybtn)>a:after {
    content: "";
    position: absolute;
    right: 0.375rem;
    top: 50%;
    width: 1.125rem;
    height: 1.125rem;
    background-image: url(../images/icon/icon_tag_close.svg);
    -webkit-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    transform: translate(0, -50%);
}

.icon-pdf a {
    position: relative;
    display: block;
    font-size: 1rem;
    padding-left: 2.5rem;
}

.icon-pdf a:before {
    content: "";
    position: absolute;
    left: 0;
    width: 1.5rem;
    height: 1.5rem;
    background-image: url(../images/icon/icon_pdf.svg);
}

.pointList {
    padding: 0.625rem 1.5rem;
    font-size: 1.3333rem;
    font-weight: bold;
}

.pointList>ul {
    margin: 0;
    padding: 0;
}

.pointList>ul>li {
    padding-top: 1.25rem;
    padding-bottom: 1.25rem;
    padding-right: 100px;
    position: relative;
}

.areaPL .type {
    display: inline-block;
    font-size: 1rem;
    color: #fff;
    background-color: #000;
    padding: 0.25rem 0.75rem;
    font-family: IBMPlexMono;
    font-weight: bold;
}

.areaBgC {
    position: relative;
    padding: 3.75rem 0;
    z-index: 10;
}

.areaBgC:after {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 50%;
    width: 100vw;
    background-color: #4676E2;
    background-image: linear-gradient(270deg, #4676E2 0%, #1FA1D9 85%, #1DADD8 100%);
    -webkit-transform: translate(-50%, 0);
    -ms-transform: translate(-50%, 0);
    transform: translate(-50%, 0);
    opacity: .75;
    z-index: -1;
}

.areaCont {
    padding: 5rem 0;
}

.areaTC {
    position: relative;
    padding: 3.75rem 0;
    z-index: 10;
}

.areaTC:after {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 50%;
    width: 100vw;
    background-color: #eee;
    -webkit-transform: translate(-50%, 0);
    -ms-transform: translate(-50%, 0);
    transform: translate(-50%, 0);
    z-index: -1;
}

.iconList .border {
    width: 520px;
    max-width: 100%;
    padding: 3.125rem;
}

.iconList .cover {
    width: 120px;
    margin-bottom: 1rem;
}

.iconList .title {
    margin-bottom: 1.5rem;
}

.myContact .border>div {
    padding: 12px 0;
    padding-left: 35px;
    position: relative;
}

.myContact .border>div:before {
    content: "";
    position: absolute;
    left: 0;
    top: 0.875rem;
    width: 1.25rem;
    height: 1.25rem;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
}

.myContact .myflex .tit {
    width: 120px;
    max-width: 100%;
}

.myContact .tel:before {
    background-image: url(../images/icon/icon_tel.svg);
}

.myContact .mail:before {
    background-image: url(../images/icon/icon_mail.svg);
}

.myContact .fax:before {
    background-image: url(../images/icon/icon_print.svg);
}

.myContact .loc:before {
    background-image: url(../images/icon/icon_location.svg);
}

.myContact .time:before {
    background-image: url(../images/icon/icon_time.svg);
}

.myform.noMargin {
    margin-bottom: 0;
}

.areaHL.areaMCI .highlightsList {
    padding: 1.25rem 0;
    position: relative;
    margin-bottom: 100px;
}

.areaHL.areaMCI .highlightsList .data {
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
}

.areaHL.areaMCI .highlightsList>.data {
    /*
        min-height: 740px;*/
}

.areaHL.areaMCI .highlightsList .data>.scroll-content {
    padding-bottom: 2.5rem;
}

.areaHL.areaMCI .highlightsList .data>div:not(.scroll-content):not(.scroll-element) {
    width: 420px;
    max-width: 100%;
    -webkit-flex: 0 1 auto;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}

.areaHL.areaMCI .highlightsList .data>div:not(.scroll-content):not(.scroll-element):nth-child(1) {
    margin-left: -1.875rem;
}

.areaHL.areaMCI .highlightsList .data .border {
    padding-left: 1.875rem;
    padding-right: 1.875rem;
    color: #000;
}

.areaHL.areaMCI .highlightsList .border>div {
    margin: 1.25rem 0;
}

.areaHL.areaMCI .highlightsList .border .cover {
    margin-top: 0;
    margin-bottom: 0;
    width: 22.5rem;
    aspect-ratio: 16/9;
}

.areaHL.areaMCI .highlightsList .border .cover img {
    display: block;
    width: 100%;
    max-height: 100%;
    object-fit: cover;
    object-position: center;
}

.areaHL.areaMCI .highlightsList .border .tag {
    /*
        padding:1rem 0;*/
    padding-top: 0.5rem;
    font-size: 1rem;
}

.areaHL.areaMCI .highlightsList .border .type {
    margin-right: 0.625rem;
    padding: 0.25rem 12px;
    border: 1px solid #000;
}

.areaHL.areaMCI .highlightsList .border .date {
    position: relative;
    padding-left: 1.5rem;
}

.areaHL.areaMCI .highlightsList .border .date:before {
    content: "";
    position: absolute;
    left: 0;
    width: 1rem;
    height: 1rem;
    background-image: url(../images/icon/icon_time.svg);
}

.areaHL.areaMCI .highlightsList .title {
    font-size: 1.3333rem;
    font-weight: bold;
    color: #212121;
    position: relative;

}

.areaHL.areaMCI .highlightsList .title a:after {
    content: "";
    display: inline-block;
    width: 1.25rem;
    height: 1.25rem;
    margin-left: 1rem;
    background-image: url(../images/icon/icon_newwindow.svg);
    background-repeat: no-repeat;
    background-size: 100% auto;
    background-position: center center;
}

.areaHL.areaMCI .highlightsList .content {
    color: #424242;
}

.myGreyArea {
    padding: 3rem;
    background-color: #eee;
    text-align: center;
    margin: auto;
    margin-bottom: 34px;
}

.myDLTool {
    margin-bottom: 2.5rem;
}

.myDLTool>div {
    margin-right: 2.5rem;
    text-transform: uppercase;
}

.myIcon a,
.myIcon.mi_self,
span.myIcon {
    position: relative;
    display: block;
}

.myIcon:not(.myIconR) a,
.myIcon:not(.myIconR).mi_self {
    padding-left: 2.5rem;
}

.myIcon.myIconR a,
.myIcon.myIconR.mi_self {
    padding-right: 2.5rem;
}

span.myIcon,
span.myIcon.mi_self {
    margin: 0.625rem 0;
}

.myIcon a:before,
.myIcon.mi_self:before {
    content: "";
    position: absolute;
    width: 1.5rem;
    height: 1.5rem;
    background-size: contain;
}

.myIcon:not(.myIconR) a:before,
.myIcon:not(.myIconR).mi_self:before {
    left: 0;
}

.myIcon.myIconR a:before,
.myIcon.myIconR.mi_self:before {
    right: 0;
}

.myIcon.mi_pdf a:before,
.myIcon.mi_pdf.mi_self:before {
    background-image: url(../images/icon/icon_pdf.svg);
}

.myIcon.mi_newWin a:before,
.myIcon.mi_newWin.mi_self:before {
    background-image: url(../images/icon/icon_newwindow.svg);
}

.myIcon.mi_tel a:before,
.myIcon.mi_tel.mi_self:before {
    background-image: url(../images/icon/icon_tel.svg);
}

.myIcon.mi_print a:before,
.myIcon.mi_print.mi_self:before {
    background-image: url(../images/icon/icon_print.svg);
}

.myIcon.mi_mail a:before,
.myIcon.mi_mail.mi_self:before {
    background-image: url(../images/icon/icon_mail.svg);
}

.myIcon.mi_location a:before,
.myIcon.mi_location.mi_self:before {
    background-image: url(../images/icon/icon_location.svg);
}

.myIcon.mi_iL,
.myIcon.mi_iL.mi_self,
span.myIconmi_iL {
    margin: 0;
    display: inline-block;
}

.myIcon.mi_iL:not(.myIconRight) {
    padding-left: 0;
}

.myIcon.mi_iL.myIconRight {
    padding-right: 0
}

.myIcon:not(.myIconR).mi_small a,
.myIcon:not(.myIconR).mi_self.mi_small {
    padding-left: 1.75rem;
}

.myIcon.myIconR.mi_small a,
.myIcon.myIconR.mi_self.mi_small {
    padding-right: 1.75rem;
    1.25rem
}

.myIcon.mi_small a:before,
.myIcon.mi_self.mi_small:before {
    top: 5px;
    right: 0.5rem;
    width: 0.875rem;
    height: 0.875rem;
}

.myStyleTextArea {
    padding: 3.75rem 0;
}

.myStyleTextArea .title {
    font-size: 1.7777777777777777777777777777778rem;
    font-weight: bold;
    margin-bottom: 2.5rem;
    line-height: normal;
}

.myStyleTextArea .content {
    font-size: 1.7777777777777777777777777777778rem;
    line-height: normal;
}

.myIconList {}

.myIconList>div {
    margin-top: 5px;
    margin-bottom: 1.875rem;
    margin-right: 55px;
}

.myCEList {
    margin-bottom: 2.5rem;
}

.myCEList .border {
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

.myCEList .title {
    margin: 0;
}

.myCEList .title a {
    position: relative;
    display: block;
    padding: 1.5rem 0;
    padding-right: 44px;
    border-bottom: 2px solid #dbdbdb
}

.myCEList .border:not(.active) .moreDetail {
    display: none;
}

.myCEList .border .title a:before {
    content: "";
    position: absolute;
    right: 0.625rem;
    width: 1.5rem;
    height: 1.5rem;
    background-image: url(../images/icon/icon_cross.svg);
    -webkit-transform: rotate(135deg);
    -ms-transform: rotate(135deg);
    transform: rotate(135deg);
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

.myCEList .border.active .title a:before {
    -webkit-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    transform: rotate(0deg);
}

.myCEList .border .content {
    padding: 42px 0;
}

:target,
:focus {
    scroll-margin-top: 84px;
    scroll-snap-margin-top: 84px;
    /* for safari */
}

.headerMenuBigWrapper,
.searchToolBigWrapper,
.langToolBigWrapper {
    color: #000;
    transition: transform 0.5s;
    background-color: #4676E2;
    background-image: linear-gradient(0deg, #4676E2 0%, #1FA1D9 85%, #1DADD8 100%);
    width: 100%;
    height: 100%;
    transform: translateX(105%);
    position: fixed;
    z-index: 8000;
    top: 0;
    right: 0;
    max-width: 34rem;
}

.ieVersion .headerMenuBigWrapper,
.ieVersion .searchToolBigWrapper,
.ieVersion .langToolBigWrapper {
    transition: none;
}

.headerMenu_active .headerMenuBigWrapper,
.searchMenu_active .searchToolBigWrapper,
.langMenu_active .langToolBigWrapper {
    /*opacity: 1;
      visibility: visible !important;
      transform: translateY(97px);*/
    /*height: calc(100vh - 68px);*/
    transform: translateX(0);
    -webkit-box-shadow: 0 0 0.25rem 2px rgba(40 40 40 / 20%);
    -moz-box-shadow: 0 0 0.25rem 2px rgba(40, 40, 40, .2);
    -ms-box-shadow: 0 0 0.25rem 2px rgba(40, 40, 40, .2);
    box-shadow: 0 0 0.25rem 2px rgba(40 40 40 / 20%);
}

.searchToolBigWrapper .mobSearch {
    display: none;
}

.cross_btn {
    margin-left: auto;
}

.cross_btn a {
    color: #000;
    font-size: 1.3rem;
    text-transform: uppercase;
    display: flex;
    align-items: center;
}

.cross_btn a>span:first-child {
    display: inline-block;
    padding-right: 0.75rem;
}

.searchToolBigWrapper .searchbtnwrap {
    display: none;
}

.mobileTool button,
.mobilenav .mobSearch a,
.mobilenav .navbar-my-language,
.cross_btn a>span:last-child {
    position: relative;
    min-width: 1.25rem;
    min-height: 1.25rem;
    display: inline-block;
    font-size: 0;
}

.headerMenu_active .mobileTool img,
.searchMenu_active .mobilenav .searchbtnwrap img,
.langMenu_active .mobilenav .navbar-my-language img {
    display: none;
}

/*.headerMenu_active .mobileTool button::before,
    .headerMenu_active .mobileTool button::after,
    .searchMenu_active .mobilenav .searchbtnwrap a::before,
    .searchMenu_active .mobilenav .searchbtnwrap a::after,
    .langMenu_active .mobilenav .navbar-my-language::before,
    .langMenu_active .mobilenav .navbar-my-language::after,*/
.cross_btn a>span:last-child:before,
.cross_btn a>span:last-child:after {
    content: '';
    display: block;
    position: absolute;
    top: 50%;
    width: 1.625rem;
    height: 2px;
    background-color: #000;
}

/*.headerMenu_active .mobileTool button::before,
    .searchMenu_active .mobilenav .searchbtnwrap a::before,
    .langMenu_active .mobilenav .navbar-my-language::before,*/
.cross_btn a>span:last-child:before {
    transform: translate(0, -50%) rotate(45deg);
    margin-left: -2px;
}

/*.headerMenu_active .mobileTool button::after,
    .searchMenu_active .mobilenav .searchbtnwrap a::after,
    .langMenu_active .mobilenav .navbar-my-language::after,*/
.cross_btn a>span:last-child:after {
    transform: translate(0, -50%) rotate(-45deg);
    margin-left: -2px;
}

.cross-btn:hover {
    opacity: 1;
}


.menu_search {
    padding-bottom: 1rem;
    display: none;
}

.headerMenuBigWrapper .mobSearch {
    display: none;
}

.searchTool form input::-webkit-input-placeholder,
.searchTool form input::placeholder,
.searchTool form input::placeholder {
    /* Edge */
    color: #000;
}

.mobSearchArea {
    width: 100%;
    border-bottom: 1px solid #000;
    display: flex;
    align-items: center;
}

.mobSearchArea .inputArea {
    width: 100%;
}

.mobSearchArea input {
    background-color: transparent;
    color: #000;
    border: 0;
    font-size: 1.125rem;
    padding: 1rem 0.75rem;
    width: 100%;
    display: flex;
    align-items: center;
}

.searchToolBigWrapper .searchTool input {
    border-top: 0;
    border-left: 0;
    border-right: 0;

    padding-bottom: 0.5rem;
    /*width: calc(100% - 1.25rem);*/
}

.searchToolBigWrapper .searchTool {
    height: 100%;
    padding: 1.8181rem;
}

.menu_search .searchLabel {
    font-size: 0;
    width: 0;
    height: 0;
}

.searchToolBigWrapper .searchTool .searchLabel {
    font-size: 1.5rem;
    margin-bottom: 1.25rem;
    display: block;
    width: 100%;
    height: auto;
}

.searchToolBigWrapper .searchTool form {
    display: block;
}

.headerMenu_active,
.searchMenu_active,
.langMenu_active {
    overflow: hidden;
}

.headerMenuBigWrapper .row,
.searchToolBigWrapper .row {
    padding-left: 1.818181rem;
    padding-right: 1.818181rem;
    padding-top: 1.5rem;
    padding-bottom: 1.5rem;
    justify-content: space-between;
    align-items: flex-end;
    display: flex;
}

.headerMenuBigWrapper .langmenu {
    display: none;
    padding-left: 0;
    margin-bottom: 0;
}

.headerMenuBigWrapper .langmenu a {
    font-size: 1.4rem;
    font-weight: bold;
}

.headerMenuBigWrapper .menuwrapper {
    overflow-y: auto;
    height: calc(100% - 5.75rem);
}

.headerMenuBigWrapper .menu_section {
    padding-top: 2rem;
}

.headerMenuBigWrapper .contactus {
    border-bottom: 1px solid rgba(0, 0, 0, .25);
}

.headerMenuBigWrapper .contactus a {
    color: #000;
}

.headerMenuBigWrapper .contactus>div:not(:first-child) {
    font-size: 1.125rem;
}

.headerMenuBigWrapper .headerMenu,
.headerMenuBigWrapper .menu_search {
    margin-left: 1.818181rem;
    margin-right: 1.818181rem;
}

.headerMenuBigWrapper .headerMenu ul.tMenu>li:not(.firstLi):not(.important_menu) {
    float: none;
    width: 100%;
    display: block;
    border-bottom: 1px solid rgba(0, 0, 0, .25);
}

.headerMenuBigWrapper .tMenu {
    list-style-type: none;
    padding-left: 0;
    margin-bottom: 0;
    border-top: 1px solid rgba(0, 0, 0, .25);
}

.headerMenuBigWrapper .headerMenu ul.tMenu>li.firstLi,
.headerMenuBigWrapper .headerMenu ul.tMenu>li.important_menu {
    display: none;
}

.headerMenuBigWrapper .headerMenu ul.tMenu>li>a {
    font-size: 1.9rem;
    font-weight: bold;
    padding-top: 1.25rem;
    padding-bottom: 1.25rem;
    padding-right: 2.8rem;
    text-align: left;
    text-transform: uppercase;
    text-decoration: none;
    position: relative;
    color: #000;
    display: block;
}

.headerMenuBigWrapper .headerMenu ul.tMenu>li>a.excLi:after {
    content: "";
    position: absolute;
    right: 0;
    /*width: 2.25rem;
        height: 1.75rem;*/
    width: 1.5rem;
    height: 2rem;
    background-image: url(../images/icon/icon_arrow_down.svg);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

.headerMenuBigWrapper .headerMenu ul.tMenu>li.open>a.excLi:after {
    transform: rotate(-180deg) translateY(50%);
}

.headerMenuBigWrapper .headerMenu div.extmenu {
    position: static;
    max-height: 0;
    transition: max-height 0.5s;
    overflow: hidden;
    display: block;
}

.headerMenuBigWrapper .headerMenu .open>.extmenu {
    max-height: 3000px !important;
}

.headerMenuBigWrapper .headerMenu ul.menuLv1 {
    padding-left: 0;
}

.headerMenuBigWrapper .headerMenu ul.menuLv1>li>a {
    font-size: 1.5rem;
    padding-top: 1.25rem;
    padding-bottom: 1.25rem;
    padding-left: 1.5rem;
    padding-right: 1rem;
    text-align: left;
    text-decoration: none;
    color: #000;
    display: block;
}

.menu_section ul {
    padding-left: 0;
    margin-left: 0;
    margin-bottom: 0;
}

.menu_section li {
    list-style: none;
}

.menu_section:last-child {
    padding-bottom: 3rem;
}

.contactus a {
    color: #424242;
}

.contactus .tit {}

.contactus .myflex {
    display: flex;
    flex-wrap: nowrap;
}

.contactus .myflex .tit {
    width: 7.5rem;
    max-width: 100%;
}

.contactus>div:not(:first-child) {
    position: relative;
    padding-top: 0.75rem;
    padding-bottom: 0.75rem;
    padding-left: 2.25rem;
}

.contactus .myflex:last-child {
    padding-top: 1rem;
}

.contactus>div:before {
    content: "";
    position: absolute;
    left: 0;
    top: 1rem;
    width: 1.25rem;
    height: 1.25rem;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
}

.contactus .tel:before {
    background-image: url(../images/icon/icon_tel.svg);
}

.contactus .mail:before {
    background-image: url(../images/icon/icon_mail.svg);
}

.contactus .fax:before {
    background-image: url(../images/icon/icon_print.svg);
}

.contactus .loc:before {
    background-image: url(../images/icon/icon_location.svg);
    width: 1.3rem;
    height: 1.8rem;
}

.contactus .time:before {
    background-image: url(../images/icon/icon_time.svg);
}

.contactus .mail>div:not(:last-child) {
    margin-bottom: 1rem;
}

.js_scroll_blanket {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 7500;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.4);
    cursor: pointer;
    font-size: 0;
}

.headerMenu_active .js_scroll_blanket {
    display: block;
}

.searchMenu_active .js_scroll_blanket {
    display: block;
}

.langMenu_active .js_scroll_blanket {
    display: block;
}

.searchToolDesktop_active .js_scroll_blanket {
    display: block;
}

.ctitem {
    position: relative;
    padding-left: 1.4rem;
    padding-right: 1.4rem;
    display: flex;
    align-items: center;
    /* flex-wrap: wrap; */
}

.ctitem::after {
    content: '';
    width: 1px;
    height: 1.5rem;
    background-color: #b7b7b7;
    display: block;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 0;
}

.ctitem_last:after {
    width: 0;
    height: 0;
}

.ctitem img {
    min-width: 1.5rem;
}

.mainAreaBC {
    display: none;
}

.border {
    border: 0 !important;
}

.mDocMainSlider {
    aspect-ratio: 16 / 9;
}

#flexslider-mdms {
    height: 100%;
}

#flexslider-mdms .slides {
    height: 100%;
}

#flexslider-mdms .flex-active-slide {
    height: 100%;
}

#flexslider-mdms.flexslider .slides .cover {
    position: relative;
    overflow: hidden;
    z-index: 10;
    background-image: linear-gradient(to right, #c4d8ff, transparent, #c4d8ff);
    background-color: #fff;
    height: 100%;
}

#flexslider-mdts.flexslider .slides .cover::before,
#flexslider-mdms.flexslider .slides .cover:before {
    content: "";
    position: absolute;
    background-image: var(--bg);
    left: 50%;
    top: 50%;
    width: 160%;
    height: 160%;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    z-index: -1;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    -webkit-filter: blur(1rem);
    -ms-filter: blur(1rem);
    filter: blur(1rem);
    opacity: 0.6;
}

#flexslider-mdts.flexslider .slides .cover {
    overflow: hidden;

    position: relative;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

/*
    #flexslider-mdts.flexslider .slides .cover::before {
        content: "";
        background-image: var(--bg);
        position: absolute;
        left: 50%;
        top: 50%;
        width: 160%;
        height: 160%;
        background-position: center center;
        background-repeat: no-repeat;
        background-size: cover;
        -webkit-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
        z-index: -1;
        -webkit-filter: blur(1rem);
        -ms-filter: blur(1rem);
        filter: blur(1rem);
        opacity: 0.6;
    }
    */
#flexslider-mdms.flexslider .slides .cover img {
    /*max-height: 520px;
        width: auto;*/
    width: 100%;
    max-width: 100%;
    margin: auto;
    height: 100%;
    object-fit: contain;
}


#flexslider-mdts.flexslider .slides .cover img {
    max-height: 137px;
    width: auto;
    display: block;
    margin-left: auto;
    margin-right: auto;
}


.faq_section h2 {
    margin-bottom: 1rem;
}

.faq_section .expand_list {
    margin-bottom: 0;
}

.faq_section {
    margin-bottom: 3rem;
}

.book-cover {
    max-height: 400px;
}

.footerArea0 .flex-direction-nav a {
    overflow: visible;
}

.footerArea0 .flex-direction-nav a span {
    width: 0;
    height: 0;
    overflow: hidden;
    text-indent: -9999px;
    font-size: 0;
}

/* Custom select */
.custom-dropdown-selector {
    display: flex;
    flex-direction: column;
    position: relative;
    font-size: 1.25rem;
}

.custom-dropdown-selector .toggle {
    background: transparent;
    border: 0;
    display: block;
    padding: 1.125rem 3.5rem 1.125rem 1.5rem;
    background: #fff;
    border: 1px solid #ebebeb;
    border-radius: 2px;
    text-align: left;
}

.custom-dropdown-selector .toggle::after {
    content: "";
    position: absolute;
    top: 50%;
    right: 1.25rem;
    width: 1.5rem;
    height: 1.5rem;
    -webkit-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    transform: translate(0, -50%);
    background-image: url(../images/icon/icon_arrow24.svg);
    transition: all .3s ease-in-out;
}

.custom-dropdown-selector.active:after {
    -webkit-transform: translate(0, -50%) rotate(180deg);
    -ms-transform: translate(0, -50%) rotate(180deg);
    transform: translate(0, -50%) rotate(180deg);
}

.custom-dropdown-selector .options {
    display: none;
    list-style-type: none;
    position: absolute;
    top: calc(100% - 2px);
    z-index: 10;
    flex-direction: column;
    padding: 0;
    margin: 0;
    box-shadow: 0 0 1.25rem rgb(0 0 0 / 5%);
    background: #fff;
    border: 1px solid #ebebeb;
    border-radius: 2px;
    max-height: 50vh;
    min-width: 100%;
    width: max-content;
    max-width: 90vw;
    overflow-y: auto;
    overflow-x: hidden;
}

.custom-dropdown-selector.right .options {
    right: 0;
}

.custom-dropdown-selector.active .options {
    display: flex;
}

.custom-dropdown-selector:hover .options {
    z-index: 20;
}

.custom-dropdown-selector .options>* {
    padding: 1.125rem 1.5rem;
}

.custom-dropdown-selector .options>* {
    display: flex;
}

.custom-dropdown-selector .options>:not(:last-child) {
    border-bottom: 1px solid #f7f7f7;
}

.custom-dropdown-selector input[type="checkbox"] {
    margin-right: 1.25rem;
}

.custom-dropdown-selector label {
    margin: 0;
    flex: 1 1 auto;
}

.custom-dropdown-selector .cat_title {
    font-weight: bold;
}

/* Custom select ends */
/* Input text underline style */
.underline-style input:focus,
.underline-style textarea:focus {
    outline: none;
    border-bottom-color: transparent;
}

.underline-style input[type=text] {
    padding: 15px;
    border: 0;
    width: 100%;
    background-color: transparent;
    border-bottom: 1px solid rgba(12, 18, 28, .12);
}

.underline-style textarea {
    background: transparent;
    max-width: unset;
    width: 100%;
    border-bottom: 1px solid rgba(12, 18, 28, .12);
    border-radius: 0px;
    padding: 8px 0;
    resize: vertical;
}

.underline-style select {
    border: none;
    border-bottom: 1px solid rgba(12, 18, 28, .12);
    width: 100%;
    padding-bottom: 4px;
}

.underline-style select:focus {
    border-bottom-color: transparent;
    outline: none;
}

.underline-style {
    position: relative;
}

.underline-style::before,
.underline-style::after {
    content: "";
    position: absolute;
    bottom: 0;
    height: 2px;
    transition: all .2s cubic-bezier(.4, 0, .2, 1);
    width: 0;
}

.underline-style::before {
    left: 50%;
}

.underline-style::after {
    right: 50%;
}

.underline-style:focus-within::before,
.underline-style:focus-within::after {
    width: 50%;
    background-color: #2C4FBA;
}

/* Input text underline style ends */
/* landing page items */
.grid-container {
    --grid-layout-gap: 1rem;
    display: grid;
    grid-gap: var(--grid-layout-gap);
}

.grid-container.auto-fit {
    /* User input values. */
    --grid-column-count: 3;
    --grid-item--min-width: 250px;
    /* Calculated values. */
    --gap-count: calc(var(--grid-column-count) - 1);
    --total-gap-width: calc(var(--gap-count) * var(--grid-layout-gap));
    --grid-item--max-width: calc((100% - var(--total-gap-width)) / var(--grid-column-count) - 0.1px);
    /* -0.1px for firefox fix */
    grid-template-columns: repeat(auto-fit, minmax(max(var(--grid-item--min-width), var(--grid-item--max-width)), 1fr));
}

.grid-container.auto-fit>div {
    height: 100%;
}

/* landing page items ends */
/* popup modal */
#popupModal {
    z-index: 9001;
}

#popupModal+.modal-backdrop {
    z-index: 9000;
}

#popupModal .close a {
    display: block;
    position: relative;
    text-decoration: none;
    text-transform: uppercase;
    text-align: center;
    font-size: 1.5rem;
    font-weight: bold;
    padding: 1.125rem 1.5rem;
    padding-right: 3.5rem;
}

#popupModal .close a:before {
    content: "";
    position: absolute;
    top: 1.5rem;
    right: 1.5rem;
    width: 1.5rem;
    height: 1.5rem;
    background-image: url(../images/icon/icon_close.svg);
}

#popupModal .close:hover a {
    background-color: rgba(255, 255, 255, .8);
}

/* popup modal ends */

/* start by Andy */

@media only screen and (max-width: 600px) {
    body .myform .myform-input-area>div.half.full.spacer {
        display: block;
    }
}

@media screen and (max-width: 992px) {
    body .myform .myform-input-area>div.half.spacer {
        display: none;
    }
}

/* make the label won't overlap with textarea's input when scrolled */
.myform .floating-label>textarea {
    padding-top: 0;
    border-top: calc(var(--inputpadding) / 2 * 3) solid transparent;
}

/* align with the checkbox+ "I have read..." */
.myform-input-area ol {
    margin-left: 1.625rem;
    padding-left: 0;
}

.myform-input-area ol>li {
    padding-left: 1.625rem;
}

/* PERMIT AND FORMS */

@media only screen and (max-width: 992px) {

    /* permit and forms . enlarge font-size in mobile */
    body .mainContent .statistics-list table th {
        padding-top: 0;

    }

    body .statistics-list tbody td {
        border-bottom: 0;
        background-color: transparent;
    }

    body .statistics-list tbody tr {
        padding: 1em;
        display: flex;
        border-bottom: 1px solid #bdbdbd;
        flex-wrap: wrap;
        width: 100%;
    }

    body .statistics-list tbody tr:nth-child(even) {
        background-color: #eee;
    }

    body .statistics-list table,
    body .statistics-list thead,
    body .statistics-list thead tr,
    body .statistics-list tbody {
        display: block;
    }

    body .statistics-list thead th .type {
        display: inline-block;
        position: static;
        margin-bottom: 0;
    }

    body.fso_permit .statistics-list thead th:nth-child(1),
    body.fso_permit .statistics-list thead th:nth-child(3),
    body.fso_permit .statistics-list thead th:nth-child(4),
    body .statistics-list.statistics4 thead th:nth-child(2),
    body .statistics-list.statistics4 thead th:nth-child(3),
    body .statistics-list.statistics4 thead th:nth-child(4) {
        display: none;
    }

    body .statistics-list>.myflex>div:nth-child(2) .content {
        font-size: 1rem;
    }

    body.fso_permit .statistics-list>.myflex:first-child>div:nth-child(2) .type {
        /* show "Form Number" */
        display: block !important;
    }

    body.fso_permit .statistics-list.statistics3>.myflex:first-child {
        /* show "Form Number" */
        padding-top: 2em;
    }

    body.fso_permit .statistics-list.statistics3 .detail {
        padding: 0;
    }

    body.fso_permit .statistics-list.statistics3 tbody td:nth-child(1),
    body.fso_permit .statistics-list.statistics3>.myflex>div:nth-child(1) body .statistics-list.statistics4 tbody td:nth-child(1) {
        /* put form number in front of the form name. */
        font-size: .875rem;
        /* unify font-size with form number */
        max-width: 10%;
        width: 2.5em !important;
        padding-top: 0;
    }

    body.fso_permit .statistics-list.statistics3 tbody td:nth-child(1) .content:after,
    body.fso_permit .statistics-list.statistics3>.myflex>div:nth-child(1) .content:after {
        content: ")";
        /* add a blanket after form number */
    }

    body.fso_permit .statistics-list.statistics3 tbody td:nth-child(2),
    body.fso_permit .statistics-list.statistics3>.myflex>div:nth-child(2) {
        width: 90%;
        padding-top: 0;
    }

    body.fso_permit .statistics-list.statistics3>.myflex>div:nth-child(3),
    body.fso_permit .statistics-list.statistics3>.myflex>div:nth-child(4) {
        width: 7em;
        min-width: 7em;
        padding-left: 1.65em;
    }

    body.fso_permit .statistics-list.statistics3>.myflex {
        justify-content: flex-start;
        align-items: baseline;
        padding: 1em;
    }


    body.fso_permit .statistics-list.statistics3 tbody td:nth-child(3),
    body.fso_permit .statistics-list.statistics3 tbody td:nth-child(4) {
        width: 100%;
        padding-left: 2.3em;
    }

}


/* PRODUCTOIN CREDITS */

@media screen and (max-width: 620px) {

    body.about_us .statistics-list.statistics5>.mygrid {
        /* unset min-height, add padding on top/bottom instead*/
        min-height: unset !important;
        padding: 1rem 0;
    }

    body.about_us .statistics-list.statistics5>.mygrid:first-child {
        padding: 0
    }
}



/******************************
    
              Landing Page
    
    ******************************/


.mainArea7 .ma7-area1 .grid-container>div {
    /* alignment of Production Directory Icon */
    padding: 0 2.25rem;
}

.mainArea7 .ma7-area1 .grid-container {
    /* alignment of Production Directory Icon */
    padding: 3rem 0 !important;
    grid-gap: 4rem 1rem !important;
}


.mainArea7 .ma7-area2 .flexborder .icon {
    /* alignment of Permit & Forms Icon */
    margin-left: 1rem;
}

.mainArea7 .ma7-area2 .flexborder .icon img {
    /* alignment of Permit & Forms Icon */
    width: 100%;
}

/* fix image above location library */
.mainArea9 .myImgHead2>div:first-child {
    height: 48.2vw !important;
    /* remove height: 100%.  the image disappear in mobile */
    max-height: 100%;
    /* as a replacement of height: 100% to constrain the height */
    background-position: left center !important;
    /* tailor positioning for this specific image */

}

/* unify title text "Location Library" with other heading */
.mainArea9 .title {
    /*    layout.css:8959    */
    font-size: 2.5rem !important;
}

/* fix padding between Location Library and Production Directory when tag is hidden */
.mainArea.mainArea9 {
    padding-bottom: 1.75rem;
}

.mainArea.mainArea10 .cont {
    font-size: 1.25rem;
    /* font-size of USEFUL TIPS */
}

.mainArea.mainArea10 .cont li {
    padding: 0.15rem 0;
    /* padding between li in USEFUL TIPS */
}

.mainArea.mainArea10 div.more {
    padding-bottom: 0;
    /* padding bottom fix for the USEFUL TIPS more button */
}

#close_up .close {
    /* half transparent background on CLOSE X lightbox */
    background-color: #ffffffe0;
}

@media screen and (max-width: 1330px) {

    .mainArea9 .myImgHead2 {
        /* image above location library offset container's padding */
        margin-left: -1.2rem;
        width: calc(70% + 1.2rem);
    }

    .mainArea9.mainArea .borderName {
        /* image above location library offset container's padding */
        margin-left: 1.2rem;
    }

    /* English version fixes only */
    body.englishVersion .footerArea ul.fMenu>li {
        /* footer sitemap > 4 columns x 2 row */
        width: 25%;
    }

    body.englishVersion .footerArea ul.fMenu>li:nth-child(4) {
        /* production directory */
        width: 32%;
    }

    body.englishVersion .footerArea ul.fMenu>li:nth-child(5) {
        /* about us */
        width: 18%;
    }

    body.englishVersion .footerArea ul.fMenu {
        /* footer sitemap > 4 columns x 2 row */
        justify-content: flex-start;
    }

    body.englishVersion .footerArea2 .footerRow {
        /* footer copyright lines  */
        flex-wrap: wrap;
        flex-direction: column;
        height: 6em;
        align-items: stretch;
        justify-content: center;
    }

    body.englishVersion .footerBanner.slides {
        /* footer copyright lines */
        text-align: left;
    }

    body.englishVersion .footerArea .copyRight {
        /* footer copyright lines */
        text-align: right;
        margin: 0 2rem;
    }

    body.englishVersion .footerArea .updateDate {
        /* footer copyright lines */
        text-align: right;
        margin: 0 2rem;
    }
}

@media screen and (max-width: 992px) {
    /* bsplus.css:  */

    body .mainArea2 .msgArea .border {
        /* Vision/Mission msg box fix - vertical aligning*/
        display: flex;
        flex-direction: column;
        height: 100%;
        justify-content: center;
    }

    .mainArea2 .msgArea .content {
        /* Vision/Mission msg box fix */
        margin-bottom: 0;
        min-height: auto !important;
    }

    .mainArea2 .msgArea {
        /* Vision/Mission msg box fix */
        margin-bottom: 1.75rem;
    }

    body .mainArea2 #flexslider-msg .flex-direction-nav {
        /* Vision/Mission msg box fix */
        height: 0;
        margin-bottom: 20px;
    }


    body .mainArea2 #flexslider-msg {
        /* bsplus.css:4964 */
        padding: 0 calc(5% + 40px);
        /* vision/mission padding between text and button.  reduced padding for mobile */
    }

    body .mainArea1 .bannerArea #flexslider-mb .flex-pauseplay {
        /* Fix - play button positioning */
        bottom: 1.2em;
        left: 1.2em;
    }

    .mainArea9 .myImgHead2>div:first-child {
        /* image above location library, size fix. */
        min-height: 220px;
        width: calc(100% + 2.4rem);
        /* offset margin */
    }

    body .mainArea10 .border.banner {
        /* Enhancement - Explore Useful tips - enlarge and repositioning */
        min-height: 220px;
        background-position-y: 65%;
    }

    body .mainArea10 .border.detail {
        /* useful tips text padding. no need to be so narrow. */
        padding: 2.5rem !important;
    }


    /* english version only */
    body.englishVersion .footerArea2 .footerRow>* {
        /* footer copyright lines */
        text-align: center;
    }

    body.englishVersion .footerArea2 .footerRow {
        /* footer copyright lines */
        flex-direction: row;
        height: auto;
    }

    body.englishVersion .mainArea2 .msgArea .content {
        /* footer copyright lines */
        min-height: auto;
    }


}


@media screen and (max-width: 767px) {
    .mainArea9.mainArea .borderName {
        float: right;
        /* image above location library/ move the captio text to the right */
    }
}



/* MORE INFO ARROW VERTICAL ALIGN **/
.mainArea .mfsResult .mybtn:not(.submitbtn2) a::after,
.mainArea .more-info a::after,
.truncate-tags-display .mybtn.tt-down a::after,
a.clear-all::after {
    top: 50% !important;
    translate: 0 -50%;
}

/* REDUCE SIZE OF EXT LINK TO MATCH WITH FONT SIZE */
.mDocDetail .cont :not(.myIcon)>a.externalUrl {
    padding-right: 1.5em;
}

.mDocDetail .cont :not(.myIcon)>a.externalUrl::before {
    width: 1.2rem;
    height: 1.4rem;
    translate: 0 -50%;
    top: 50%;
}

/* DETAILS */
body.production_directory .mDocTitleList .cont ul>li:nth-last-child(n+2) {
    margin-bottom: 0.5em;
}

/* fixing search field */
body.production_directory .mySearch2 {
    flex: 1;
}

body.production_directory .h1Area {
    gap: 0 4rem;
}

body.production_directory .h1Area .myflex.flexMiddle.flexWrap {
    justify-content: flex-end;
    gap: 0 0.5rem;
    align-items: flex-end;
}

body.production_directory .ffFilter {
    align-items: flex-end;
}

@media screen and (max-width: 992px) {
    body.production_directory .h1Area>div:first-child {
        width: auto;
    }

    .mySearch2 input[type="text"] {
        padding-left: 35px;
    }
}



@media screen and (max-width: 800px) {
    /* fixing -- filter&keyword block lining */

    body.production_directory .ffFilter>.custom-dropdown-selector:last-child {
        width: 0;
        flex-basis: 100%;
        content: "";
    }
}



@media screen and (max-width: 620px) {
    body.production_directory .statistics-list.statistics4>.myflex>div:nth-child(n+1) {
        /* move to 1column layout */
        width: 100%;
    }

    body.production_directory .statistics-list.statistics4>.myflex>div:first-child .detail .more-info {
        margin-bottom: 0;
    }

    body.production_directory .statistics-list.statistics4>.myflex>div:nth-child(2) .content br {
        /* address remove linebreak. */
        display: none;
    }

    body.production_directory .statistics-list.statistics4 .detail {
        /* reduced padding */
        padding: 1rem;
    }

    /* reduce first column of contact details */
    body.production_directory .flexTitleList>div>div:nth-child(1) {
        width: 8rem;
        min-width: 8rem;
    }

    body.production_directory .clear-all {
        margin-top: 0.75rem;
    }

}

@page {
    margin: 0.5cm;
    orphans: 4;
    widows: 4;
}

@media print {
    html {
        font-size: 12px;
    }

    img {
        max-width: 100% !important;
    }

    .headerArea {
        overflow-y: visible !important;
    }

    body #body {
        padding-top: 0
    }

    .contentArea {
        padding-left: 0
    }

    #advanced-search,
    .tab-content>.tab-pane,
    .headerArea .mob,
    .sr-only,
    .access,
    .left-container,
    div.btmNav,
    .footerMenuArea {
        display: none !important;
        opacity: 0;
    }

    #header .dst,
    body .breadcrumb,
    .subMenuFlex,
    body.fixCloseUp #advanced-search,
    #advanced-search .tab-content .active,
    body .footerArea2 .footerRow {
        display: block !important;
        opacity: 1;
    }

    /* showing breadcrumb next to logo */
    .breadcrumbbg {
        position: relative;
        top: 50% !important;
        left: 0 !important;
    }

    .headerArea .headerArea1 .headerTool .headerNav {
        justify-content: flex-start;
        align-items: center;
    }

    .headerTop {
        display: none;
    }

    body:not(.fixedHeader):not(.indexVersion) .bodyArea {
        padding-top: 0 !important;
    }

    .iconList .border {
        padding: 3.125rem 0 !important;
    }

    .headerTool .myLogo {
        padding-top: 0;
    }


    .myflex>.myDocumentContent,
    .subMenuVersion .contentArea {
        max-width: 100% !important;
        width: 100% !important;
    }

    .areaPL::after,
    .areaTC::after,
    .areaBgC::after {
        width: 100% !important;
        background-color: transparent;
    }

    body .footerArea1>div>.myflex {
        justify-content: center;
    }

    body.production_directory .myIndexList>div.border,
    .linksList.ll-o>div {
        width: 40% !important;
    }

    .flex13> :nth-child(1),
    .flex13> :nth-child(2) {
        width: 100% !important;
    }

    .myform input,
    .myform textarea {
        padding: var(--inputpadding) !important;
    }

    .myform .myform-input-area>div.floating-label {
        /* border: 1px solid #bdbdbd !important; */
    }

    .myform .myform-input-area>div.half {
        width: 49.9% !important;
    }

    .myform .myform-input>div,
    .mainArea7 .ma7-area1,
    .mainArea .mainArea10 {
        page-break-inside: avoid;
    }

    #close_up .close {
        display: none;
    }

    #close_up .main {
        padding: 1rem !important;
    }

    #close_up .main,
    #close_up .formAnnex {
        width: 100% !important;
    }

    #close_up .main {
        text-align: left !important;
    }

    #close_up h2,
    #close_up h3,
    #close_up h4,
    #close_up .annexParagraph,
    #close_up .annexAnnex {
        padding-right: 1rem !important;
    }

    #close_up ul#advanced-search-tabs>li {
        display: inline-block;
    }

    #close_up .sticky-header {
        position: relative;
    }

    #close_up #organisations ul>li {
        width: 45%;
        display: inline-block;
    }
}


/* icon/text side-by-side */
.mainArea7 .ma7-area1 .grid-container {
    --grid-item--min-width: 250px;
}

@media screen and (max-width: 650px) {
    .mainArea7 .grid-container>div>a {
        display: flex;
        align-items: center;
    }

    .mainArea7 .ma7-area1 .grid-container>div {
        padding: 0 1rem;
    }

    .mainArea7 .ma7-area2 .border::before {
        top: 50%;
        translate: 0 -50%;
    }

    .mainArea7 .container .grid-container div>a>.icon {
        padding: 0 1.5rem 0 0;
        width: 7rem;
        margin: 0;
    }

    .mainArea7 .container .grid-container div>a>.title {
        padding: 0;
        margin: 0;
        flex: 1;
    }

    .mainArea7 .ma7-area2 .grid-container div>a>.title {
        padding-right: 1rem;
    }

    .mainArea7 .ma7-area1 .grid-container {
        grid-gap: 3rem 1rem !important;
    }
}

/* production directory -- related venues */
.mainContent .applicationcategories a,
a.related-venues {
    color: #3058cc;
}

input,
option,
select {
    background-color: transparent;
}

@media screen and (max-width: 992px) {

    body .headerTool .myLogo {
        /* align with CSI's logo size */
        width: 200px;
        padding-top: 0.5rem;
    }

    body .footerArea1 .myflex .footerContact {
        min-width: unset;
    }
}
.modal a.d-block {
    cursor: pointer;
}
.modal a.d-block.collapsed:after {
  	opacity: 1;
}
.footerArea1 .myflex .footerContact {
    min-width: 23.5rem;
}

body.chineseVersion .footerArea ul.fMenu {
    padding: 0 0 0 5.5vw;
    /* padding: 0 0 0 5rem; */
}

.fixedHeader .headerTool .myLogo {
    overflow-y: hidden;
    max-height: 5rem;
}

.iL {
    display: inline-block;
}

/* online-form only 
.leftMenu {
    display: none;
}
body.subMenuVersion div.contentArea {
    width: 100%;
    padding-left: 0;
}*/
/* end by Andy */

#flexslider_footer.flexslider:hover .flex-direction-nav .flex-prev,
#flexslider_footer.flexslider .flex-direction-nav .flex-prev:focus {
    opacity: 0.7;
    left: 10px;
}

#flexslider_footer.flexslider:hover .flex-direction-nav .flex-next,
#flexslider_footer.flexslider .flex-direction-nav .flex-next:focus {
    opacity: 0.7;
    right: 10px;
}
  
  
  
/* submenu addons */
.fastsub {
    transition: opacity 0.25s ease-in;
    width: 100%;
}

.fast:hover .fastsub,
.fastsub:hover {
    opacity: 1;
}

.fastsub.oContainer {
    position: relative;
    opacity: 0;
}

.fastsub.iContainer {
    background-color: white;
    padding-top: 1rem;
    position: absolute;
    display: flex;
    flex-direction: column;
}

.fastsub .fitems {
    border: 1px solid gray;
    padding: 1rem;
}
.fastsub .fitems > div {
    padding: 0.5rem;
    text-transform: uppercase;
}
  
  
  