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

/* HTML5 display-role reset for older browsers */
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
    display: block;
}

html {
    font-size: 10px;
    line-height: 1.8;
}

body {
    line-height: 1.8;
    letter-spacing: 2px;
    font-size: 1.6rem;
    font-family: 'Noto Serif TC', 'Amiri', sans-serif;
    background: url(../../images/pattern.png), #fff;
    color: #000000;
    overflow-x: hidden;
    font-weight: 400;
    position: relative;
    z-index: 0;
}

ol,
ul {
    list-style: none;
}

blockquote,
q {
    quotes: none;
}

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

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

td {
    vertical-align: top;
}

a {
    color: inherit;
    text-decoration: none;
    outline: none;
    transition: all .3s;
    box-sizing: border-box;
}

a:hover,
a:focus {
    text-decoration: none;
    transition: .2s ease all;
}

img {
    max-width: 100%;
    image-rendering: -moz-crisp-edges;
    image-rendering: -o-crisp-edges;
    image-rendering: -webkit-optimize-contrast;
    image-rendering: crisp-edges;
    -ms-interpolation-mode: nearest-neighbor;
}

::selection {
    background: rgba(204, 204, 204, 1);
}

::-webkit-scrollbar {
    width: 10px;
}

::-webkit-scrollbar-track {
    -webkit-border-radius: 10px;
    border-radius: 10px;
    margin: 0 0 5px 0;
}

::-webkit-scrollbar-thumb {
    -webkit-border-radius: 4px;
    border-radius: 4px;
    background: rgba(204, 204, 204, 1);
    /*捲軸顏色*/
}

.clear::after {
    content: "";
    display: block;
    clear: both;
}

/************************************************************************************************************************************************
************************************************************************************************************************************************
************************************************************************************************************************************************/
/*carousel-fade*/
.carousel-fade .carousel-inner .item {
    transition-property: opacity;
}

.carousel-fade .carousel-inner .item,
.carousel-fade .carousel-inner .active.left,
.carousel-fade .carousel-inner .active.right {
    opacity: 0;
}

.carousel-fade .carousel-inner .active,
.carousel-fade .carousel-inner .next.left,
.carousel-fade .carousel-inner .prev.right {
    opacity: 1;
}

.carousel-fade .carousel-inner .next,
.carousel-fade .carousel-inner .prev,
.carousel-fade .carousel-inner .active.left,
.carousel-fade .carousel-inner .active.right {
    left: 0;
    transform: translate3d(0, 0, 0);
}

.carousel-fade .carousel-control {
    z-index: 2;
}

.carousel-inner>.item>img {
    display: inline-block;
}

.carousel-inner {
    border-top-left-radius: 313px;
}

/***mibutton***/
.mibutton {
    position: fixed;
    top: 0;
    right: 0;
    z-index: 50;
    cursor: pointer;
    width: 85px;
    height: 85px;
    text-align: left;
    background: url(../../images/menu_bg.png) top left repeat;
    padding: 1.6rem 2.1rem;
    transition: .5s ease all;
    border-radius: 50%;
}

.mibutton span {
    display: block;
    font-weight: 400;
    transition: .3s ease all;
    font-size: 14px;
    color: #b7aaa0;

}

.mibutton span:nth-child(2) {
    width: 100%;
    height: 2px;
    transition: .3s ease all;
    background: #62a2b3;
    text-align: left;
    margin: 0.5rem 0 0.7rem;
}

.mibutton span:nth-child(3) {
    width: 75%;
    height: 2px;
    transition: .3s ease all;
    background: #62a2b3;
    text-align: left;
}

.mibutton_ani {
    background: none;
    box-shadow: 0px 0px 3px rgba(0, 0, 0, 0);
    transform: scale(.9);
    transform-origin: top right;
}

.mibutton_ani span {
    opacity: 1;
    background: #000 !important;
    transition: .5s ease all;
}

.mibutton_ani span:nth-child(1) {
    opacity: 0;
}

.mibutton_ani span:nth-child(2) {
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    -webkit-transform-origin: center;
    transform-origin: center;
}

.mibutton_ani span:nth-child(3) {
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
    -webkit-transform-origin: center;
    transform-origin: center;
    width: 100%;
    margin-top: -.5em;
}

.mibutton:hover span:nth-child(2),
.mibutton:hover span:nth-child(3) {
    background: #fff;
}

/*navbar*/
.navbar {
    position: fixed;
    top: 0;
    right: 0;
    width: 710px;
    max-width: 100%;
    text-align: center;
    z-index: 30;
    border: 0;
    min-height: auto;
    border-radius: 0;
    margin: 0;
    transform: translateX(710px);
    transition: .6s ease-in-out;
    height: 100vh;

}

.show {
    transform: translateX(0px);
}

/*menu*/
.menu {
    background: url(../../images/menu_pattern.png) repeat;
    padding: 7.8rem 7.4rem 7.8rem 9.8rem;
    border-top-left-radius: 90px;
    border-bottom-left-radius: 100px;
    -webkit-filter: drop-shadow(2px 2px 7px rgba(25, 25, 25, 0.5));
    filter: drop-shadow(2px 2px 7px rgba(25, 25, 25, 0.5));
}

/*menu_logo*/
.menu_logo {
    text-align: center;
    padding-bottom: 6.8rem;

}

.menu_logo a {}

.menu_logo a:hover {
    opacity: .7;
}

.menu_logo a img {
    display: block;
    text-align: center;
    margin: 0 auto;
}

.menu_logo a img:nth-child(1) {
    padding-bottom: 3rem;
}

/*ibutton*/
.ibutton {}

.ibutton ul {}

.ibutton ul li {
    width: 48%;
    display: inline-block;
    margin-bottom: 4rem;
}

.ibutton a .ch {
    text-align: right;
}

.ibutton a .ch p {
    display: inline-block;
    font-size: 40px;
    color: #827470;
    font-family: 'Amiri';
    line-height: 1;
    letter-spacing: 0px;
}

.ibutton a .ch h3 {
    display: inline-block;
    font-size: 24px;
    font-weight: bold;
}

.ibutton a .ch img {
    display: inline-block;
}

.ibutton a .en {
    text-align: left;
}

.ibutton a .en img {
    display: inline-block;
    vertical-align: middle;
    position: relative;
    left: 1rem;
    top: -3px;
}

.ibutton a .en h4 {
    display: inline-block;
    background: #000000;
    border-radius: 20px;
    color: #827470;
    font-size: 14px;
    padding: .5rem 2.6rem .5rem 0;
    position: relative;
    width: 190px;
    max-width: 100%;
    text-align: right;
    text-transform: uppercase;
    font-weight: 400;
}

.ibutton a .en h4:before {
    content: '';
    background: url(../../images/menu_deco04.png) center left no-repeat;
    width: 34px;
    height: 18px;
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
}

.ibutton li:nth-child(8) .en h4 {
    background: #3a4812;
}

.ibutton a .en h4 img {}

.ibutton a .ch h3,
.ibutton a .en h4 {
    transition: .3s ease-in-out;
}

.ibutton a:hover .ch h3 {
    color: #638ba0;
}

.ibutton a:hover .en h4 {
    color: #fff;
}

@media screen and (max-width:1360px) {
    .navbar {
        overflow-y: scroll;

    }
}

@media screen and (max-width:768px) {
    .carousel-inner {
        border-top-left-radius: 210px;
    }
}

@media screen and (max-width:640px) {
    .menu {
        padding: 4.8rem 7.4rem 4.8rem 9.8rem;
    }

    .ibutton ul li {
        width: 80%;
        margin-bottom: 2rem;
    }

    .ibutton a .ch {
        text-align: center;
    }

    .ibutton a .en {
        text-align: center;
    }
}

@media screen and (max-width:576px) {
    .menu_logo {
        padding-bottom: 3.8rem;
    }

    .carousel-inner {
        border-top-left-radius: 70px;
    }
}

@media screen and (max-width:540px) {
    .menu_logo {}

    .mibutton {}

    .mibutton span:nth-child(2) {}

    .menu_logo a {}
}

@media screen and (max-width:450px) {
    .menu {
        border-top-left-radius: 80px;
        border-bottom-left-radius: 80px;
        padding: 4.8rem 2rem 9.8rem;
    }

    .navbar {
        width: 100%;
        transform: translateX(100%);
    }

    .menu_logo a img:nth-child(1) {
        width: 35%;
    }

    .mibutton {
        padding: 1.6rem 1.5rem;
        width: 80px;
        height: 80px;
    }

    .show {
        transform: translateX(0px);
    }
}

@media screen and (max-width:380px) {
    .navbar {
        width: 100%;
        transform: translateX(100%);
    }

    .show {
        transform: translateX(0px);
    }
}

@media screen and (max-width:350px) {
    .intop a {}

    .mibutton {}

    .mibutton span {
        font-size: 16px;
    }
}

@media screen and (max-width:320px) {
    .menu {
        padding: 4.8rem 0 4.8rem 1.8rem;
    }
}

@media screen and (max-width:300px) {
    .menu {
        padding: 4.8rem 0 4.8rem 0.8rem;
    }
}

/*---dex----------------------------------------------------------------------------------------------------------------------------------*/
.dex {
    position: relative;
    height: 1080px;
}

.dex:before {
    content: '';
    background: url(../../images/inews_bg01.jpg) top left repeat;
    background-size: auto;
    width: 65%;
    min-height: 238px;
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: -1;
}

.dex .dex_deco {}

.dex_deco img:nth-child(1) {
    position: absolute;
    top: 0;
    right: 10px;
    z-index: 1;
}

.dex_deco img:nth-child(2) {
    position: absolute;
    bottom: -1rem;
    right: 0;
    z-index: 1;
}

.dex_deco img:nth-child(3) {
    position: absolute;
    bottom: 22rem;
    left: 0;
    z-index: 1;
}

.dex_deco img:nth-child(4) {
    position: absolute;
    bottom: .5rem;
    right: 34rem;
    z-index: 1;
}

.dex_deco img:nth-child(5) {
    position: absolute;
    bottom: 0;
    left: 19.5rem;
    z-index: 1;
}

.dex .dex_inner {
    padding: 4rem 9rem 0 11.3rem;
    display: flex;
    justify-content: space-between;
}

.dex_inner .dex_lt {
    padding-top: 6.6rem;
    width: 200px;
    max-width: 100%;
}

.dex_lt img {}

.dex_lt h2 {
    -webkit-writing-mode: vertical-rl;
    writing-mode: vertical-rl;
    font-size: 20px;
    color: #363233;
    padding: 3.7rem 2rem 0 0;
    margin: 0 auto;
    line-height: 2;
}

.dex_inner .dex_rt {}

@media screen and (max-width:1600px) {
    .dex .dex_inner {
        padding: 4rem 2rem 0 2rem;
    }

    .dex_deco img:nth-child(3) {
        width: 35%;
    }

    .dex_deco img:nth-child(5) {
        left: 14.5rem;
    }

    .dex_inner .dex_rt {
        width: 85%;
    }
}

@media screen and (max-width:1500px) {
    .dex {
        height: 950px;
    }

    .dex_deco img:nth-child(3) {
        width: 30%;
        bottom: 18rem;
    }

    .dex_deco img:nth-child(5) {
        left: 12rem;
    }
}

@media screen and (max-width:1360px) {
    .dex {
        height: 848px;
    }

    .dex_deco img:nth-child(1) {
        width: 11%;
    }

    .dex_deco img:nth-child(2) {
        width: 40%;
    }

    .dex_deco img:nth-child(3) {
        bottom: 13rem;
    }

    .dex_deco img:nth-child(5) {
        left: 11rem;
        width: 25%;
    }
}

@media screen and (max-width:1260px) {
    .dex {
        height: 777px;
    }

    .dex_deco img:nth-child(3) {
        bottom: 6rem;
        width: 25%;
    }

    .dex_deco img:nth-child(4) {
        right: 36rem;
        width: 40%;
    }

    .dex_deco img:nth-child(5) {
        width: 15%;
    }
}

@media screen and (max-width:1200px) {
    .dex {
        height: 735px;
    }

    .dex_inner .dex_lt {
        padding-top: 0.6rem;
    }
}

@media screen and (max-width:1100px) {
    .dex {
        height: 665px;
    }

    .dex_deco img:nth-child(3) {
        bottom: 4rem;
        width: 18%;
    }
}

@media screen and (max-width:1000px) {
    .dex {
        height: auto;
    }

    .dex:before {
        width: 40%;
        min-height: 580px;
        bottom: -14rem;
    }

    .dex .dex_inner {
        flex-wrap: wrap;
        justify-content: flex-end;
    }

    .dex_inner .dex_lt {
        width: 100%;
        text-align: center;
    }

    .dex_lt h2 {
        writing-mode: horizontal-tb;
        -webkit-writing-mode: horizontal-tb;
        text-align: left;
        padding: 3.7rem 2rem 2rem 36rem;
    }

    .dex_deco img:nth-child(1) {
        width: 20%;
    }

    .dex_deco img:nth-child(2) {
        width: 60%;
        bottom: -17rem;
    }

    .dex_deco img:nth-child(3) {
        bottom: 4rem;
        width: 33%;
    }

    .dex_deco img:nth-child(4) {
        right: auto;
        width: 70%;
        left: 2rem;
        bottom: -11.5rem;
    }

    .dex_deco img:nth-child(5) {
        display: none;
    }

    .dex_inner .dex_rt {
        width: 100%;
    }
}

@media screen and (max-width:834px) {
    .dex_lt h2 {
        padding: 3.7rem 2rem 2rem 27rem;
    }
}

@media screen and (max-width:768px) {
    .dex:before {
        min-height: 480px;
        bottom: -15rem;
    }

    .dex_lt h2 {
        padding: 3.7rem 16rem 2rem;
    }
}

@media screen and (max-width:576px) {
    .dex:before {
        min-height: 438px;
    }

    .dex_deco img:nth-child(1) {
        width: 25%;
    }

    .dex_deco img:nth-child(3) {
        width: 46%;
    }

    .dex_inner .dex_lt {
        text-align: left;
        padding-left: 8rem;
    }

    .dex_lt h2 {
        padding: 3.7rem 0 2rem;
    }
}

@media screen and (max-width:450px) {
    .dex:before {
        min-height: 293px;
        bottom: -7rem;
    }

    .dex .dex_inner {
        padding: 4rem 1rem 0 1rem;
    }

    .dex_lt img {
        width: 50%;
    }

    .dex_deco img:nth-child(2) {
        bottom: -8rem;
    }

    .dex_deco img:nth-child(3) {
        width: 45%;
        bottom: 3rem;
    }

    .dex_deco img:nth-child(4) {
        bottom: -4.5rem;
        left: 1rem;
    }
}

@media screen and (max-width:414px) {
    .dex:before {
        min-height: 280px;
    }

    .dex_inner .dex_lt {
        padding-left: 5rem;
    }

    .dex_lt h2 {
        padding: 2.7rem 0 2rem;
    }

    .dex_lt img {
        width: 45%;
    }
}

@media screen and (max-width:360px) {
    .dex_lt h2 {
        font-size: 16px;
    }
}

@media screen and (max-width:330px) {
    .dex:before {
        min-height: 215px;
        bottom: -5rem;
    }

    .dex_deco img:nth-child(4) {
        bottom: -3.5rem;
        left: 1rem;
    }

    .dex_deco img:nth-child(2) {
        bottom: -6rem;
    }
}

@media screen and (max-width:300px) {
    .dex_inner .dex_lt {
        padding-left: 3rem;
    }
}

@media screen and (max-width:350px) {}


/*---inews----------------------------------------------------------------------------------------------------------------------------------*/

.inews {
    position: relative;
    padding: 11.5rem 0 8rem;
}

.inews:before {
    content: '';
    background: url(../../images/inews_bg01.jpg) top left repeat;
    width: 65%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
}

.inews:after {
    content: '';
    background: url(../../images/inews_deco01.png) top right no-repeat;
    background-size: auto;
    width: 348px;
    max-width: 100%;
    min-height: 526px;
    position: absolute;
    top: -5rem;
    right: 0;
    z-index: -1;
}

.inews .inews_inner {
    width: 1368px;
    max-width: 100%;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
}

.inews_inner .inews_lt {
    width: 68%;
    padding: 2.3rem 2.4rem 0 0;
    position: relative;
    display: flex;
    justify-content: space-between;
    z-index: 0;
}

.inews_inner .inews_lt:before {
    content: '';
    background: url(../../images/inews_deco02.png) top right no-repeat;
    background-size: auto;
    width: 106px;
    max-width: 100%;
    min-height: 106px;
    position: absolute;
    top: 0;
    right: 0;
    z-index: -1;
}

.inewslist_rwd {
    width: 48%;
    display: inline-block;
}

.inewslist_rwd .ntitle {
    margin-top: 2.3rem;
}

.inewslist_rwd .ntitle h3 {
    font-size: 22px;
    font-weight: bold;
    margin-bottom: 2.2rem;
    line-height: 1.3;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
}

.inewslist_rwd .ntitle p {
    font-size: 16px;
    line-height: 1.3;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    margin-bottom: 2.8rem;
}

.inewslist_rwd .ntitle span {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    line-height: 1;
}

.inewslist_rwd .ntitle span .inews_lin {
    background: #303539;
    width: 70%;
    height: 0.5px;
    display: inline-block;
    margin-right: 5%;
}

.inewslist_rwd a {
    transition: .5s all;
}

.inewslist_rwd a:hover {
    color: #638ba0;
}

.inews_inner .inews_rt {
    padding-top: 12rem;
    text-align: right;
    position: relative;
}

.inews_inner .inews_rt h4 {
    padding: 1rem 0 5.5rem;
}

.inews_rt .inews_more {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.inews_more .imore {}

.inews_more .imore a {
    font-size: 18px;
    font-family: 'Amiri';
    transition: .5s all;
}

.inews_more .imore a:hover {
    color: #638ba0;
}

/*npic*/
.npic {
    position: relative;
    width: 440px;
    min-height: 295px;
    transition: .3s ease all;
    vertical-align: top;
    max-width: 100%;
    display: inline-block;
    transition: .3s ease all;
}

.npicimg {
    position: absolute;
    top: 0;
    left: 0%;
    width: 100%;
    height: 100%;
}

@media screen and (max-width:1370px) {
    .inews .inews_inner {
        padding: 0 2rem;
    }
}

@media screen and (max-width:1290px) {
    .inewslist_rwd .ntitle span .inews_lin {
        width: 60%;
    }
}

@media screen and (max-width:1200px) {
    .inews .inews_inner {
        flex-wrap: wrap;
        justify-content: center;
    }

    .inews_inner .inews_lt {
        width: 90%;
    }

    .inews_inner .inews_rt {
        width: 40%;
    }

    .inews_rt .inews_more {
        justify-content: flex-end;
    }

    .inews_more .imore {
        margin-left: 2rem;
    }
}

@media screen and (max-width:1000px) {
    .inews {
        padding: 26rem 0 8rem;
    }

    .inews:before {
        width: 40%;
    }

    .inews:after {
        background-size: 65%;
        min-height: 170px;
        top: 5rem;
    }

    .inews_inner .inews_rt {
        width: 60%;
        text-align: center;
    }

    .inews_rt .inews_more {
        justify-content: center;
    }
}

@media screen and (max-width:800px) {
    .inews_inner .inews_lt {
        width: 100%;
    }

    .inews_inner .inews_rt {
        width: 100%;
    }

    .npic {
        min-height: 215px;
    }
}

@media screen and (max-width:700px) {
    .inews_inner .inews_lt {
        flex-wrap: wrap;
        justify-content: center;
    }

    .inews_inner .inews_lt:before {
        right: 11rem;
    }

    .inewslist_rwd {
        width: 65%;
        margin-bottom: 4rem;
    }

    .npic {
        min-height: 280px;
    }
}

@media screen and (max-width:600px) {
    .inewslist_rwd {
        width: 85%;
    }

    .inews_inner .inews_lt:before {
        right: 6rem;
    }

    .inews_inner .inews_rt {
        padding-top: 2rem;
    }
}

@media screen and (max-width:576px) {
    .inews_inner .inews_lt:before {
        right: 4rem;
    }

    .inews_inner .inews_rt h4 {
        padding: 1rem 0 2.5rem;
    }
}

@media screen and (max-width:450px) {
    .inews .inews_inner {
        padding: 0 2.5rem 0 4.3rem;
    }

    .inews_inner .inews_lt {
        padding: 2.3rem 1.8rem 0 0;
    }

    .inews_inner .inews_lt:before {
        right: 0rem;
    }

    .inewslist_rwd {
        width: 100%;
    }

    .inews_inner .inews_rt img {
        width: 60%;
    }

    .inews_inner .inews_rt {
        text-align: right;
        margin-right: 2rem;
    }

    .inews_inner .inews_rt h4 {
        color: #818181;
    }

    .inews_rt .inews_more {
        justify-content: flex-end;
    }

    .inews_rt .inews_more img {
        width: 50%;
    }
}

@media screen and (max-width:414px) {
    .inews {
        padding: 20rem 0 8rem;
    }

    .inews:after {
        background-size: 50%;
        min-height: 130px;
    }

    .npic {
        min-height: 230px;
    }
}

@media screen and (max-width:390px) {
    .npic {
        min-height: 203px;
    }
}

@media screen and (max-width:370px) {
    .inewslist_rwd .ntitle span .inews_lin {
        width: 50%;
    }

    .npic {
        min-height: 190px;
    }

    .inews_inner .inews_rt h4 {
        font-size: 14px;
    }

    .inews_rt .inews_more img {
        width: 40%;
    }
}

@media screen and (max-width:330px) {
    .inews {
        padding: 17rem 0 8rem;
    }

    .inews:after {
        top: 3rem;
    }

    .inews .inews_inner {
        padding: 0 0.5rem 0 2.3rem;
    }
}

@media screen and (max-width:300px) {
    .npic {
        min-height: 170px;
    }
}

@media screen and (max-width:390px) {}

@media screen and (max-width:350px) {}

/*---iabout----------------------------------------------------------------------------------------------------------------------------------*/
.iabout {
    background: url(../../images/iab_mask01.png) top center no-repeat, url(../../images/iab_deco01.png) bottom left no-repeat, url(../../images/iab_mask02.png) top center repeat, url(../../images/iab_bg01.png) top center no-repeat, #eae4e4;
    background-size: contain, contain, contain, cover;
    width: 100%;
    position: relative;
}

/*.iabout:after{
	content: '';
	background: url(../../images/iab_deco01.png) bottom left no-repeat;
	background-size: contain;
	width: 1778px;
	max-width: 100%;
	min-height: 271px;
	position: absolute;
	bottom: 0;
	left: 0;
}*/
.iabout .iab {
    width: 1184px;
    max-width: 100%;
    margin: 0 auto;
    padding-top: 15.4rem;
    position: relative;
    z-index: 1;
}

.iab .iab_title {
    position: absolute;
    top: 22.3rem;
    left: 3rem;
}

.iab .iab_title img {
    display: inline-block;
    padding-bottom: 1rem;
}

.iab .iab_title h4 {
    text-align: right;
    font-size: 16px;
    padding-right: 7px;
    letter-spacing: 3px;
}

.iab .iab_more {
    position: absolute;
    top: 50%;
    left: 8rem;
    transform: translateY(-50%);
    z-index: 1;
}

.iab .iab_more img {
    vertical-align: middle;
    margin-right: 1.5rem;
}

.iab .iab_more a .iamore {
    background: #000;
    color: #fff;
    font-size: 18px;
    font-family: 'Amiri';
    padding: 1.9rem 1.8rem 1.9rem 2.4rem;
    transition: .5s all;
}

.iab .iab_more a:hover .iamore {
    background: #638ba0;
}

.iab .iab_img {
    padding-left: 14rem;
}

@media screen and (max-width:1100px) {
    .iab .iab_title {
        text-align: right;
        left: 1rem;
    }

    .iab .iab_title img {
        width: 90%;

    }
}

@media screen and (max-width:1040px) {
    .iab .iab_title {
        left: -3rem;
    }
}

@media screen and (max-width:991px) {
    .iab .iab_title {
        position: relative;
        top: -7.7rem;
        left: 0rem;
        text-align: center;
    }

    .iab .iab_title img {
        width: 85%;
    }

    .iab .iab_title h4 {
        padding-right: 8rem;
    }

    .iab .iab_more {
        top: 40%;
        left: 29rem;
    }

    .iab .iab_img {
        padding-left: 0;
    }
}

@media screen and (max-width:834px) {
    .iab .iab_title {
        top: -4.7rem;
    }

    .iab .iab_more {
        top: 43%;
        left: 20rem;
    }
}

@media screen and (max-width:768px) {
    .iab .iab_title img {
        width: 80%;
    }

    .iab .iab_title h4 {
        color: #555;
        font-size: 23px;
    }

    .iab .iab_more {
        left: 17rem;
    }
}

@media screen and (max-width:576px) {
    .iabout {
        background-position: top left, top left -54rem;
        background-size: 170%, cover;
    }

    .iab .iab_more {
        left: 6rem;
        top: 48%;
    }

    .iab .iab_more a .iamore {
        padding: 1.5rem 1.8rem 1.5rem 2.4rem;
    }
}

@media screen and (max-width:450px) {
    .iabout {
        background-position: top left, top left -49rem;
    }

    .iab .iab_title h4 {
        font-size: 19px;
        padding-right: 5rem;
    }

    .iab .iab_more {
        left: 2rem;
        top: 53%;
    }

    .iab .iab_more a .iamore {
        padding: 1.2rem 1.8rem 1.2rem 1.5rem;
    }
}

@media screen and (max-width:414px) {
    .iabout {
        background-position: top left, top left -42rem;
        background-size: 160%, cover;
    }

    .iabout .iab {
        padding-top: 11.4rem;
    }

    .iab .iab_title {
        top: -2.7rem;
    }

    .iab .iab_title img {
        padding-bottom: 0rem;
    }

    .iab .iab_title h4 {
        padding-right: 4rem;
        font-size: 17px;
    }

    .iab .iab_more {
        top: 50%;
        left: 3rem;
    }

    .iab .iab_more a .iamore {
        padding: 1rem 0 1rem 1rem;
        font-size: 14px;
    }

    .iab .iab_more img {
        margin-right: 0.5rem;
        width: 35%;
    }
}

@media screen and (max-width:360px) {
    .iab .iab_title h4 {
        padding-right: 3rem;
        font-size: 14px;
    }

    .iab .iab_more {
        top: 52%;
        left: 1rem;
    }
}

@media screen and (max-width:330px) {
    .iabout .iab {
        padding-top: 7.4rem;
    }

    .iab .iab_title h4 {
        font-size: 12px;
    }

    .iab .iab_more {
        top: 48%;
    }

    .iab .iab_more a .iamore {
        font-size: 12px;
        letter-spacing: 0.5px;
    }
}

/*---banner----------------------------------------------------------------------------------------------------------------------------------*/
.banner {
    padding: 7.4rem 7.2rem 0 0;
    position: relative;
}

.banner:before {
    content: '';
    background: url(../../images/banner_bg01.jpg) bottom left no-repeat;
    width: 1257px;
    max-width: 100%;
    min-height: 240px;
    position: absolute;
    bottom: 0;
    left: 0;
}

.banner:after {
    content: '';
    background: url(../../images/inbg.jpg) bottom left repeat;
    background-size: contain;
    width: 100%;
    min-height: 240px;
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: -3;
}

.banner .banner_deco {}

.banner .banner_deco img:nth-child(1) {
    position: absolute;
    top: 0;
    right: 1rem;
    z-index: 1;
}

.banner .banner_deco img:nth-child(2) {
    position: absolute;
    bottom: -15rem;
    right: 0;
    z-index: -2;
}

.banner .banner_deco img:nth-child(3) {
    position: absolute;
    bottom: 8rem;
    left: 0;
    z-index: 2;
}

.banner .banner_deco img:nth-child(4) {
    position: absolute;
    bottom: 4rem;
    left: 27rem;
    z-index: 1;
}

.banner .banner_deco img:nth-child(5) {
    position: absolute;
    bottom: 20rem;
    left: 27rem;
    z-index: 1;
}

.banner .banner_title {
    position: absolute;
    top: 6.5rem;
    left: 7rem;
    z-index: 1;
}

.banner_title .logo {
    margin-bottom: 6.6rem;
    padding-left: 8rem;
}

.banner_title .title {}

.title .title_en {}

.title .title_en h3 {
    font-size: 120px;
    color: #363233;
    font-family: 'Amiri';
    display: inline-block;
    text-transform: uppercase;
    line-height: 0;
}

.title .title_en img {
    display: inline-block;
    vertical-align: initial;
    padding-right: 1.7rem;
}

.title .title_txt {
    width: 75%;
    text-align: right;
    letter-spacing: 3px;
}

.title .title_env {
    width: 40%;
}

.title .title_news {
    width: 52%;
}

.title .title_note {
    width: 69%;
}

.title .title_loc {
    width: 50%;
}

.title .title_sce {
    width: 57%;
}

.title_txt h2 {
    font-size: 24px;
    padding: 1.4rem 0 1.3rem;

}

.title_txt h4 {
    font-size: 16px;
}

.banner .banner_img {
    width: 75%;
    margin: 0 0 0 auto;
    padding: 0 1.9rem 1.9rem 0;
    position: relative;
}

.banner .banner_img:before {
    content: '';
    background: url(../../images/banner_deco02.png) bottom right no-repeat;
    background-size: auto;
    width: 106px;
    max-width: 100%;
    min-height: 106px;
    position: absolute;
    bottom: 0;
    right: 0;
    z-index: -1;
}

.banner .banner_img img {
    border-top-left-radius: 316px;
}

@media screen and (max-width:1800px) {
    .banner .banner_deco img:nth-child(3) {
        width: 38%;
    }

    .banner .banner_deco img:nth-child(4) {
        width: 75%;
    }

    .banner .banner_title {
        top: 3.5rem;
    }
}

@media screen and (max-width:1700px) {
    .banner .banner_deco img:nth-child(3) {
        bottom: 5rem;
    }

    .banner .banner_deco img:nth-child(4) {
        bottom: 3rem;
    }

    .banner:before,
    .banner:after {
        min-height: 190px;
    }

    .banner .banner_img {
        width: 72%;
    }
}

@media screen and (max-width:1600px) {
    .banner .banner_deco img:nth-child(1) {
        width: 10%;
    }

    .banner .banner_deco img:nth-child(2) {
        bottom: -11rem;
        width: 18%;
    }

    .banner .banner_deco img:nth-child(3) {
        bottom: 2rem;
        width: 30%;
    }

    .banner .banner_deco img:nth-child(4) {
        bottom: 3rem;
        width: 60%;
        left: 51rem;
    }

    .banner .banner_img {
        width: 70%;
    }
}

@media screen and (max-width:1500px) {
    .banner .banner_deco img:nth-child(3) {
        bottom: 2rem;
        width: 20%;
    }

    .banner .banner_deco img:nth-child(5) {
        width: 20%;
    }

    .banner:before,
    .banner:after {
        min-height: 90px;
    }

    .banner .banner_img {
        width: 68%;
    }
}

@media screen and (max-width:1450px) {
    .banner:before {
        width: 67%;
    }

    .banner .banner_deco img:nth-child(3) {
        width: 15%;
    }

    .banner .banner_img {
        width: 67%;
    }

    .banner:before,
    .banner:after {
        min-height: 78px;
    }
}

@media screen and (max-width:1400px) {
    .banner {
        padding: 3.4rem 1.2rem 0 0;
    }

    .banner:before,
    .banner:after {
        min-height: 280px;
    }

    .banner .banner_deco img:nth-child(2) {
        bottom: -13rem;
    }

    .banner .banner_deco img:nth-child(3) {
        width: 27%;
        bottom: 2rem;
    }

    .banner .banner_deco img:nth-child(4) {
        bottom: 3rem;
        width: 90%;
        left: 6rem;
    }

    .banner .banner_deco img:nth-child(5) {
        width: 20%;
        left: 0;
        bottom: 28rem;
    }

    .banner .banner_title {
        position: relative;
        width: 60%;
        left: 0;
        margin: 0 auto;
        padding-bottom: 6rem;
        top: 0;
    }

    .banner_env {
        width: 65% !important;
    }

    .banner_title .logo {
        padding-left: 2rem;
    }

    .banner_title .title_txt {
        width: 54%;
    }

    .banner .banner_img {
        width: 98%;
    }
}

@media screen and (max-width:1310px) {
    .banner_env {
        width: 70% !important;
    }
}

@media screen and (max-width:1260px) {
    .banner_title .title_txt {
        width: 60%;
    }
}

@media screen and (max-width:1220px) {
    .banner_env {
        width: 85% !important;
    }
}

@media screen and (max-width:1130px) {
    .banner .banner_news {
        width: 70% !important;
    }
}

@media screen and (max-width:1100px) {
    .banner_title .title_txt {
        width: 70%;
    }

    .banner_sce .title_sce {
        width: 55%;
    }

    .banner_loc .title .title_en h3 {
        font-size: 100px;
    }
}

@media screen and (max-width:1000px) {
    .banner_env {
        width: 95% !important;
    }

    .banner_env .title .title_en h3 {
        font-size: 110px;
    }
}

@media screen and (max-width:991px) {
    .banner:before {
        min-height: 130px;
    }

    .banner:after {
        min-height: 108px;
    }

    .banner_sce .title .title_en h3 {
        font-size: 100px;
    }

    .banner_sce .title_txt {
        width: 51%;
    }

    .banner .banner_deco img:nth-child(2) {
        bottom: -10rem;
        width: 20%;
    }

    .banner .banner_deco img:nth-child(5) {
        bottom: 13rem;
    }

    .banner .banner_img img {
        border-top-left-radius: 225px;
    }

    .banner_title .title_txt {
        width: 77%;
    }
}

@media screen and (max-width:970px) {
    .banner .banner_news {
        width: 80% !important;
    }
}

@media screen and (max-width:950px) {
    .banner_loc .title .title_en h3 {
        font-size: 90px;
    }

    .banner_loc .title .title_en img {
        width: 8%;
    }
}

@media screen and (max-width:850px) {
    .banner .banner_news {
        width: 90% !important;
    }

    .banner .banner_note {
        width: 70% !important;
    }

    .banner_loc .title .title_en img {
        width: 9%;
    }

    .banner_loc .title .title_en h3 {
        font-size: 85px;
    }
}

@media screen and (max-width:834px) {
    .banner .banner_title {
        width: 70%;
    }

    .banner_env .title .title_en h3 {
        font-size: 100px;
    }

    .banner .banner_img img {
        border-top-left-radius: 180px;
    }
}

@media screen and (max-width:768px) {
    .banner:after {
        min-height: 58px;
    }

    .banner .banner_deco img:nth-child(2) {
        bottom: -5rem;
    }

    .banner .banner_deco img:nth-child(4) {
        left: 4rem;
        width: 80%;
    }

    .banner .banner_title {
        width: 80%;
    }

    .banner_env .title .title_en h3 {
        font-size: 85px;
    }

    .banner_news .title .title_en h3 {
        font-size: 110px;
    }

    .banner_title .title_txt {
        width: 75%;
    }

    .banner_sce .title_txt {
        width: 54%;
    }
}

@media screen and (max-width:730px) {
    .banner .banner_note {
        width: 90% !important;
    }
}

@media screen and (max-width:700px) {
    .banner_news .title .title_en h3 {
        font-size: 100px;
    }
}

@media screen and (max-width:660px) {
    .banner_env .title .title_en h3 {
        font-size: 80px;
    }

    .banner_env .title .title_en img {
        width: 7%;
    }
}

@media screen and (max-width:650px) {
    .banner .banner_title {
        width: 90%;
    }

    .banner_env .title .title_en h3 {
        font-size: 70px;
    }

    .banner_news .title .title_en h3 {
        font-size: 90px;
    }

    .banner_sce .title .title_en h3 {
        font-size: 110px;
    }

    .banner_sce .title .title_en img {
        width: 9%;
    }

    .banner_title .title_txt {
        width: 78%;
    }

    .banner_sce .title_sce {
        width: 84%;
    }
}

@media screen and (max-width:600px) {
    .banner_sce .title .title_en h3 {
        font-size: 100px;
    }
}

@media screen and (max-width:580px) {
    .banner .banner_title {
        width: 90%;
        padding-left: 0;
    }

    .banner_title .title_txt {
        width: 82%;
    }

    .title .title_en h3 {
        font-size: 110px;
    }

    .banner_env .title .title_en h3 {
        font-size: 60px;
    }

    .banner_news .title .title_en h3 {
        font-size: 75px;
    }

    .banner_note .title .title_en h3 {
        font-size: 95px;
    }

    .banner_sce .title .title_en h3 {
        font-size: 90px;
    }

    .banner .banner_img img {
        border-top-left-radius: 120px;
    }
}

@media screen and (max-width:540px) {
    .banner_loc .title .title_en h3 {
        font-size: 75px;
    }
}

@media screen and (max-width:500px) {
    .title .title_en h3 {
        font-size: 100px;
    }

    .banner_title .title_txt {
        width: 96%;
    }

    .banner_news .title .title_en h3 {
        font-size: 66px;
    }
}

@media screen and (max-width:490px) {
    .banner_sce .title .title_en h3 {
        font-size: 80px;
    }

    .banner_sce .title_sce {
        width: 88%;
    }
}

@media screen and (max-width:480px) {
    .banner_loc .title .title_en h3 {
        font-size: 70px;
    }
}

@media screen and (max-width:470px) {
    .banner_note .title .title_en h3 {
        font-size: 84px;
    }

    .banner_env .title .title_en img {
        width: 9%;
    }

    .banner_env .title .title_en h3 {
        font-size: 55px;
    }
}

@media screen and (max-width:450px) {
    .banner .banner_deco img:nth-child(2) {
        bottom: -7rem;
    }

    .title .title_en img {
        width: 20%;
    }

    .title .title_en h3 {
        font-size: 80px;
    }

    .banner .title .title_en img {
        width: 18%;
    }

    .banner_env .title .title_en h3 {
        font-size: 47px;
    }

    .banner_env .title .title_en img {
        width: 16%;
    }

    .banner_news .title .title_en h3 {
        font-size: 55px;
    }

    .banner_note .title .title_en h3 {
        font-size: 80px;
    }

    .banner_note .title .title_en img {
        width: 10%;
    }

    .banner_sce .title .title_en h3 {
        font-size: 65px;
    }

    .banner_loc .title .title_en h3 {
        font-size: 60px;
    }

    .banner_loc .title .title_en img {
        width: 17%;
    }

    .title img {
        padding-left: 3rem;
    }

    .title_txt h2 {
        font-size: 20px;
    }

    .title_txt h4 {
        font-size: 12px;
    }
}

@media screen and (max-width:420px) {
    .banner_note .title .title_en h3 {
        font-size: 70px;
    }
}

@media screen and (max-width:414px) {
    .banner {
        padding: 3.4rem 0.5rem 0 0;
    }

    .banner:before {
        min-height: 60px;
    }

    .banner .banner_deco img:nth-child(1) {
        width: 25%;
    }

    .banner .banner_deco img:nth-child(2) {
        bottom: -4rem;
        width: 25%;
    }

    .banner .banner_deco img:nth-child(4) {
        left: 3rem;
        width: 85%;
        bottom: 1.5rem;
    }

    .banner .banner_deco img:nth-child(5) {
        bottom: 6rem;
    }

    .banner .banner_title {
        padding-bottom: 2rem;
    }

    .banner_title .logo {
        padding-left: 2rem;
        width: 35%;
        margin-bottom: 3.6rem;
    }

    .title .title_en img {
        width: 12%;
        padding-left: 0rem;
    }

    .banner .title .title_en img {
        width: 11%;
    }

    .banner_sce .title_sce {
        width: 97%;
    }

    .banner_sce .title .title_en img {
        width: 10%;
    }

    .banner_env .title .title_en img {
        width: 9%;
    }

    .banner_news .title .title_en img {
        width: 10%;
    }

    .banner_loc .title .title_en img {
        width: 10%;
    }

    .title .title_en h3 {
        font-size: 80px;
    }

    .banner_title .title_txt {
        padding-right: 3rem;
    }

    .banner_env .title_env {
        width: 100%;
    }

    .banner_loc .title_loc {
        width: 100%;
        padding-right: 2rem;
    }

    .banner .banner_img {
        padding: 0 0.9rem 0.9rem 0;
    }

    .banner .banner_img img {
        border-top-left-radius: 90px;
    }

    .banner .banner_img:before {
        background-size: 50%;
        min-height: 56px;
    }

}

@media screen and (max-width:390px) {
    .banner:after {
        min-height: 30px;
    }

    .title .title_en img {
        width: 10%;
        padding-right: 0.7rem;
    }

    .banner .title .title_en img {
        width: 9%;
    }

    .banner_env .title .title_en img {
        width: 6%;
    }

    .banner_news .title .title_en img {
        width: 7%;
    }

    .banner_sce .title_sce {
        width: 100%;
    }

    .banner_env .title_env {
        padding-right: 1rem !important;
    }

    .banner_loc .title .title_en h3 {
        font-size: 57px;
    }

    .banner_loc .title .title_en img {
        width: 7%;
    }
}

@media screen and (max-width:370px) {
    .banner_env .title .title_en h3 {
        font-size: 44px;
    }
}

@media screen and (max-width:360px) {
    .banner_title .title_txt {
        padding-right: 0rem;
    }

    .banner_env .title .title_en h3 {
        font-size: 43px;
    }

    .banner_news .title .title_en h3 {
        font-size: 50px;
    }

    .banner_sce .title .title_en h3 {
        font-size: 60px;
    }

    .banner_sce .title_sce {
        width: 92%;
    }

    .banner_loc .title .title_en h3 {
        font-size: 50px;
    }

    .banner_loc .title_loc {
        width: 89%;
    }
}

@media screen and (max-width: 350px) {
    .title .title_en h3 {
        font-size: 70px;
    }

    .banner_title .title_txt {
        padding-right: 2rem;
    }

    .banner_loc .title_loc {
        padding-right: 0rem !important;
    }
}

@media screen and (max-width:340px) {
    .title .title_en h3 {
        font-size: 70px;
    }

    .banner_env .title .title_en h3 {
        font-size: 40px;
    }

    .banner_env .title_env {
        width: 97%;
    }

    .banner_note .title .title_en h3 {
        font-size: 65px;
    }

    .banner_title .title_txt {
        padding-right: 2rem;
    }

    .banner_news .title_news {
        padding-right: 0rem;
    }

    .banner .banner_deco img:nth-child(2) {
        bottom: -3rem;
    }
}

@media screen and (max-width:330px) {
    .banner_news .title .title_en h3 {
        font-size: 45px;
    }

    .banner_sce .title .title_en h3 {
        font-size: 55px;
    }

    .banner_sce .title_sce {
        width: 98%;
    }
}

@media screen and (max-width:320px) {
    .banner_env .title .title_en h3 {
        font-size: 35px;
    }

    .banner_env .title_env {
        width: 94%;
    }

    .banner_loc .title .title_en h3 {
        font-size: 45px;
    }
}

@media screen and (max-width:310px) {
    .title .title_en h3 {
        font-size: 65px;
    }

    .banner_note .title .title_en h3 {
        font-size: 60px;
    }

    .banner_sce .title .title_en h3 {
        font-size: 50px;
    }
}

@media screen and (max-width:300px) {
    .banner .banner_deco img:nth-child(1) {
        width: 30%;
    }

    .banner .banner_deco img:nth-child(2) {
        bottom: -3rem;
        width: 27%;
    }

    .banner .banner_deco img:nth-child(4) {
        left: 2rem;
    }

    .banner_title .logo {
        width: 40%;
    }

    .title .title_en h3 {
        font-size: 60px;
    }

    .banner_news .title .title_en h3 {
        font-size: 43px;
    }

    .banner .banner_img img {
        border-top-left-radius: 60px;
    }

    .banner_loc .title_loc {
        width: 95%;
    }

    .banner_env .title_env {
        width: 98%;
    }
}

/*---inner----------------------------------------------------------------------------------------------------------------------------------*/
.inner {
    background: url(../../images/inbg.jpg) top left repeat;
    position: relative;
    z-index: -3;
    padding-top: 7.3rem;
}

.inner:before {
    content: '';
    background: url(../../images/in_deco01.png) top left no-repeat;
    width: 1257px;
    max-width: 100%;
    min-height: 735px;
    position: absolute;
    top: 0;
    left: 0;
    z-index: -2;
}

.inner:after {
    content: '';
    background: url(../../images/in_deco02.png) bottom left no-repeat;
    background-size: contain;
    width: 100%;
    min-height: 275px;
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: -2;

}

@media screen and (max-width:1170px) {
    .inner {
        padding-top: 19.3rem;
    }
}

@media screen and (max-width:1450px) {
    .inner:before {
        max-width: 67%;
    }
}

@media screen and (max-width:768px) {
    .inner {
        padding-top: 9.3rem;
    }
}

@media screen and (max-width:650px) {
    .inner {
        padding-top: 7.3rem;
    }
}

@media screen and (max-width:450px) {
    .inner {
        padding-top: 4.3rem;
    }
}

@media screen and (max-width:414px) {
    .inner {
        padding-top: 5rem;
    }
}

/*---notice-------------------------------------------------------------------------------------------------------------------------------*/
.notice {
    text-align: center;
    border-radius: 20px;
    width: 1600px;
    margin: 0 auto;
    max-width: 90%;
    padding: 2em 0 3em;
    position: relative;
    z-index: 8;
}

/*note*/
.notice .note {
    position: relative;
    z-index: 3;
    padding-bottom: 1em;
}

.note ul {}

.note li {
    position: relative;
    display: inline-block;
    vertical-align: top;
    margin: 0 10px;
}

.note li a {}
.note li img {
	pointer-events: none;
}
img.nt {
    max-width: 100%;
    transition: .2s linear;
}

img.nt1 {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    max-width: 100%;
    opacity: 0;
    transition: .3s linear;
}

.note li.active img.nt {
    opacity: 0;
}

.note li.active img.nt1 {
    opacity: 1;
}

/*hover*/
.note li a:hover img.nt {
    opacity: 0;
}

.note li a:hover img.nt1 {
    opacity: 1;
}

/*tab-content*/
.tab-content {
    padding: 3em 2em;
    min-height: 900px;
}

/*note_info*/
.note_info {
    width: 900px;
    margin: 0 auto;
    max-width: 100%;
}

@media screen and (max-width:950px) {
    .notice {
        max-width: 95%;
    }
}

@media screen and (max-width:834px) {
    .note li {
        width: 30%;
    }
}

@media screen and (max-width:820px) {
    .service_note {
        padding: 1em 0 3em;
    }

    .tab-content {
        min-height: 600px;
        padding: 3em 0em;
    }
}

@media screen and (max-width:600px) {
    .note {
        padding-bottom: 1em;
    }

    .note li {
        margin: 0;
    }

    .note li img {
        padding: 2%;
    }

    .service_note .title {
        padding: 2em 0;
    }

    .note {
        padding-bottom: 0em;
    }

    .tab-content {
        padding: 1em;
    }
}

@media screen and (max-width:500px) {
    .service_note {
        max-width: 100%;
    }

    .note,
    .tab-content {
        max-width: 100%;
        margin: 0 auto;
    }
}

@media screen and (max-width:430px) {}

@media screen and (max-width:350px) {
    .service_note .title {
        padding: 1em 0 1em;
    }

    .note li {
        width: 30%;
    }
}

/*---icons----------------------------------------------------------------------------------------------------------------------------------*/
.icons ul {
    list-style: none;
}

.icons li {
    margin: 5px 5px;
    display: inline-block;
    vertical-align: top;
    width: 13%;
    background: rgba(255, 255, 255, .6);
    border-radius: 7px;
    padding: 5px 0 8px;
    text-align: center;
    border: solid 1px #7b7b7b;
}

.icons li img {
    padding: 0 7px;
    margin: 0 auto;
}

.icons li span {
    display: block;
    font-size: 14px;
    line-height: 20px;
}

@media screen and (max-width:1199px) {
    .icons li {
        width: 10%;
    }
}

@media screen and (max-width:900px) {
    .icons li span {
        letter-spacing: 1px;
    }
}

@media screen and (max-width:768px) {
    .icons li {
        width: 13%;
    }
}

@media screen and (max-width:600px) {
    .icons li {
        width: 17%;
    }
}

@media screen and (max-width:500px) {
    .icons li {
        width: 21%;
    }
}

@media screen and (max-width:430px) {
    .icons li {
        width: 27%;
        margin: 5px 8px;
        padding: 5px 4px 8px;
    }
}

@media screen and (max-width:360px) {
    .icons li span {
        font-size: 12px;
    }
}

@media screen and (max-width:340px) {
    .icons li {
        width: 28%;
        margin: 5px 5px;
        padding: 5px 2px 8px;
    }
}

/*--note_icons--------------------------------------------------------------------------------------------------------------------------------*/
.note_icon {
    padding: 0;
    text-align: left;
    padding: 1% 0;
}

.note_icon ul {
    list-style: none;
}

.note_icon li {
    width: 10.666666%;
    padding: 5px 0 5px;
    margin: 5px 5px;
}

.note_icon li img {
    padding-bottom: 5px;
    max-width: 100%;
}

@media screen and (max-width:1220px) {
    .note_icon li {
        width: 12%;
    }
}

@media screen and (max-width:790px) {
    .note_icon li {
        width: 16%;
    }
}

@media screen and (max-width:700px) {
    .note_icon li {
        width: 17%;
    }
}

@media screen and (max-width:580px) {
    .note_icon li {
        width: 19%;
        margin: 5px 0;
    }
}

@media screen and (max-width:505px) {
    .note_icon li {
        width: 23%;
        padding: 7px;
    }

    .note_icon li img {
        width: 90%;
    }
}

@media screen and (max-width:453px) {
    .note_icon li {
        width: 31%;
        padding: 4px;
    }
}

@media screen and (max-width:400px) {
    .note_icon li {
        padding: 6px;
    }
}

@media screen and (max-width:350px) {
    .note_icon li {
        width: 31%;
        padding: 3px;
    }
}


/*---location---------------------------------------------------------------------------------------------------------------------*/
.location {
    position: relative;
    padding-bottom: 11rem;
}

.location .loc_inner {
    width: 1136px;
    max-width: 100%;
    margin: 0 auto;
}

.loc_inner .loc_top {
    width: 904px;
    max-width: 100%;
    margin: 0 auto;
    text-align: right;
    position: relative;
    z-index: 1;
}

.loc_inner .loc_cen {
    width: 1136px;
    max-width: 100%;
    position: relative;
}

.loc_inner .loc_cen:before {
    content: '';
    border: .5px #000 solid;
    width: 1102px;
    max-width: 100%;
    min-height: 987px;
    position: absolute;
    top: 3.8rem;
    left: 0;
}

.loc_cen .map {
    position: relative;
    width: 1108px;
    margin: -3.9rem 0 0 auto;
    max-width: 100%;
    min-height: 986px;
    border: 5px #000 solid;
}

.loc_cen .map iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.loc_inner .loc_bot {
    width: 904px;
    max-width: 100%;
    margin: 5rem auto 0;
    text-align: left;
}

@media screen and (max-width:1120px) {
    .loc_inner .loc_cen {
        max-width: 95%;
        margin: 0 auto;
    }

    .loc_inner .loc_cen:before {
        max-width: 95%;
    }

    .loc_cen .map {
        max-width: 98%;
    }
}

@media screen and (max-width:991px) {
    .loc_inner .loc_top {
        text-align: center;
    }

    .loc_inner .loc_bot {
        max-width: 90%;
    }
}

@media screen and (max-width:834px) {
    .location {
        padding-bottom: 6rem;
    }

    .loc_inner .loc_cen:before {
        min-height: 610px;
    }

    .loc_cen .map {
        min-height: 630px;
    }

}

@media screen and (max-width:768px) {
    .loc_inner .loc_top {
        width: 85%;
    }
}

@media screen and (max-width:576px) {
    .loc_inner .loc_cen:before {
        min-height: 480px;
    }

    .loc_cen .map {
        min-height: 500px;
    }
}

@media screen and (max-width:450px) {
    .loc_inner .loc_cen:before {
        min-height: 370px;
    }

    .loc_cen .map {
        min-height: 390px;
    }

    .loc_inner .loc_bot {
        max-width: 70%;
    }
}

@media screen and (max-width:414px) {
    .location {
        padding: 3rem 0 2rem;
    }

    .loc_cen .map {
        margin: -1.9rem 0 0 auto;
    }

    .loc_inner .loc_bot {
        margin: 4rem auto 0;
    }
}

@media screen and (max-width:340px) {
    .loc_inner .loc_cen:before {
        top: 2.8rem;
        min-height: 310px;
    }

    .loc_cen .map {
        min-height: 330px;
    }

    .loc_inner .loc_bot {
        margin: 3rem auto 0;
    }
}



/*********************************************************************************************************************************************/
/*---footer--------------------------------------------------------------------------------------------------------------------------*/
footer {

    background: url(../../images/pattern.png), #fff;
}

.ft_top {
    position: relative;
    background: url(../../images/iab_mask02.png) top left repeat, url(../../images/footer_bg.png) top left no-repeat, #eae4e4;
    background-size: contain;
    width: 100%;
}

.inft {
    background: url(../../images/inft_bg01.png) top left no-repeat, url(../../images/inbg.jpg) top left repeat;
    background-size: contain;
    width: 100%;
    position: relative;
    z-index: -4;
}

/*ft_inner*/
.ft_inner {
    width: 1368px;
    max-width: 100%;
    margin: 0 auto 9rem;
    display: flex;
    justify-content: space-between;
}

.ft_inner .ft_lt {
    width: 51%;
    display: flex;
    justify-content: space-between;
    padding: 2.7rem 0 10rem 5rem;
    position: relative;
}

.ft_inner .ft_lt:before {
    content: '';
    background: #000;
    width: 1px;
    height: 98%;
    position: absolute;
    top: 0;
    left: 0;
}

.ft_inner .ft_lt:after {
    content: '';
    background: #000;
    width: 85%;
    height: 1px;
    position: absolute;
    bottom: 6px;
    left: 0;
}

.ft_lt .ftbtn {
    padding-top: 3.2rem;
    width: 40%;
}

.ftbtn ul {}

.ftbtn ul li {
    display: inline-block;
    width: 30%;

}

.ftbtn a img {
    transition: .5s all;
}

.ftbtn a:hover img {
    transform: scale(.8);
    opacity: .8;
}

.ft_lt .ftinfo {}

.ftinfo ul {}

.ftinfo ul li {
    line-height: 2.3;
}

.ftinfo ul li:nth-child(1) {
    margin-bottom: 2.6rem;
}

.ftinfo ul li h1 {
    font-size: 18px;
    font-weight: bold;
}

.ftinfo ul li p {
    display: inline-block;
    font-size: 16px;
    color: #030303;
    font-weight: 500;
    letter-spacing: 1px;
}

.ftinfo ul li p:first-child {
    padding-right: 1.5rem;
}

.ft_lt .ft_deco {
    position: absolute;
    bottom: 0;
    right: 0;
    line-height: 0;
}


.ft_inner .ft_rt {
    padding-top: 1.9rem;
    text-align: center;
}

/*ftlogo*/
.ftlogo {
    margin-bottom: 3.4rem;
}

.ft_rt .number {
    font-size: 16px;
    color: #363233;
    font-weight: bold;
}

.ft_rt .number img {
    margin-right: 1.6rem;
    vertical-align: bottom;
}

.ft_bot {
    width: 1836px;
    max-width: 100%;
    margin: 0 auto 4.5rem;
    background: #373737;
    padding: 1.9rem 23.5rem;
    display: flex;
    justify-content: space-between;
    border-radius: 100px;
}

/*copyright*/
.copyright {
    font-size: 14px;
    color: #b2b2b2;
    font-weight: 400;
}

.copyright a:hover {
    color: #fff;
}

/*icon*/
.icon {
    font-size: 13px;
    color: #b2b2b2;
    font-family: 'Amiri';
}

.icon a img {
    transition: .5s all;
    vertical-align: middle;
}

.icon a:hover img {
    transform: translateY(-5px);
}

@media screen and (max-width:1300px) {
    .ft_bot {
        padding: 1.9rem 10.5rem;
    }
}

@media screen and (max-width:1200px) {
    .ft_inner .ft_lt {
        width: 60%;
    }
}

@media screen and (max-width:991px) {
    .ft_inner .ft_lt {
        width: 70%;
    }

    .ft_bot {
        padding: 1.9rem 2.5rem;
    }
}

@media screen and (max-width:834px) {
    .ft_inner {
        justify-content: space-between;
        flex-wrap: wrap;
        flex-direction: column-reverse;
    }

    .ft_inner .ft_lt {
        width: 95%;
        padding: 4.7rem 0 10rem 5rem;
    }

    .ft_bot {
        flex-wrap: wrap;
        justify-content: center;
        border-radius: 30px;
        max-width: 95%;
    }

    .copyright {
        margin-bottom: 2rem;
    }
}

@media screen and (max-width:640px) {
    .ft_inner {
        margin: 0 auto 4rem;
    }

    .ft_inner .ft_lt {
        width: 95%;
        padding: 2.7rem 0 8rem 0;
        flex-wrap: wrap;
        justify-content: center;
    }

    .ft_inner .ft_lt:before {
        display: none;
    }

    .ft_lt .ftbtn {
        padding-top: 1.2rem;
        width: 60%;
    }

    .ft_lt .ftinfo {
        width: 80%;
        margin-top: 7rem;
    }

    .ft_inner .ft_rt {
        padding-top: 5rem;
    }
}

@media screen and (max-width:450px) {
    .ftlogo {
        width: 30%;
        margin: 0 auto 3.4rem;
    }

    .ft_inner .ft_lt {
        padding: 8.7rem 0 8rem 0;
    }
}

@media screen and (max-width:414px) {
    .ft_inner .ft_lt {
        width: 100%;
        padding: 6.7rem 0 8rem 0;
    }

    .ft_lt .ftbtn {
        width: 75%;
        text-align: center;
    }

    .ft_lt .ftinfo {
        width: 90%;
    }

    .copyright {
        text-align: center;
    }
}

@media screen and (max-width:360px) {
    .ft_inner .ft_lt {
        padding: 4.7rem 0 8rem 0;
    }
}

@media screen and (max-width:350px) {
    .ft_lt .ftinfo {
        width: 95%;
    }
}

@media screen and (max-width:330px) {
    .ft_inner .ft_lt {
        padding: 2.7rem 0 8rem 0;
    }

    .ftinfo ul li p:first-child {
        padding-right: 0.5rem;
    }

    .ft_lt .ftbtn {
        width: 85%;
    }
}

@media screen and (max-width:320px) {
    .ft_lt .ftinfo {
        width: 95%;
    }

    .ftinfo ul li p {
        display: block;
    }
}

/***btns******************************************************/
.btns {
    position: fixed;
    bottom: 3rem;
    right: 0;
    z-index: 20;
    display: none;
    text-align: right;
}

#gotop {
    cursor: pointer;
    margin: 0 1rem 2rem 0;
    transition: .3s ease-in-out;
}

.line a img {
    transition: .3s ease-in-out;
}

#gotop:hover {
    transform: translateY(-5px);
}

.line a:hover img {
    transform: scale(.8);
}

@media screen and (max-width:900px) {
    .btns {
        width: 140px;
    }
}

@media screen and (max-width:500px) {
    .btns {
        width: 120px;
    }

    #gotop {
        margin: 0 1em 0em 0;
        width: 45px;
        display: inline-block;
    }

    .line {
        width: 55%;
        margin: 1rem 0 0 auto;
        padding-right: 1rem;
    }
}

@media screen and (max-width:450px) {}

/*---about1--------------------------------------------------------------------------------------------------------------------------*/

.about1 {
    position: relative;
    z-index: 1;
}

.about1 .ab1 {
    position: relative;
}

.about1 .ab1:after {
    content: '';
    background: url(../../images/ab1_deco01.png) top left no-repeat;
    background-size: contain;
    width: 1775px;
    max-width: 100%;
    min-height: 1290px;
    position: absolute;
    bottom: 12rem;
    right: 0;
    z-index: -1;
}

/*ab11*/
.ab1 .ab11 {
    width: 1588px;
    max-width: 100%;
    margin: 0 auto;
    display: flex;
}

.ab11 .ab11_lt {
    width: 67%;
}

.ab11 .ab11_rt {
    width: 35%;
    padding-top: 6.2rem;
    margin-left: -13rem;
}

.ab11_rt .ab11_txt {
    width: 65%;
    margin: 0 0 0 auto;
    padding: 5.2rem 2.5rem 0 0;
}

.ab11_txt h5 {
    font-size: 22px;
    color: #293241;
    font-weight: bold;
    padding-bottom: 3.8rem;
}

.ab11_txt p {
    font-size: 16px;
    color: #293241;
    font-weight: 400;
    text-align: justify;
}

.ab11_txt p:nth-of-type(1) {
    padding-bottom: 2.4rem;
}

/*ab12*/
.ab1 .ab12 {
    width: 1368px;
    max-width: 100%;
    margin: -16.5rem auto 0;
    display: flex;
    justify-content: flex-end;
}

.ab12 .ab12_lt {
    margin-right: 5.7rem;
    padding-top: 18.3rem;
}

.ab12 .ab12_lt img {}

.ab12 .ab12_rt {
    width: 49%;
    padding-left: 5.2rem;
    position: relative;
}

.ab12 .ab12_rt:after {
    content: '';
    background: url(../../images/ab12_deco01.png) top left no-repeat;
    background-size: contain;
    width: 322px;
    max-width: 100%;
    min-height: 64px;
    position: absolute;
    bottom: 5.2rem;
    left: -11.5rem;
}

.ab12 .ab12_rt img {}

.ab12_rt .ab12_txt {
    width: 65%;
    margin: 3.8rem 0 0 auto;
}

.ab12_rt .ab12_txt p {
    font-size: 16px;
    color: #293241;
    text-align: justify;
    letter-spacing: 1px;
}

.ab12_rt .ab12_txt p:nth-child(1) {
    padding-bottom: 2.4rem;
}

/*ab13*/
.ab1 .ab13 {
    display: flex;
    justify-content: space-between;
    padding-top: 6rem;
}

.ab13 .ab13_lt {
    width: 51%;
    padding: 7.3rem 0 0 27.6rem;
    position: relative;
}

.ab13 .ab13_lt:after {
    content: '';
    background: url(../../images/ab13_deco01.png) top left no-repeat;
    background-size: contain;
    width: 971px;
    max-width: 100%;
    min-height: 55px;
    position: absolute;
    bottom: 20rem;
    left: 0;
}

.ab13 .ab13_rt {}

@media screen and (max-width:1800px) {
    .ab13 .ab13_lt:after {
        bottom: 22rem;
    }
}

@media screen and (max-width:1600px) {
    .ab13 .ab13_lt {
        padding: 7.3rem 0 0 10.6rem;
    }

    .ab13 .ab13_lt:after {
        bottom: 16rem;
    }
}

@media screen and (max-width:1530px) {
    .ab11_rt .ab11_txt {
        width: 75%;
    }

    .ab13 .ab13_lt:after {
        bottom: 17rem;
    }
}

@media screen and (max-width:1490px) {
    .ab1 .ab12 {
        margin: -10.5rem auto 0;
    }

    .ab13 .ab13_lt:after {
        bottom: 18rem;
    }
}

@media screen and (max-width:1400px) {
    .ab13 .ab13_lt {
        padding: 7.3rem 0 0 4.6rem;
    }

    .ab13 .ab13_lt:after {
        bottom: 16rem;
    }
}

@media screen and (max-width:1320px) {
    .ab1 .ab12 {
        margin: -4.5rem auto 0;
    }

    .ab13 .ab13_lt:after {
        bottom: 17rem;
    }
}

@media screen and (max-width:1220px) {
    .about1 .ab1:after {
        min-height: 1090px;
        bottom: -16rem;
    }

    .ab11 .ab11_rt {
        width: 42%;
    }

    .ab12 .ab12_rt {
        padding-left: 1.2rem;
    }

    .ab12 .ab12_rt:after {
        background-size: 70%;
    }

    .ab12_rt .ab12_txt {
        width: 80%;
    }

    .ab13 .ab13_lt:after {
        bottom: 18rem;
    }
}

@media screen and (max-width:1170px) {
    .about1 .ab1:after {
        min-height: 720px;
        bottom: 24rem;
    }

    .ab1 .ab11 {}

    .ab11 .ab11_lt {
        width: 100%;
        text-align: center;
    }

    .ab11 .ab11_rt {
        width: 100%;
        margin: -4rem auto 0;
        padding: 0;
        text-align: center;
    }

    .ab11_rt .ab11_txt {
        width: 90%;
        margin: 0 auto;
        text-align: left;
        padding: 5.2rem 0 0 0;
    }

    .ab1 .ab12 {
        margin: 0 auto;
    }

    .ab12 .ab12_lt {
        width: 100%;
        margin: 6rem auto 0;
        padding: 0;
        text-align: center;
    }

    .ab12 .ab12_rt {
        padding: 0;
        width: 100%;
        text-align: center;
    }

    .ab12_rt .ab12_txt {
        width: 93%;
        margin: 2rem auto 0;
    }

    .ab12 .ab12_rt:after {
        background-size: 100%;
        bottom: 14rem;
        left: -7.5rem;
    }

    .ab1 .ab13 {
        justify-content: flex-end;
        padding: 6rem 0 10rem 0;
    }

    .ab13 .ab13_lt {
        padding: 0;
        width: 100%;
        text-align: center;
    }

    .ab13 .ab13_lt:after {
        bottom: -6rem;
        width: 80%;
    }

}

@media screen and (max-width:1100px) {
    .ab1 .ab11 {
        flex-wrap: wrap;
    }

    .ab11_rt .ab11_txt {
        width: 49%;
    }

    .ab1 .ab12 {
        flex-wrap: wrap;
    }

    .ab12 .ab12_lt {
        margin: 6rem auto 3rem;
    }

    .ab12_rt .ab12_txt {
        width: 53%;
        margin: 5rem auto 0;
    }

    .ab12 .ab12_rt:after {
        bottom: 15rem;
        left: 19.5rem;
    }

    .ab1 .ab13 {
        padding: 6rem 0 10rem 0;
        flex-wrap: wrap;
    }

    .ab13 .ab13_lt:after {
        width: 82%;
    }

    .ab13 .ab13_rt {
        padding-top: 2rem;
    }
}

@media screen and (max-width:991px) {
    .ab11_rt .ab11_txt {
        width: 55%;
    }

    .ab12_rt .ab12_txt {
        width: 60%;
    }

    .ab12 .ab12_rt:after {
        left: 15.5rem;
    }

    .ab13 .ab13_lt:after {
        width: 85%;
    }

}

@media screen and (max-width:834px) {
    .ab11_rt .ab11_txt {
        width: 65%;
    }

    .ab12_rt .ab12_txt {
        width: 70%;
    }

    .ab13 .ab13_lt:after {
        width: 92%;
    }

    .ab13 .ab13_rt {
        padding-top: 2rem;
    }
}

@media screen and (max-width:768px) {
    .about1 .ab1:after {
        min-height: 500px;
        bottom: 19rem;
    }

    .ab11 .ab11_rt {
        margin: -5rem auto 0;
    }

    .ab11_rt .ab11_txt {
        width: 70%;
    }

    .ab12 .ab12_rt:after {
        left: 5.5rem;
    }

    .ab12_rt .ab12_txt {
        width: 75%;
    }

    .ab1 .ab13 {
        padding: 3rem 0 10rem 0;
    }

    .ab13 .ab13_lt:after {
        width: 95%;
    }
}

@media screen and (max-width:650px) {
    .ab11_rt .ab11_txt {
        width: 82%;
        padding: 2.2rem 0 0 0;
    }

    .ab12_rt .ab12_txt {
        width: 90%;
    }

    .ab12 .ab12_rt:after {
        left: 0;
    }

    .ab13 .ab13_lt {
        padding: 0 1rem 0 6rem;
    }

    .ab13 .ab13_lt:after {
        width: 98%;
    }
}

@media screen and (max-width:576px) {

    .ab11 .ab11_rt {
        margin: -3rem auto 0;
        padding: 0 6rem;
    }

    .ab11_rt .ab11_txt {
        width: 95%;
    }

    .ab12 .ab12_rt {
        padding: 0 2rem;
    }

    .ab1 .ab13 {
        padding: 3rem 0 14rem 0;
    }

    .ab13 .ab13_lt {
        padding: 0 1rem 0 3rem;
    }
}

@media screen and (max-width:450px) {
    .about1 .ab1:after {
        min-height: 400px;
        bottom: 6rem;
    }

    .ab12 .ab12_rt:after {
        bottom: 21rem;
    }

    .ab12 .ab12_lt {
        padding: 0 1rem 0 3rem;
    }
}

@media screen and (max-width:414px) {
    .about1 .ab1:after {
        min-height: 300px;
        bottom: 12rem;
    }

    .ab11 .ab11_rt {
        padding: 0 4rem;
    }

    .ab11_txt h5 {
        padding-bottom: 1.8rem;
    }

    .ab11_txt p:nth-of-type(1) {
        padding-bottom: 1.4rem;
    }

    .ab12 .ab12_lt {
        margin: 4rem auto 0;
    }

    .ab1 .ab12 {
        margin: 2rem auto 0;
    }

    .ab12 .ab12_rt {
        padding: 0 1rem;
    }

    .ab12_rt .ab12_txt p:nth-child(1) {
        padding-bottom: 1.4rem;
    }

    .ab12 .ab12_rt:after {
        background-size: 90%;
        bottom: 20rem;
    }

    .ab1 .ab13 {
        padding: 3rem 0 16rem 0;
    }
}

@media screen and (max-width:390px) {
    .about1 .ab1:after {
        bottom: 8rem;
    }

    .ab11 .ab11_rt {
        margin: -2rem auto 0;
    }
}

@media screen and (max-width:360px) {
    .about1 .ab1:after {
        bottom: 4rem;
    }

    .ab12_rt .ab12_txt {
        margin: 4rem auto 0;
    }

    .ab12 .ab12_rt:after {
        background-size: 75%;
        bottom: 18rem;
    }

    .ab13 .ab13_rt {
        padding-top: 1rem;
    }
}

@media screen and (max-width:330px) {
    .ab11 .ab11_rt {
        padding: 0 3rem;
    }

    .ab12 .ab12_lt {
        padding: 0 1rem 0 2rem;
    }

    .ab12_rt .ab12_txt {
        margin: 3rem auto 0;
    }

    .ab12 .ab12_rt:after {
        background-size: 65%;
        bottom: 17rem;
    }

    .ab1 .ab13 {
        padding: 3rem 0 17rem 0;
    }

    .ab13 .ab13_lt {
        padding: 0 1rem 0 2rem;
    }
}

@media screen and (max-width:310px) {
    .about1 .ab1:after {
        bottom: 1rem;
    }

    .ab11 .ab11_rt {
        padding: 0 2rem;
    }

    .ab12 .ab12_rt:after {
        bottom: 20rem;
    }
}

/*---about2--------------------------------------------------------------------------------------------------------------------------*/
.about2 {
    background: url(../../images/ab2_bg.png) top left no-repeat;
    background-size: contain;
    width: 100%;
    margin: -16rem 0 0 0;
    padding-bottom: 3rem;

}

.about2 .ab2 {
    width: 1368px;
    max-width: 100%;
    margin: 0 auto;
    padding-top: 11rem;
}

/*ab21*/
.ab2 .ab21 {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.ab21 .ab21_lt {
    width: 43%;
    text-align: right;
}

.ab21 .ab21_rt {
    width: 50%;
    text-align: center;
    padding: 0 16rem;
}

.ab21 .ab21_rt p {
    font-size: 22px;
    font-weight: bold;
    text-align: left;
}

/*ab22*/
.ab2 .ab22 {
    padding-top: 5rem;
    display: flex;
    position: relative;
    z-index: 1;
}

.ab22 .ab22_lt {
    width: 32%;
    padding-left: 7.5rem;
}

.ab22 .ab22_lt h5 {
    font-size: 16px;
    padding-bottom: 3rem;
    font-weight: bold;
    line-height: 2;
}

.ab22 .ab22_lt ul {
    padding-left: 3.5rem;
}

.ab22 .ab22_lt ul li {
    padding-left: 3rem;
    font-weight: bold;
    font-size: 16px;
    position: relative;
}

.ab22 .ab22_lt ul li:before {
    content: url(../../images/mark.svg);
    width: 16px;
    max-width: 100%;
    min-height: 16px;
    position: absolute;
    left: 0;
    top: 3px;
}

.ab22 .ab22_rt {
    width: 66%;
    margin-left: -3.5rem;
}

/*ab23*/
.ab23 {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    margin-top: -14rem;
}

.ab23 .ab23_lt {
    width: 32%;
    text-align: right;
}

.ab23 .ab23_rt {
    width: 66%;
}

/*ab24*/
.ab24 {
    padding-top: 6.7rem;
    display: flex;
    justify-content: space-between;
}

.ab24 .ab24_lt {
    width: 24%;
    text-align: right;
    padding-top: 4.9rem;

}

.ab24_lt .ab24_txt {
    padding: 0 0 5rem 7.4rem;
    text-align: left;
}

.ab24_lt .ab24_txt h5 {
    font-size: 16px;
    padding-bottom: 3rem;
    font-weight: bold;
    line-height: 2;

}

.ab24_lt .ab24_txt ul {
    padding-left: 3.5rem;
}

.ab24_lt .ab24_txt ul li {
    padding-left: 3rem;
    font-weight: bold;
    font-size: 16px;
    position: relative;
}

.ab24_lt .ab24_txt ul li:before {
    content: url(../../images/mark.svg);
    width: 16px;
    max-width: 100%;
    min-height: 16px;
    position: absolute;
    left: 0;
    top: 3px;
}

.ab24 .ab24_rt {
    width: 74.5%;
}

@media screen and (max-width:1700px) {
    .about2 {
        margin: -14rem 0 0 0;
    }
}

@media screen and (max-width:1400px) {
    .about2 {
        margin: -12rem 0 0 0;
    }
}

@media screen and (max-width:1280px) {
    .ab23 {
        margin-top: -16rem;
    }
}

@media screen and (max-width:1160px) {
    .about2 {
        margin: -16rem 0 0 0;
    }

    .ab21 .ab21_rt {
        width: 60%;
    }

    .ab24 {
        padding-top: 3.7rem;
    }

    .ab24 .ab24_lt {
        padding-top: 1.9rem;
    }
}

@media screen and (max-width:1100px) {
    .about2 {
        margin: -26rem 0 0 0;
    }

    .about2 .ab2 {
        padding-top: 17rem;
    }

    .ab2 .ab21 {
        justify-content: center;
        flex-wrap: wrap;
    }

    .ab21 .ab21_rt {
        width: 63%;
        padding: 3rem 16rem 0;
    }

    .ab2 .ab22 {
        flex-wrap: wrap;
        justify-content: center;
    }

    .ab22 .ab22_lt {
        width: 37%;
        padding: 0 0 3rem 0;
    }

    .ab22 .ab22_rt {
        width: 100%;
        margin-left: 0;
        text-align: center;
    }

    .ab23 {
        margin-top: 2rem;
        flex-wrap: wrap;
        justify-content: center;
    }

    .ab23 .ab23_lt {
        width: 68%;
        text-align: left;
    }

    .ab23 .ab23_rt {
        width: 95%;
        margin-top: 2rem;
    }

    .ab24 {
        flex-wrap: wrap;
        justify-content: center;
    }

    .ab24 .ab24_lt {
        padding-top: 1.9rem;
        width: 74%;
    }

    .ab24 .ab24_rt {
        width: 100%;
        padding-top: 2rem;
    }
}

@media screen and (max-width:991px) {
    .ab21 .ab21_rt {
        width: 70%;
    }

    .ab23 .ab23_lt {
        width: 75%;
    }

    .ab24 .ab24_lt {
        width: 100%;
    }

    .ab24_lt .ab24_txt {
        padding: 0 0 5rem 19.4rem;
    }
}

@media screen and (max-width:834px) {
    .about2 {
        margin: -22rem 0 0 0;
    }

    .ab21 .ab21_lt {
        width: 95%;
        text-align: center;
    }

    .ab21 .ab21_rt {
        width: 96%;
    }

    .ab22 .ab22_lt {
        width: 57%;
    }

    .ab23 .ab23_lt {
        width: 85%;
    }
}

@media screen and (max-width:768px) {
    .about2 {
        background-size: cover;
        background-position: top center;
        padding-bottom: 1rem;
    }

    .about2 .ab2 {
        padding-top: 13rem;
    }

    .ab21 .ab21_rt {
        width: 100%;
    }

    .ab22 .ab22_rt {
        padding: 0 2rem;
    }

    .ab23 .ab23_lt {
        width: 81%;
    }
}

@media screen and (max-width:576px) {
    .ab21 .ab21_rt {
        padding: 3rem 12rem 0;
    }
}

@media screen and (max-width:450px) {

    .about2 .ab2 {
        padding-top: 8rem;
    }

    .ab22 .ab22_lt {
        width: 77%;
    }

    .ab21 .ab21_rt {
        padding: 3rem 5rem 0;
    }

    .ab22 .ab22_rt {
        padding: 0 1rem;
    }

    .ab24_lt .ab24_txt {
        padding: 0 0 5rem 9.4rem;
    }
}

@media screen and (max-width:390px) {
    .ab21 .ab21_rt {
        padding: 3rem 4rem 0;
    }

    .ab24_lt .ab24_txt {
        padding: 0 0 5rem 5.4rem;
    }
}

@media screen and (max-width:340px) {
    .ab21 .ab21_rt {
        padding: 3rem 2rem 0;
    }

    .ab22 .ab22_lt {
        width: 86%;
    }

    .ab24_lt .ab24_txt {
        padding: 0 0 5rem 2rem;
    }
}

@media screen and (max-width:300px) {
    .ab21 .ab21_rt {
        padding: 2rem 1rem 0;
    }

    .ab2 .ab22 {
        padding-top: 3rem;
    }

    .ab22 .ab22_lt {
        width: 90%;
    }
}

/*---about3--------------------------------------------------------------------------------------------------------------------------*/
.about3 {}

.about3 .ab31 {
    position: relative;
}

.ab31_deco img:nth-child(1) {
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: 1;
}

.ab31_deco img:nth-child(2) {
    position: absolute;
    bottom: 0;
    right: 0;
    z-index: 1;
}

.ab31_deco img:nth-child(3) {
    position: absolute;
    bottom: 1.7rem;
    right: 4.7rem;
    z-index: 1;
}

.scale_img {
    overflow: hidden;
}

.scale_img img {
    position: relative;
    clip: rect(0, 0, 0, 0);
}


@media screen and (max-width:991px) {
    .ab31_deco img:nth-child(1) {
        width: 20%;
    }

    .ab31_deco img:nth-child(2) {
        width: 30%;
    }

    .ab31_deco img:nth-child(3) {
        width: 30%;
    }
}

/*---about4--------------------------------------------------------------------------------------------------------------------------*/

.about4 {}

.about4 .ab4 {
    padding: 11rem 0 12.6rem;
    position: relative;
}

.about4 .ab4:after {
    content: '';
    background: url(../../images/ab4_deco01.png) top left no-repeat;
    background-size: contain;
    width: 1065px;
    max-width: 100%;
    min-height: 713px;
    position: absolute;
    bottom: -17rem;
    right: 0;
    z-index: -1;
}

/*ab41*/
.ab4 .ab41 {
    width: 1368px;
    max-width: 100%;
    margin: 0 auto;
    display: flex;
    align-items: center;
}

.ab41 .ab41_lt {
    width: 51%;
}

.ab41 .ab41_rt {
    width: 50%;
    text-align: center;
    padding: 0 16rem;
}

.ab41 .ab41_rt p {
    font-size: 22px;
    font-weight: bold;
    text-align: left;
}

/*ab42*/
.ab4 .ab42 {
    width: 1368px;
    max-width: 100%;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    padding-top: 5.5rem;
}

.ab42 .ab42_lt {
    width: 41%;
    padding: 0 15.9rem 0 7.5rem;
}

.ab42 .ab42_lt p {
    text-align: justify;
    font-weight: bold;
    letter-spacing: 1px;
}

.ab42 .ab42_rt {}

/*ab43*/
.ab4 .ab43 {
    width: 1662px;
    max-width: 100%;
    margin: -42rem auto 0;
}

@media screen and (max-width:1600px) {
    .ab4 .ab43 img {
        width: 40%;
    }
}

@media screen and (max-width:1300px) {
    .about4 .ab4:after {
        background-size: 80%;
        background-position: bottom right;
    }

    .ab42 .ab42_lt {
        padding: 0 7.9rem 0 7.5rem;
    }

    .ab4 .ab43 img {
        width: 35%;
    }
}

@media screen and (max-width:1200px) {
    .ab4 .ab43 {
        margin: -30rem auto 0;
    }
}

@media screen and (max-width:1070px) {
    .ab41 .ab41_rt {
        width: 60%;
        padding: 0 12rem;
    }
}

@media screen and (max-width:991px) {
    .about4 .ab4 {
        padding: 11rem 0 6.6rem;
    }

    .ab4 .ab41 {
        flex-wrap: wrap;
        justify-content: center;
    }

    .ab41 .ab41_lt {
        width: 90%;
        text-align: center;
    }

    .ab41 .ab41_rt {
        width: 90%;
        padding: 4rem 12rem 0;
    }

    .ab4 .ab42 {
        justify-content: center;
        flex-wrap: wrap;
        padding-top: 2.5rem;
    }

    .ab42 .ab42_lt {
        padding: 0 7.9rem 5rem 7.5rem;
        width: 81%;
    }

    .ab4 .ab43 {
        margin: 0 auto;
    }

    .ab4 .ab43 img {
        width: 85%;
    }

    .about4 .ab4:after {
        background-size: 90%;
        bottom: 22rem;
    }
}

@media screen and (max-width:834px) {
    .about4 .ab4:after {
        bottom: 21rem;
    }

    .about4 .ab4 {
        padding: 7rem 0 6.6rem;
    }

    .ab41 .ab41_rt {
        width: 100%;
    }

    .ab42 .ab42_lt {
        width: 90%;
    }
}

@media screen and (max-width:768px) {
    .about4 .ab4 {
        padding: 7rem 0 4.6rem;
    }

    .about4 .ab4:after {
        bottom: 17rem;
    }

    .ab41 .ab41_rt {
        padding: 4rem 8rem 0;
    }

    .ab42 .ab42_lt {
        width: 100%;
    }

    .ab42 .ab42_rt {
        padding: 0 6rem;
    }
}

@media screen and (max-width:450px) {
    .about4 .ab4 {
        padding: 7rem 0 2.6rem;
    }

    .about4 .ab4:after {
        bottom: 10rem;
        min-height: 270px;
    }

    .ab41 .ab41_rt {
        padding: 4rem 4rem 0;
    }

    .ab42 .ab42_lt {
        padding: 0 4.9rem 5rem 4.5rem;
    }

    .ab42 .ab42_rt {
        padding: 0 5rem;
    }
}

@media screen and (max-width:414px) {
    .about4 .ab4 {
        padding: 5rem 0 2.6rem;
    }

    .about4 .ab4:after {
        bottom: 9rem;
        min-height: 230px;
    }

    .ab41 .ab41_rt {
        padding: 2rem 4rem 0;
    }

    .ab42 .ab42_lt {
        padding: 0 3.9rem 3rem 4rem;
    }

    .ab42 .ab42_rt {
        padding: 0 4rem;
    }
}

@media screen and (max-width:360px) {
    .about4 .ab4:after {
        bottom: 8rem;
        min-height: 200px;
    }
}

@media screen and (max-width:330px) {
    .ab41 .ab41_rt {
        padding: 2rem 3rem 0;
    }

    .ab42 .ab42_lt {
        padding: 0 2.9rem 3rem 3rem;
    }

    .ab42 .ab42_rt {
        padding: 0 3rem;
    }
}

@media screen and (max-width:300px) {
    .about4 .ab4:after {
        bottom: 7rem;
    }
}

/*---enviroment1--------------------------------------------------------------------------------------------------------------------------*/
.enviroment1 {
    position: relative;
}

.enviroment1 .env1 {}

/*env11*/
.env1 .env11 {
    width: 1392px;
    max-width: 100%;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.env11 .env11_lt {
    width: 49%;
}

.env11 .env11_rt {
    width: 50%;
    padding-left: 14rem;
}

.env11 .env11_rt p {
    font-size: 22px;
    font-weight: bold;
}

/*env12*/
.env1 .env12 {
    width: 1368px;
    max-width: 100%;
    margin: 5.3rem auto 0;
    display: flex;
    justify-content: space-between;
    position: relative;
    z-index: 1;
}

.env12 .env12_lt {
    width: 24%;
    padding: 0 6.5rem;
}

.env12 .env12_lt p {
    font-size: 16px;
    font-weight: bold;
}

.env12 .env12_rt {
    width: 58%;
    -webkit-filter: drop-shadow(2px 2px 10px rgba(48, 53, 57, 0.35));
    filter: drop-shadow(2px 2px 10px rgba(48, 53, 57, 0.35));
}

/*env13*/
.env1 .env13 {
    background: url(../../images/env13_bg.jpg) top center fixed;
    background-size: cover;
    width: 100%;
    min-height: 1004px;
    position: relative;
    clip-path: polygon(0 0, 100% 15%, 100% 100%, 0 85%);
    margin-top: -21rem;
}

.env1 .env13:before {
    content: '';
    background: url(../../images/env13_deco01.png) bottom left no-repeat;
    background-size: contain;
    width: 333px;
    max-width: 100%;
    min-height: 368px;
    position: absolute;
    bottom: 0;
    left: 0;
}

.env1 .env13:after {
    content: '';
    background: url(../../images/env13_deco02.png) bottom right no-repeat;
    background-size: contain;
    width: 438px;
    max-width: 100%;
    min-height: 251px;
    position: absolute;
    bottom: 0;
    right: 0;
}

@media screen and (max-width:1330px) {
    .env12 .env12_lt {
        width: 35%;
    }
}

@media screen and (max-width:991px) {
    .env1 .env13 {
        min-height: 660px;
    }
}

@media screen and (max-width:910px) {
    .env12 .env12_lt {
        width: 40%;
        padding: 0 2.5rem;
    }
}

@media screen and (max-width:768px) {
    .env1 .env13 {
        min-height: 400px;
        background-attachment: inherit;
        margin-top: 3rem;
    }

    .env1 .env13:before {
        background-size: 50%;
        min-height: 190px;
    }

    .env1 .env13:after {
        background-size: 50%;
        min-height: 138px;
    }
}

@media screen and (max-width:650px) {
    .env1 .env11 {
        flex-wrap: wrap;
        justify-content: center;
    }

    .env11 .env11_lt {
        width: 90%;
    }

    .env11 .env11_rt {
        width: 90%;
        padding-left: 2rem;
    }

    .env1 .env12 {
        flex-wrap: wrap;
        justify-content: center;
        margin: 2.3rem auto 0;
    }

    .env12 .env12_lt {
        width: 90%;
    }

    .env12 .env12_rt {
        width: 83%;
        margin-top: 3rem;
    }
}

@media screen and (max-width:576px) {
    .env1 .env13 {
        min-height: 300px;
    }

    .env1 .env13:before {
        background-size: 46%;
        min-height: 150px;
        max-width: 50%;
    }

    .env1 .env13:after {
        background-size: 60%;
        min-height: 108px;
        max-width: 50%;
    }
}

@media screen and (max-width:450px) {
    .env12 .env12_lt {
        padding: 0 2rem;
    }
}

@media screen and (max-width:414px) {
    .env11 .env11_rt {
        padding-left: 1.5rem;
    }

    .env12 .env12_lt {
        padding: 0 1.5rem;
    }

    .env1 .env13 {
        min-height: 220px;
    }
}

@media screen and (max-width:390px) {
    .env1 .env13 {
        min-height: 200px;
    }
}

@media screen and (max-width:360px) {
    .env1 .env13 {
        min-height: 190px;
    }
}

@media screen and (max-width:340px) {
    .env11 .env11_rt {
        padding-left: 1rem;
    }

    .env12 .env12_lt {
        padding: 0 1rem;
    }

    .env1 .env13 {
        min-height: 170px;
    }
}

/*---enviroment2--------------------------------------------------------------------------------------------------------------------------*/

.enviroment2 {}

.enviroment2 .env2 {}

.env2 .env21 {
    width: 1368px;
    max-width: 100%;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    position: relative;
}

.env21 .env21_lt {
    width: 43%;
    position: relative;
    z-index: 1;
}

.env21 .env21_lt p {
    padding: 15.2rem 0 0 2.8rem;
    font-weight: bold;
}

.env21 .env21_rt {
    width: 66%;
    margin-left: -12rem;
}

.env21 .env21_deco02 {
    position: absolute;
    bottom: 0;
    left: 0;
}

.env2 .env22 {
    width: 1368px;
    max-width: 100%;
    margin: 3.8rem auto 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.env22 .env22_lt {
    width: 74.5%;
}

.env22_lt ul {
    display: flex;
    justify-content: space-between;
}

.env22_lt ul li {
    width: 32%;
}

.env22 .env22_rt {
    width: 25%;
    padding-left: 6.3rem;
}

.env22 .env22_rt p {
    font-size: 22px;
    font-weight: bold;
}

.env22 .env22_rt span {
    font-size: 16px;
    color: #293241;
    font-family: 'Amiri';
    letter-spacing: 0px;
}

@media screen and (max-width:991px) {
    .env21 .env21_lt p {
        padding: 9.2rem 0 0 2.8rem;
    }
}

@media screen and (max-width:850px) {
    .env22 .env22_rt {
        padding-left: 2.3rem;
    }
}

@media screen and (max-width:768px) {
    .env2 .env21 {
        flex-wrap: wrap;
        justify-content: center;
    }

    .env21 .env21_lt {
        width: 90%;
    }

    .env21 .env21_lt p {
        padding: 2.2rem 0 0 0;
    }

    .env21 .env21_rt {
        width: 90%;
        margin: 5rem auto 3rem;
    }

    .env21 .env21_deco02 {
        position: relative;
    }

    .env2 .env22 {
        flex-wrap: wrap;
        justify-content: center;
    }

    .env22 .env22_lt {
        width: 90%;
    }

    .env22 .env22_rt {
        width: 90%;
        padding: 5rem 15rem;
    }
}

@media screen and (max-width:600px) {
    .env21 .env21_rt {
        margin: 3rem auto 3rem;
    }

    .env21 .env21_deco02 {
        width: 90%;
    }

    .env22 .env22_rt {
        padding: 5rem 7rem;
    }
}

@media screen and (max-width:450px) {
    .env21 .env21_rt {
        margin: 3rem auto 2rem;
    }
}

@media screen and (max-width:414px) {
    .env22 .env22_rt {
        padding: 3rem 5rem;
    }
}

@media screen and (max-width:370px) {
    .env22 .env22_rt {
        padding: 3rem 3rem;
    }
}

@media screen and (max-width:330px) {
    .env22 .env22_rt {
        padding: 3rem 1rem;
    }
}

/*---enviroment3--------------------------------------------------------------------------------------------------------------------------*/
.enviroment3 {}

.enviroment3 .env3 {
    background: url(../../images/env3_bg01.png) top right no-repeat, url(../../images/env3_bg02.jpg) top left repeat;
    background-size: contain;
    width: 100%;
    min-height: 727px;
    margin-top: 25.6rem;

}

.env3 .env3_inner {
    width: 1644px;
    max-width: 100%;
    display: flex;
    justify-content: space-between;
}

.env3_inner .env3_lt {
    width: 71.7%;
    margin-top: -11.7rem;
}

.env3_inner .env3_rt {
    width: 27%;
    padding-top: 10.2rem;
}

.env3_inner .env3_rt img {}

.env3_inner .env3_rt p {
    padding-top: 7.6rem;
    font-weight: bold;
}

@media screen and (max-width:1300px) {
    .enviroment3 .env3 {
        margin-top: 18rem;
        min-height: 620px;
    }

    .env3_inner .env3_lt {
        margin-top: -5.7rem;
    }
}

@media screen and (max-width:991px) {
    .enviroment3 .env3 {
        margin-top: 12rem;
        min-height: 470px;
    }

    .env3_inner .env3_rt p {
        padding-top: 2.6rem;
    }
}

@media screen and (max-width:834px) {
    .enviroment3 .env3 {
        min-height: 400px;
    }

    .env3_inner .env3_rt p {
        padding-top: 2.6rem;
    }
}

@media screen and (max-width:768px) {
    .enviroment3 {
        padding-bottom: 10rem;
    }

    .enviroment3 .env3 {
        margin-top: 0;
        background-size: cover, contain;
    }

    .env3 .env3_inner {
        flex-wrap: wrap;
        flex-direction: column-reverse;
    }

    .env3_inner .env3_lt {
        margin: 0 0 -10rem 0;
        width: 100%;
    }

    .env3_inner .env3_rt {
        width: 90%;
        padding-top: 7rem;
        margin: 0 auto;
        text-align: center;
    }

    .env3_inner .env3_rt p {
        padding: 2.6rem 19rem 3rem;
        text-align: left;
    }
}

@media screen and (max-width:640px) {
    .env3_inner .env3_rt p {
        padding: 2.6rem 14rem 3rem;
    }
}

@media screen and (max-width:530px) {
    .enviroment3 {
        padding-bottom: 6rem;
    }

    .enviroment3 .env3 {
        min-height: 720px;
    }

    .env3_inner .env3_rt p {
        padding: 2.6rem 9rem 3rem;
    }
}

@media screen and (max-width:450px) {
    .enviroment3 .env3 {
        min-height: 660px;
    }

    .env3_inner .env3_rt p {
        padding: 2rem 8rem 3rem;
    }
}

@media screen and (max-width:414px) {
    .enviroment3 {
        padding-bottom: 6rem;
    }

    .enviroment3 .env3 {
        min-height: 630px;
    }

    .env3_inner .env3_rt {
        padding-top: 5rem;
    }
}

@media screen and (max-width:390px) {
    .enviroment3 {
        padding-bottom: 8rem;
    }

    .enviroment3 .env3 {
        min-height: 580px;
    }

    .env3_inner .env3_rt {
        padding-top: 4rem;
    }

    .env3_inner .env3_rt p {
        padding: 2rem 6rem 3rem;
    }
}

@media screen and (max-width:360px) {
    .enviroment3 .env3 {
        min-height: 560px;
    }

    .env3_inner .env3_rt p {
        padding: 2rem 4rem 3rem;
    }
}

@media screen and (max-width:340px) {
    .enviroment3 {
        padding-bottom: 5rem;
    }
}

@media screen and (max-width:320px) {
    .enviroment3 .env3 {
        min-height: 540px;
    }
}

@media screen and (max-width:300px) {
    .enviroment3 {
        padding-bottom: 5rem;
    }

    .enviroment3 .env3 {
        min-height: 520px;
    }

    .env3_inner .env3_rt p {
        padding: 2rem 2rem 3rem;
    }
}

/*---enviroment4--------------------------------------------------------------------------------------------------------------------------*/
.enviroment4 {}

.enviroment4 .env4 {
    background: url(../../images/env4_bg01.png) top left no-repeat, url(../../images/env3_bg02.jpg) top left repeat;
    background-size: contain;
    width: 100%;
    min-height: 727px;
    margin-top: 18.8rem;

}

.env4 .env4_inner {
    width: 1644px;
    max-width: 100%;
    margin: 0 0 0 auto;
    display: flex;
    justify-content: flex-end;
}

.env4_inner .env4_lt {
    width: 27%;
    padding-top: 10.2rem;
}

.env4_inner .env4_rt {
    width: 71.7%;
    margin-top: -11.7rem;

}

.env4_inner .env4_lt img {}

.env4_inner .env4_lt p {
    padding: 6.5rem 0 0 11.6rem;
    font-weight: bold;
}

@media screen and (max-width:1300px) {
    .enviroment4 .env4 {
        margin-top: 18rem;
        min-height: 620px;
    }

    .env4_inner .env4_rt {
        margin-top: -5.7rem;
    }

    .env4_inner .env4_lt p {
        padding: 6.5rem 0 0 5.6rem;
    }
}

@media screen and (max-width:991px) {
    .enviroment4 .env4 {
        margin-top: 12rem;
        min-height: 470px;
    }

    .env4_inner .env4_lt p {
        padding: 6.5rem 0 0 3.6rem;
    }
}

@media screen and (max-width:834px) {
    .enviroment4 .env4 {
        min-height: 400px;
    }
}

@media screen and (max-width:768px) {
    .enviroment4 {
        padding-bottom: 0;
    }

    .enviroment4 .env4 {
        margin-top: 7rem;
        background-size: cover, contain;
        min-height: 890px;
    }

    .env4 .env4_inner {
        flex-wrap: wrap;
        flex-direction: column;
    }

    .env4_inner .env4_rt {
        margin: 0 0 -10rem 0;
        width: 100%;
    }

    .env4_inner .env4_lt {
        width: 90%;
        padding-top: 7rem;
        margin: 0 auto;
        text-align: center;
    }

    .env4_inner .env4_lt p {
        padding: 2.6rem 19rem 3rem;
        text-align: left;
    }
}

@media screen and (max-width:640px) {
    .enviroment4 .env4 {
        min-height: 810px;
    }

    .env4_inner .env4_lt p {
        padding: 2.6rem 13rem 3rem;
    }
}

@media screen and (max-width:530px) {
    .enviroment4 .env4 {
        min-height: 710px;
    }

    .env4_inner .env4_lt p {
        padding: 2.6rem 8rem 3rem;
    }
}

@media screen and (max-width:450px) {
    .enviroment4 .env4 {
        min-height: 640px;
    }
}

@media screen and (max-width:414px) {
    .enviroment4 .env4 {
        min-height: 620px;
    }

    .env4_inner .env4_lt {
        padding-top: 5rem;
    }
}

@media screen and (max-width:390px) {

    .enviroment4 .env4 {
        min-height: 560px;
        margin-top: 3rem;
    }

    .env4_inner .env4_lt {
        padding-top: 4rem;
    }

    .env4_inner .env4_lt p {
        padding: 2.6rem 0rem 3rem 6rem;
    }
}

@media screen and (max-width:360px) {

    .enviroment4 .env4 {
        min-height: 530px;
    }
}

@media screen and (max-width:340px) {}

@media screen and (max-width:320px) {
    .enviroment4 .env4 {
        min-height: 490px;
    }

    .env4_inner .env4_lt p {
        padding: 2.6rem 0rem 3rem 4rem;
    }
}

/*---enviroment5--------------------------------------------------------------------------------------------------------------------------*/
.enviroment5 {
    background: url(../../images/env5_bg.png) top left no-repeat;
    background-size: cover;
    width: 100%;
    padding: 11.9rem 0 6.5rem;
}

.enviroment5 .env5 {
    width: 1368px;
    max-width: 100%;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    padding-left: 4.1rem;
}

.env5 .env5_lt {
    width: 30%;
}

.env5_lt .env5lt_top {}

.env5_lt .env5lt_bot {
    padding: 12.9rem 0 1.9rem 1.9rem;
    width: 84%;
}

.env5 .env5_rt {
    width: 68%;
    text-align: right;
    position: relative;
}

.env5_rt .env5rt_top {}

.env5_rt .env5rt_bot {
    position: absolute;
    right: 0rem;
    bottom: 1rem;
    width: 110%;
}


@media screen and (max-width:1200px) {
    .enviroment5 .env5 {
        padding-left: 2rem;
    }

    .env5_lt .env5lt_bot {
        padding: 9.9rem 0 1.9rem 1.9rem;
    }
}

@media screen and (max-width:1100px) {
    .env5_lt .env5lt_bot {
        padding: 7.9rem 0 1.9rem 1.9rem;
    }
}

@media screen and (max-width:991px) {
    .env5_lt .env5lt_bot {
        padding: 4.9rem 0 1.9rem 1.9rem;
    }
}

@media screen and (max-width:768px) {
    .enviroment5 .env5 {
        flex-wrap: wrap;
        justify-content: center;
    }
}

@media screen and (max-width:768px) {
    .enviroment5 {
        background-position: top right;
    }

    .enviroment5 .env5 {
        padding-left: 0;
    }

    .env5 .env5_lt {
        width: 90%;
        text-align: center;
    }

    .env5_lt .env5lt_top {
        width: 60%;
        text-align: center;
        margin: 0 auto;
    }

    .env5_lt .env5lt_bot {
        padding: 4rem 0 1.9rem;
        width: 60%;
        margin: 0 auto;
    }

    .env5 .env5_rt {
        width: 100%;
        text-align: center;
    }

    .env5_rt .env5rt_top {
        padding: 0 2rem;
    }

    .env5_rt .env5rt_bot {
        position: relative;
        right: 0;
        bottom: 0;
        width: 100%;
        margin: 3rem 0 0;
    }
}

@media screen and (max-width:576px) {
    .env5_lt .env5lt_bot {
        width: 90%;
    }
}

@media screen and (max-width:414px) {
    .enviroment5 {
        padding: 8.9rem 0 6.5rem;
    }
}

@media screen and (max-width:320px) {
    .env5_lt .env5lt_top {
        width: 70%;
    }
}

@media screen and (max-width:300px) {
    .env5_lt .env5lt_bot {
        width: 100%;
    }

    .env5_rt .env5rt_top {
        padding: 0 1rem;
    }
}

/*---news------------------------------------------------------------------------------------------------*/

.news {
    position: relative;
    padding-bottom: 5rem;
}

.news .newslist {
    width: 1368px;
    max-width: 100%;
    margin: 0 auto;
}

.news .newslist_rwd {
    display: inline-block;
    width: 33%;
    margin-bottom: 3rem;
}

.newslist_rwd a:hover .npic {
    transform: translateY(-5px);
    -webkit-filter: drop-shadow(8px 9px 9px rgba(0, 0, 0, 0.5));
    filter: drop-shadow(8px 9px 9px rgba(0, 0, 0, 0.5));
}

.newslist_rwd .ntitle {
    margin-top: 2.3rem;
    width: 97%;
}

.newslist_rwd .ntitle h3 {
    font-size: 22px;
    font-weight: bold;
    margin-bottom: 2.2rem;
	line-height: 1.3;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
}
.newslist_rwd .ntitle h3 a:nth-of-type(1) {    
    line-height: 1.3;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
}
.newslist_rwd .ntitle p {
    font-size: 16px;
    line-height: 1.3;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    margin-bottom: 2.8rem;
}

.newslist_rwd .ntitle span {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    line-height: 1;
}

.newslist_rwd .ntitle span .inews_lin {
    background: #303539;
    width: 70%;
    height: 0.5px;
    display: inline-block;
    margin-right: 5%;
}

.newslist_rwd a {
    transition: .5s all;
}

.newslist_rwd a:hover {
    color: #638ba0;
}
.ripple2{
	margin-bottom:5rem;
}
/*newstable*/
.newstable {
    width: 60%;
    margin: 0 auto;
    padding: 0;
    position: relative;
    z-index: 3;
}

.newstable table {
    width: 100%;
}

table.tableimg img {
    max-width: 100%;
}

.newstable a {
    display: inline-block;
    color: #000;
    transition: .3s ease-in-out;
}

.newstable a:hover {
    color: rgba(255, 153, 0, 1);
}

img.newsicon {
    width: auto !important;
    max-width: inherit;
}

button,
html input[type=button],
input[type=reset],
input[type=submit] {
    -webkit-appearance: button;
    cursor: pointer;
    background: transparent;
    border-radius: 5px;
    padding: 0% 4%;
    transition: .3s ease-in-out;
    letter-spacing: 2px;
    margin: 0 1%;
    height: 45px;
    line-height: 45px;
}

button:hover,
html input[type=button]:hover,
input[type=reset]:hover,
input[type=submit]:hover {
    background: #dddddd;
}

@media screen and (max-width:1240px) {
    .news .newslist_rwd {
        width: 49%;
    }

    .newslist_rwd .ntitle {
        width: 75%;
        margin: 2.3rem auto 0;
        text-align: left;
    }

    .news .newslist_rwd {
        text-align: center;
    }

}

@media screen and (max-width:1100px) {
    .newslist_rwd .ntitle span .inews_lin {
        width: 60%;
    }
}

@media screen and (max-width:991px) {
    .newslist_rwd .ntitle {
        width: 90%;
    }
}

@media screen and (max-width:834px) {
    .news .newslist {
        padding: 0 1rem;
    }
}

@media screen and (max-width:768px) {
    .newstable {
        width: 80%;
    }
}

@media screen and (max-width:660px) {
    .newslist_rwd .ntitle span .inews_lin {
        width: 50%;
    }
}

@media screen and (max-width:450px) {
    .news .newslist {
        text-align: center;
    }

    .news .newslist_rwd {
        width: 95%;
    }

    .newslist_rwd .ntitle {
        width: 100%;
    }

    .newslist_rwd .ntitle span .inews_lin {
        width: 60%;
    }
}

@media screen and (max-width:430px) {
    .newstable {
        width: 90%;
    }
}

.page_num {
    width: 1248px;
    max-width: 100%;
    margin: 3rem auto 0;
}

.page_num a {
    display: inline-block;

}

.news .newslist .back a {
    display: block;
}

.tableimg .date,
.tableimg .back {
    text-align: right;
}

@media screen and (max-width:310px) {
    .newslist_rwd .ntitle span .inews_lin {
        width: 55%;
    }
}

/*---scenery---------------------------------------------------------------------------------------------*/
.scenery {
    padding: 0 3em 60px;
    position: relative;
    width: 1368px;
    max-width: 100%;
    margin: 0 auto;
}

.scebtn {
    text-align: center;
    margin-bottom: 30px;
}

.scebtn h2 {
    display: inline-block;
    margin: 5px;
    color: #fff;
    padding: 25px 5px;
    font-size: 15px;
    border-radius: 100%;
    min-width: 82px;
    border: 3px solid #e4d0bc;
    cursor: pointer;
    line-height: 24px;
}

.scebtn h2.scebtn1 {
    background: #d85a51;
}

.scebtn h2.scebtn2 {
    background: #80a076;
}

.scebtn h2.scebtn3 {
    background: #89b5cb;
}

.scebtn h2.scebtn4 {
    background: #8dcfca;
}

.scebtn h2.scebtn5 {
    background: #b7ad6f;
}

.scebtn h2.scebtn6 {
    background: #8b8583;
}

.scebtn h2:hover.scebtn1,
.scebtn h2:hover.scebtn2,
.scebtn h2:hover.scebtn3,
.scebtn h2:hover.scebtn4,
.scebtn h2:hover.scebtn5,
.scebtn h2:hover.scebtn6 {
    background: #fff;
    border: #7e6b5a 3px solid;
    color: #656565;
    -webkit-transition: all 0.5s ease 0s;
    -moz-transition: all 0.5s ease 0s;
    -o-transition: all 0.5s ease 0s;
    transition: all 0.5s ease 0s;
}

@media (max-width:650px) {
    .scebtn {
        padding: 0 120px;
    }
}

@media (max-width:600px) {
    .scebtn {
        padding: 0 100px;
    }
}

@media (max-width:550px) {
    .scebtn {
        padding: 0 60px;
    }
}

@media (max-width:480px) {
    .scebtn {
        padding: 0 25px;
    }
}

@media (max-width:400px) {
    .scebtn {
        padding: 0 5px;
    }

    .scebtn {
        margin-bottom: 10px;
    }
}

@media (max-width:350px) {
    .scebtn {
        padding: 0 0px;
    }
}

/***********/

.scebox {
    border: #c3c3c3 1px solid;
    border-radius: 5px;
    box-shadow: -1px 1px 6px 0.5px rgba(138, 138, 138, 0.75);
    padding: 0 10px 10px 10px;
}

.mount .sceimg {
    background-color: #80a076;
}

.sea .sceimg {
    background-color: #89b5cb;
}

.farm .sceimg {
    background-color: #8dcfca;
}

.city .sceimg {
    background-color: #b7ad6f;
}

.hot .sceimg {
    background-color: #d85a51;
}

.scebox:hover {
    cursor: pointer;
}

.scebox:hover .sceimg img {
    -webkit-transition: all 0.5s ease 0s;
    -moz-transition: all 0.5s ease 0s;
    -o-transition: all 0.5s ease 0s;
    transition: all 0.5s ease 0s;
    transform: scale(0.95);
    overflow: hidden;
}

.scebox_hot {
    padding: 0 80px;
}

.scebox_hot .scebox {
    display: inline-block;
    float: left;
    width: 23%;
    margin: 0 10px;
}

.scetag {
    float: right;
    color: #fff;
    padding: 4px 20px;
    margin-left: 5px;
    border-bottom-right-radius: 10px;
    border-bottom-left-radius: 10px;
}

.scetag1 {
    background: #d85a51;
}

.scetag2 {
    background: #80a076;
}

.scetag3 {
    background: #89b5cb;
}

.scetag4 {
    background: #8dcfca;
}

.scetag5 {
    background: #b7ad6f;
}

.scet h3 {
    clear: both;
    color: #3d3d3d;
    font-size: 21px;
    letter-spacing: 1px;
    margin: .5em 0;
    display: inline-block;
}

.sceimg img {
    margin: 0 auto;
}

.scep p {
    color: #616161;
    text-align: left;
    margin: 10px 0 0 0;
}

.scemore {
    text-align: right;
}

@media(max-width:1700px) {
    .scebox_hot {
        padding: 0 10px;
    }
}

@media(max-width:1400px) {
    .scebox_hot .scebox {
        width: 24%;
        margin: 0 5px;
    }
}

@media(max-width:1199px) {
    .scebox_hot .scebox {
        width: 48%;
        margin: 5px;
    }

    .scebox_hot .scebox:nth-child(3) {
        clear: both;
    }
}

@media(max-width:700px) {
    .scebox_hot .scebox {
        width: 100%;
        margin: 5px 0px;
    }

    .scet h3 {
        font-size: 22px;
    }

    .scep p {
        line-height: 24px;
    }

    #services_sce {
        padding: 0 1em 60px;
    }

}

@media(max-width:550px) {

    .city .sceimg,
    .farm .sceimg,
    .hot .sceimg,
    .mount .sceimg,
    .sea .sceimg {
        background-color: #fff;
    }
}

@media(max-width:500px) {
    .scet h3 {
        letter-spacing: 0px;
    }
}

@media(max-width:450px) {
    .mount .sceimg {
        background-color: #80a076;
    }

    .sea .sceimg {
        background-color: #89b5cb;
    }

    .farm .sceimg {
        background-color: #8dcfca;

    }

    .city .sceimg {
        background-color: #b7ad6f;
    }

    .hot .sceimg {
        background-color: #d85a51;
    }
}

@media(max-width:350px) {
    .scet h3 {
        font-size: 20px;
    }
}


/*************/

.scebox_content {
    padding: 0 0px;
    margin-top: 30px;
}

.scebox_content .scebox {
    display: inline-block;
    float: left;
    width: 100%;
    margin: 5px;
}

@media (max-width: 1800px) {
    .scebox_content {
        padding: 0px;
    }
}

@media screen and (max-width:1700px) {
    .scebox_content {
        padding: 0 0px;
        margin-top: 30px;
    }
}


/*********************** 20170328  以上 優質a****************/

.scecontainer {
    display: block;
    margin: auto;
    width: 100%;
}

.scecontainer .item {
    margin: 0.5%;
    float: left;
    background: #ffffff;
    display: block;
    width: 32%;
}

@media screen and (max-width: 1800px) {
    .scecontainer {
        width: 96%;
    }

    .scecontainer .item {
        width: 19%;
    }
}

@media screen and (max-width: 1400px) {
    .scecontainer .item {
        width: 24%;
    }
}

@media screen and (max-width: 991px) {
    .scecontainer .item {
        width: 32%;
    }
}

@media screen and (max-width:767px) {
    .scecontainer .item {
        width: 49%;
    }
}

@media screen and (max-width:550px) {
    .scecontainer .item {
        width: 99%;
        margin-bottom: 10px;
    }
}

/*---roomguide-------------------------------------------------------------------------------*/
.roomguide {
    position: relative;
    padding-bottom: 6.9rem;
}

.roomguide .roomg_inner {
    width: 1368px;
    max-width: 100%;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
}

.roomg_inner .rg_room {
    width: 49.1%;
}

.rg_room .roomg_title {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 3rem;
}

.roomg_title .roomg_lt {
    margin-right: 1.2rem;
}

.roomg_lt .roomg_en {
    font-size: 50px;
    font-family: 'Amiri';
    text-transform: uppercase;
    line-height: 1;
    text-align: right;
}

.roomg_lt .roomg_ch {
    font-size: 30px;
    font-weight: bold;
    line-height: 1;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.roomg_title .roomg_rt {}

.rg_room a .roomg_img {
    transition: .5s all;
}

.rg_room a:hover .roomg_title {
    color: #638ba0;
}

.rg_room a:hover .roomg_img {
    transform: translateY(-10px);
}

@media screen and (max-width:940px) {
    .roomg_lt .roomg_en {
        font-size: 45px;
    }

    .roomg_lt .roomg_ch {
        font-size: 25px;
    }
}

@media screen and (max-width:870px) {
    .roomg_lt .roomg_en {
        font-size: 40px;
    }

    .roomg_lt .roomg_ch {
        font-size: 20px;
    }

    .roomg_lt .roomg_ch img {
        width: 60%;
    }
}

@media screen and (max-width:768px) {
    .roomguide .roomg_inner {
        justify-content: center;
        flex-wrap: wrap;
    }

    .roomg_inner .rg_room {
        width: 90%;
    }

    .roomg_inner .rg_room:nth-child(1) {
        margin-bottom: 5rem;
    }

    .roomg_lt .roomg_en {
        font-size: 50px;
    }

    .roomg_lt .roomg_ch {
        font-size: 30px;
    }
}

@media screen and (max-width:510px) {
    .roomg_lt .roomg_en {
        font-size: 40px;
    }

    .roomg_lt .roomg_ch {
        font-size: 25px;
    }
}

@media screen and (max-width:440px) {
    .roomg_title .roomg_rt {
        width: 10%;
    }
}

@media screen and (max-width:414px) {
    .roomg_inner .rg_room {
        width: 95%;
    }

    .roomg_lt .roomg_ch {
        justify-content: flex-end;
    }

    .roomg_lt .roomg_ch img {
        width: 50%;
        margin-left: 1rem;
    }

}

@media screen and (max-width:390px) {
    .roomg_lt .roomg_ch {
        font-size: 20px;
    }
}

@media screen and (max-width:360px) {
    .roomg_lt .roomg_en {
        font-size: 35px;
    }
}

@media screen and (max-width:320px) {
    .roomg_lt .roomg_en {
        font-size: 30px;
    }
}

/*---room--------------------------------------------------------------------------*/
.room {
    position: relative;
    padding: 0 0 10rem 0;
}

/*rmbt*/
.rmbt {
    width: 1120px;
    max-width: 100%;
    margin: 0 auto;
}

.rmbt ul {}

.rmbt ul li {
    display: inline-block;
    width: 29%;
}

.rmbt a img {
    transition: .5s all;
}

.rmbt a:hover img {
    transform: translateY(-10px);
}

/*rm_inner*/
.rm_inner {
    width: 1368px;
    max-width: 100%;
    margin: 0 auto;
    margin-top: 4rem;
    padding-right: 2.6rem;
    display: flex;
    justify-content: space-between;
    position: relative;
}

.rm_inner:before {
    content: '';
    background: url(../../images/room_deco01.png) bottom right no-repeat;
    background-size: contain;
    width: 276px;
    max-width: 100%;
    min-height: 276px;
    position: absolute;
    bottom: -9rem;
    right: 8rem;
    z-index: 0;
}

.rm_inner:after {
    content: '';
    background: url(../../images/room_deco02.png) bottom right no-repeat;
    background-size: contain;
    width: 410px;
    max-width: 100%;
    min-height: 111px;
    position: absolute;
    bottom: -3rem;
    right: 13rem;
    z-index: 90;
}

.rm_inner .rm_lt {
    position: relative;
}

.rm_inner .rm_rt {}

.rm_rt .rm_name {
    display: flex;
    justify-content: center;
    align-items: stretch;
    margin-top: 1.6rem;
}

.rm_name .rm_ch {
    font-size: 36px;
    font-weight: bold;
    -webkit-writing-mode: vertical-rl;
    writing-mode: vertical-rl;
    line-height: 1;
    display: flex;
    align-items: center;
    flex-direction: row;
    justify-content: space-between;
}

.rm_ch .rmch_deco {
    background: url(../../images/room_deco04.png) top left no-repeat;
    background-size: 100%;
    width: 16px;
    min-height: 265px;
}

.rm_name .rm_en {
    font-size: 60px;
    font-family: 'Amiri';
    text-transform: uppercase;
    -webkit-writing-mode: vertical-rl;
    writing-mode: vertical-rl;
    line-height: 1;

}

.room .rm_bot {
    width: 1136px;
    max-width: 100%;
    margin: 5rem auto 0;
}

/*roombs*/
.roombs {
    display: inline-block;
    vertical-align: top;
    padding: 0 2em 0 0;
}

.roomb {
    width: 100%;
    padding: 0 0 2em 0;
}

.roomb .roomb_img {
    margin-bottom: 2rem;
}

.roomb td {
    vertical-align: middle;
    border: 0;
    padding: .5em .2em;
}

.roomb table {
    border-bottom: solid 1px #000;
    border-top: solid 2px #000;
}

.roomb table tr {
    border-bottom: solid 1px #000;
}

.roomb table tr:nth-of-type(1) {
    border-bottom: solid 2px #000;
}

/*rinfo*/
.rinfo {
    text-align: left;
    padding: 3% 0%;
}

.rinfo li span {
    display: inline-block;
    vertical-align: top;
}

.rinfo li span:nth-of-type(1) {}

.rinfo li span:nth-of-type(2) {
    width: 90%;
}

@media screen and (max-width:1320px) {
    .rm_inner {
        padding-right: 1.6rem;
    }

    .rm_inner .rm_rt {
        padding-left: 1rem;
    }
}

@media screen and (max-width:1190px) {
    .rm_inner {
        padding: 0;
    }
}

@media screen and (max-width:1200px) {
    .rm_inner {
        padding: 0;
        flex-wrap: wrap;

    }

    .rm_inner:before {
        background-size: 90%;
        width: 20%;
        bottom: 7rem;
        right: 0rem;
    }

    .rm_inner:after {
        bottom: 12rem;
        right: 0rem;
    }

    .rm_inner .rm_lt {
        width: 95%;
        margin: 0 auto;
    }

    .rm_inner .rm_rt {
        padding: 4rem 2rem 2rem 2rem;
        display: flex;
        flex-direction: row-reverse;
        align-items: flex-start;
    }

    .rm_inner .rm_rt img:nth-of-type(1) {
        transform: rotate(90deg);
    }

    .rm_rt .rm_name {
        flex-wrap: wrap;
        flex-direction: column-reverse;
    }

    .rm_name .rm_ch {
        writing-mode: horizontal-tb;

    }

    .rm_ch .rmch_deco {
        background: url(../../images/room_deco05.png) top left no-repeat;
        background-size: 100%;
        width: 265px;
        max-width: 100%;
        min-height: 16px;
    }

    .rm_name .rm_en {
        writing-mode: horizontal-tb;
    }

    .room .rm_bot {
        padding: 0 2rem;
    }
}

@media screen and (max-width:991px) {
    .rm_inner:before {
        right: 1rem;
    }

    .rm_inner:after {
        bottom: 14rem;
        right: 2rem;
        width: 30%;
        min-height: 90px;
    }
}

@media screen and (max-width:834px) {
    .rmbt {
        padding: 0 2rem;
        text-align: center;
    }

    .rmbt ul li {
        width: 35%;
    }
}

@media screen and (max-width:768px) {
    .rm_inner:before {
        min-height: 146px;
        bottom: 16rem;
    }

    .rm_inner:after {
        bottom: 20rem;
        min-height: 74px;
    }

    .rm_inner .rm_rt {
        padding: 9rem 2rem 2rem 2rem;
    }

    .room .rm_bot {
        margin: 2rem auto 0;
    }
}

@media screen and (max-width:600px) {
    .rmbt ul li {
        width: 45%;
        padding: 0 1rem;
    }

    .rm_rt .rm_name {
        width: 85%;
    }

    .rm_name .rm_en {
        font-size: 50px;
    }

    .rm_name .rm_ch {
        font-size: 30px;
    }

    .rm_inner .rm_rt img:nth-of-type(1) {
        width: 18%;
        position: relative;
        top: 1rem;
    }
}

@media screen and (max-width:510px) {
    .rm_name .rm_en {
        font-size: 40px;
    }

    .rm_name .rm_ch {
        font-size: 20px;
        line-height: 0;
    }

    .rm_ch .rmch_deco {
        width: 50%;
    }
}

@media screen and (max-width:450px) {
    .rm_inner .rm_rt {
        padding: 5rem 2rem 0 2rem;
    }

    .rm_inner:before {
        right: 0rem;
        bottom: 12rem;
        min-height: 85px;
    }

    .rm_inner:after {
        right: 0rem;
        bottom: 14rem;
    }
}

@media screen and (max-width:414px) {
    .room {
        padding: 0 0 3rem 0;
    }

    .rm_inner .rm_rt {
        padding: 6rem 2rem 0 2rem;
        width: 100%;
        justify-content: flex-end;
    }

    .rm_rt .rm_name {
        width: 75%;
    }

    .rm_name .rm_en {
        font-size: 35px;
    }

    .rm_ch .rmch_deco {
        min-height: 10px;
    }

    .rm_inner:before {
        min-height: 85px;
        bottom: 9rem;
    }

    .rm_inner:after {
        bottom: 11rem;
        min-height: 40px;
    }

    .roomb .roomb_img {
        width: 80%;
    }
}

@media screen and (max-width:390px) {
    .rm_inner:before {
        bottom: 9rem;
    }

    .rm_inner:after {
        bottom: 11rem;
    }

    .rm_rt .rm_name {
        width: 80%;
    }

}

@media screen and (max-width:370px) {
    .rm_rt .rm_name {
        width: 85%;
    }
}

@media screen and (max-width:360px) {
    .rm_name .rm_en {
        font-size: 30px;
    }

    .rm_rt .rm_name {
        width: 75%;
    }

    .rm_name .rm_ch {
        font-size: 17px;
    }
}

@media screen and (max-width:350px) {
    .rm_name .rm_en {
        font-size: 27px;
    }
}

@media screen and (max-width:320px) {
    .rm_name .rm_en {
        font-size: 25px;
    }
}

@media screen and (max-width:300px) {
    .rm_rt .rm_name {
        width: 80%;
    }
}

@media screen and (max-width:450px) {}

@media screen and (max-width:414px) {}

@media screen and (max-width:390px) {}

@media screen and (max-width:350px) {}

/*---r_icons-----------------------------------------------------------------------------------------------------------------------------------*/
.r_icons {
    padding-bottom: 0;
    text-align: left;
}

.r_icons ul {
    list-style: none;
}

.r_icons li {
    width: 10%;
    float: left;
    border: 0px;
}

table.fac {
    padding: 0 0 3% 2%;
    display: block;
}

table.fac td {
    vertical-align: top;
}

@media screen and (max-width:1290px) {
    .r_icons li {
        width: 12%;
    }
}

@media screen and (max-width:1060px) {
    .r_icons li {
        width: 28%;
    }
}

@media screen and (max-width:991px) {
    .r_icons li {
        width: 15%;
    }
}

@media screen and (max-width:815px) {
    .r_icons li {
        width: 17%;
    }
}

@media screen and (max-width:765px) {
    .r_icons li {
        width: 20%;
    }
}

@media screen and (max-width: 765px) {
    .r_icons li {
        width: 17%;
    }
}

@media screen and (max-width:580px) {
    .r_icons li {
        width: 21%;
    }
}

@media screen and (max-width:480px) {
    .r_icons li {
        width: 22%;
    }
}

@media screen and (max-width:440px) {
    .r_icons li {
        width: 23%;
        margin: 5px 3px;
        padding: 5px;
    }
}

@media screen and (max-width:380px) {
    .r_icons li {
        width: 30%;
    }
}