@charset "utf-8";

/* import */
@import url("common.css");
/*-------layout--------------------------------------------------------*/
body {width:100%; font-family:'Montserrat', 'Noto',Dotum,Helvetica,"Apple SD Gothic Neo",Sans-serif;font-size:18px; line-height:1.4; background:#fff; color: #363636;height:100%;}

#wrap,
#header,
#container,
#content,
#footer {width:100%;position:relative; word-break: keep-all}

#wrap {min-width:320px;overflow: hidden}
.m-main {width:100%;max-width:1140px; margin:0 auto; padding:0 10px;}

._ing * {outline:1px dotted red}
._temp {
    position:absolute; left:50%; top:0;
    -webkit-transform: translate(-50%, 0);
    -moz-transform: translate(-50%, 0);
    -ms-transform: translate(-50%, 0);
    -o-transform: translate(-50%, 0);
    transform: translate(-50%, 0);
    z-index:100; opacity: 0.5;
}

.pc-hide {display:none !important; }

@media (max-width: 768px) {
    body {font-size:14px;}
    .pc-hide {display:block !important; }
    .m-hide {display:none !important; }
}
@media (max-width: 500px) {
    .small-hide {display:none;}
}

._ie9 {display:none !important;}

body._progress:after {content:""; display:block; position:fixed; left:0; right:0; top:0;bottom:0; background:rgba(0,0,0,0.8) url(../../img/stick_loading.gif) center no-repeat; z-index:100;}
body._noscroll {overflow: hidden; position:fixed}
#wrap._noscroll {overflow: hidden; }

#sticky {position:fixed;top:0; left:0; width:100%;height:1px; }

/*------- common --------------------------------------------------------*/
img {max-width:100%; display:inline-block}
figure {text-align: center}

._motion {
    -webkit-transition-duration: .5s;-moz-transition-duration: .5s;-ms-transition-duration: .5s;-o-transition-duration: .5s;transition-duration: .5s;
}
._motion-hover {
    background:#000;width:100%; height:100%; position:absolute;left:0; top:0; z-index:-1;
    -webkit-transform: translate(-150%, 0) skew(45deg);-moz-transform: translate(-150%, 0) skew(45deg);-ms-transform: translate(-150%, 0) skew(45deg);-o-transform: translate(-150%, 0) skew(45deg);transform: translate(-150%, 0) skew(45deg);
}
.item:hover ._motion-hover,
.item:active ._motion-hover,
.item._active ._motion-hover {
    -webkit-transform: translate(-30px, 0) skew(45deg);-moz-transform: translate(-30px, 0) skew(45deg);-ms-transform: translate(-30px, 0) skew(45deg);-o-transform: translate(-30px, 0) skew(45deg);transform: translate(-30px, 0) skew(45deg);
}

.btn,
a.btn {display:inline-block; padding:0 10px; border:1px solid #959595; color:#464646; background-color:transparent; text-align: center;}

a.btn.c-black {border-color:#000; background:#fff; color:#000;}
a.btn.c-black:hover {background:#000; color:#fff;}

a.btn.c-white {border-color:#fff; background:#fff; color:#363636;}
a.btn.c-white:hover {background:transparent; color:#ffff;}

.under {display:inline-block; text-decoration: underline;}

a.more {display:inline-block;color:rgba(255, 255, 255, 0.7); padding-left:70px;position:relative;}
a.more:before {content:""; display:block; height:1px; width:60px; background:rgba(255, 255, 255, 0.7); position:absolute; left:0; top:50%;}
a.more .txt {display:inline-block; font-style: italic; text-decoration: underline;font-size:14px; white-space: nowrap}

.btn-wrap {text-align: center}
.btn-right {text-align: right}

.drop-box .drop-wrap {display:none;}
.drop-box._open .drop-wrap {display:block;}

.tbl-dl {display:flex; flex-wrap:wrap; align-items: center; text-align: left;border-bottom:1px solid #fff; }
.tbl-dl.none-bd  {border-bottom:0}
.ua-ie-9 .tbl-dl {display:table; table-layout: fixed; width:100%; vertical-align: middle;}
.ua-ie-9 .tbl-dl > *  {display:table-cell;}
.tbl-dl > dt {width:80px; font-size:14px; font-weight:700;}
.tbl-dl > dd {width:calc(100% - 80px);}
.tbl-dl.dt-100 {display:block;}
.tbl-dl.dt-100 > dt,
.tbl-dl.dt-100 > dd {width:100%;}
.tbl-dl .label {display:block; line-height:30px; height:30px;}
.tbl-dl [type=text],
.tbl-dl textarea {display:block; color: #fff; height:30px; border:0; background: transparent;width:100%;}
.tbl-dl textarea {height:370px; padding:10px; border:1px solid #fff}

.file-label {display:inline-block; width:100%; position:relative; padding-right:95px; height:30px;}
.file-label._addFile {width:calc(100% - 95px);}
.file-label [type=file] {opacity: 0; width:100%; height:100%; position:absolute; left:0; top:0; z-index:1; cursor: pointer;}
.file-label .txt {display:block; width:100%; height:100%; position:absolute; left:0; top:0;}
.file-label .btn {position:absolute; right:0; top:0;}
.file-label [type=file]:hover + .txt + .btn {background:transparent; color:#fff;}
.file-label._addFile .btn {display:none;}
.file-label + .btn {vertical-align: top;display:none;}
.file-label._addFile + .btn {display:inline-block}
.req:after {content:"*"; display:inline-block; margin-left:5px; color:#ff009c}

.blit {font-weight:700; line-height:1.2; display:block; position:relative; padding-top:25px;}
.blit:before {content:""; display:block; width:42px; height:12px; background:url(../../img/logo_blit.png) center no-repeat; background-size:cover; position:absolute; left:0; top:0;}
.blit.t2 {text-align: center;}
.blit.t2:before {
    left:50%;text-align: center;
    transform: translate(-50%, 0);
}

.sec-tit {font-size:70px; line-height:1.1; font-weight:700; color:#363636;}
.sec-tit small {font-size:24px; display:inline-block;}
.article-tit {display:block; width:100%; text-align: center;  font-weight:700; line-height:1.1}
.article-tit.blit:before {
    left:50%;
    -webkit-transform: translate(-50%, 0);-moz-transform: translate(-50%, 0);-ms-transform: translate(-50%, 0);-o-transform: translate(-50%, 0);transform: translate(-50%, 0);
}

.chk-label {display:inline-block; margin-right:50px; position:relative}
.chk-label input {position:absolute; left:0; top:0; opacity:0;}
.chk-label .txt {position:relative; padding-left:23px; font-size:14px;}
.chk-label .txt:before,
.chk-label .txt:after {content:""; display:block; position:absolute;}
.chk-label .txt:before {background:#fff; width:15px; height:15px; left:0; top:2px;}
.chk-label :checked + .txt:after {background:#ff009c; width:11px; height:11px; left:2px; top:4px;}

.col-50 {width:50% !important;}

input,
select,
textarea {font-family:'Noto';font-size:14px; }

@media (max-width: 1140px) {
    .sec-tit {font-size:6.14vw;}
}
@media (max-width: 768px) {
    .col-50 {width:100% !important;}
    .sec-tit small {font-size:18px;}
}
@media (max-width: 320px) {
    .sec-tit {font-size:20px;}
}

._motion {
    -webkit-transition-duration: .3s;-moz-transition-duration: .3s;-ms-transition-duration: .3s;-o-transition-duration: .3s;transition-duration: .3s;
}


/*------- header --------------------------------------------------------*/
#header {position: fixed;z-index: 100;left: 0; width:100%; border-bottom: 0;  font-family:'Montserrat';/*background:rgba(5, 5, 5, 1);*/padding:0 10px; }
#header._move {background:rgba(0, 0, 0, 0.7)}
#header:after {content:""; display:block; width:100%;  position:absolute; left:0; top:100%; background:rgba(0, 0, 0, 0.7)}
#header .header-top {position:relative; width:100%; max-width:1700px; margin:0 auto; padding-left: 250px; /*padding-right:250px; */height:85px;}
#header #logo {
    width:232px; position:absolute; left:0; top:50%;
    -webkit-transform: translate(0, -50%);-moz-transform: translate(0, -50%);-ms-transform: translate(0, -50%);-o-transform: translate(0, -50%);transform: translate(0, -50%);
}
#header #logo .item {display:block;width:100%; height:28px; background:url(../../img/logo.png) left center no-repeat; background-size:auto 100%;}
#header .main-nav {justify-content: center;}
#header .main-nav > li {position:relative}
#header .main-nav .nav-item {display:inline-block;color:#fff;  font-weight:700; line-height:85px; padding:0 70px;}
#header .main-nav .row-depth {position:absolute; left:0; top:100%;width:100%;text-align: center; z-index:1;}
#header .main-nav .row-item {color:#fff; font-size:15px; font-weight:500; line-height:1.2; display:block;text-align: center;padding:10px 0;}
#header .main-nav .row-item .txt{text-align: center; display:inline-block; position:relative}
#header .main-nav .row-item .txt:before {font-family: "Font Awesome 5 Free";content: "\f0da";font-weight: 900;  color:transparent; margin-right:8px; display:none}
#header .main-nav .row-item._active .txt:before {color:#fff; display:inline-block;}
#header .main-nav .ico-diamond {display:block; width:26px; height:85px; background:url(../../img/ico_diamond.png) center no-repeat;margin-left:70px;}

#header .header-top .all-menu  {
    display:block;width:30px; height:30px; position:absolute; right:10px; top:50%;
    -webkit-transform: translate(0, -50%);-moz-transform: translate(0, -50%);-ms-transform: translate(0, -50%);-o-transform: translate(0, -50%);transform: translate(0, -50%);
}

@media (max-width:1700px) {
    #header .main-nav .nav-item {padding: 0 4.12vw;}
    #header .main-nav .ico-diamond {margin-left:4.12vw;}
}
@media (max-width:1120px) {
    #header .header-top {padding-left:120px;/*padding-right:120px;*/}
    #header #logo {width:94px;}
    #header .main-nav .nav-item {padding: 0 4.12vw;}
    #header .main-nav .ico-diamond {margin-left:4.12vw;}
}
@media (max-width: 768px) {
    #header .main-nav {display:none;}
    #header .main-nav > li {display:block; width:100%; text-align: center}
    #header .main-nav .nav-item {padding:10px; line-height:1.1;border-bottom: 1px solid #fff;padding-bottom: 5px;margin-bottom: 5px; font-size:18px;}
    #header .main-nav .row-item {display:inline-block;}
    #header .main-nav .row-item:after {content:""; display:block; width:100%; height:0; visibility: hidden; clear: both}
    #header .main-nav .row-item .txt:before {position:absolute; left:-14px; top:1px;margin-right:0;}
    #header .main-nav .ico-diamond {margin:0; display:inline-block;height:30px;}

    #header .header-top .all-menu .bar,
    #header .header-top .all-menu .bar:after,
    #header .header-top .all-menu .bar:before {
        content:""; display:block; width:35px; height:2px; background:#fff; position:absolute; left:50%; top:50%;
        -webkit-transform: translate(-50%, -50%);-moz-transform: translate(-50%, -50%);-ms-transform: translate(-50%, -50%);-o-transform: translate(-50%, -50%);transform: translate(-50%, -50%);
    }
    #header .header-top .all-menu .bar:before {margin-top:-8px;}
    #header .header-top .all-menu .bar:after {margin-top:8px;}

    #header._openAllMenu .header-top .all-menu .bar {background: transparent}
    #header._openAllMenu .header-top .all-menu .bar:before {
        margin:0;
        -webkit-transform: translate(-50%, -50%) rotate(45deg);-moz-transform: translate(-50%, -50%) rotate(45deg);-ms-transform: translate(-50%, -50%) rotate(45deg);-o-transform: translate(-50%, -50%) rotate(45deg);transform: translate(-50%, -50%) rotate(45deg);
    }
    #header._openAllMenu .header-top .all-menu .bar:after {
        margin:0;
        -webkit-transform: translate(-50%, -50%) rotate(-45deg);-moz-transform: translate(-50%, -50%) rotate(-45deg);-ms-transform: translate(-50%, -50%) rotate(-45deg);-o-transform: translate(-50%, -50%) rotate(-45deg);transform: translate(-50%, -50%) rotate(-45deg);
    }
    #header._openAllMenu .header-top {position:fixed; left:0; right:0; top:0; bottom:0;overflow-y:auto; padding:50px 0; display:flex; flex-wrap:wrap;align-items: center; height:auto;}
    #header._openAllMenu .header-top:before {content:""; display:block; position:fixed; left:0; right:0; top:0; bottom:0; background:rgba(0, 0, 0, 0.8)}
    #header._openAllMenu .header-top .container {width:100%;}
    #header._openAllMenu  #logo {width:100%; text-align:center; left:auto; top:auto; position:relative}
    #header._openAllMenu  #logo .item {width:94px; display:inline-block;}
    #header._openAllMenu .main-nav {display:block; width:100%}

    #header._openAllMenu .header-top .all-menu  {
        top:10px;
        -webkit-transform: translate(0, 0);-moz-transform: translate(0, 0);-ms-transform: translate(0, 0);-o-transform: translate(0, 0);transform: translate(0, 0);
    }

    #header._openAllMenu .main-nav .row-depth {visibility: visible; height:auto; position:relative;}
    #header._openAllMenu .main-nav .row-depth .row-item {opacity: 1}

}


/*_motion*/
#header:after {
    opacity: 0; height:0;
    -webkit-transition: height 0s, opacity .5s;-moz-transition: height 0s, opacity .5s;-ms-transition: height 0s, opacity .5s;-o-transition: height 0s, opacity .5s;transition: height 0s, opacity .5s;
}
#header._openMenu:after {height:156px;opacity: 1}

#header .main-nav .row-depth {height:0; visibility: hidden}
#header._openMenu {background:rgba(0, 0, 0, 0.7)}
#header._openMenu .main-nav .row-depth {height:auto; visibility: visible; padding:10px 0;}
#header .main-nav .row-item {opacity:0;}
#header._openMenu .main-nav .row-item {
    opacity: 1;
    -webkit-transition-duration: .7s;-moz-transition-duration: .7s;-ms-transition-duration: .7s;-o-transition-duration: .7s;transition-duration: .7s;
}
#header._openMenu .main-nav .row-item.r1 {
    -webkit-transition-delay: .2s;-moz-transition-delay: .2s;-ms-transition-delay: .2s;-o-transition-delay: .2s;transition-delay: .2s;
}
#header._openMenu .main-nav .row-item.r2 {
    -webkit-transition-delay: .3s;-moz-transition-delay: .3s;-ms-transition-delay: .3s;-o-transition-delay: .3s;transition-delay: .3s;
}
#header._openMenu .main-nav .row-item.r3 {
    -webkit-transition-delay: .4s;-moz-transition-delay: .4s;-ms-transition-delay: .4s;-o-transition-delay: .4s;transition-delay: .4s;
}


/*------- footer --------------------------------------------------------*/
#footer {background:#0f0f0f; padding:80px 0 140px 0;}
#footer .m-foot {padding:0 10px; max-width:1220px; margin:0 auto;}
#footer .foot-flex {vertical-align: top; align-items: flex-start}
#footer .foot-flex .col-left {width:160px;}
#footer .foot-flex .col-right {width:calc(100% - 160px); padding-left:80px;}
#footer .info {display:flex; align-items: flex-start}
#footer .info > li {margin-right:50px;position:relative; color:#fff;font-size:13px; display:inline-block}
#footer .info > li:last-child {margin-right:0;}
#footer .info .tit {font-weight:700; line-height:1.2; display:block; margin-bottom:5px;position:relative; padding-top:25px;}
#footer .info .tit:before {content:""; display:block; width:42px; height:12px; background:url(../../img/logo_blit.png) center no-repeat; background-size:cover; position:absolute; left:0; top:0;}
#footer .info dl {display:block}
#footer .info dl dt,
#footer .info dl dd {display:inline-block}
#footer .copy {margin-top:35px; color:rgba(255, 255, 255, 0.2); font-size:13px}

@media (max-width:1220px) {
    #footer {padding:30px 0;}
    #footer .foot-flex .col-right {padding-left:6.56vw;}
    #footer .info {margin-left:-10px; margin-right:-10px;}
    #footer .info > li {float:left; width:33.33%; padding-left:10px;padding-right:10px; margin-right:0;}
}
@media (max-width:768px) {
    #footer .foot-flex .col-left,
    #footer .foot-flex .col-right {width:100%; padding:0; text-align: center;}
    #footer .foot-flex .col-right {margin-top:20px;}
    #footer .info .tit:before {
        left:50%;
        -webkit-transform: translate(-50%, 0);-moz-transform: translate(-50%, 0);-ms-transform: translate(-50%, 0);-o-transform: translate(-50%, 0);transform: translate(-50%, 0);
    }
}
@media (max-width:500px) {
    #footer .info > li {width:100%; margin-bottom:20px;}
    #footer .info > li:last-child {margin-bottom:0;}
}

.diamond-fix {position:fixed; left:0; right:0; top:0; bottom:0; background: rgba(0, 0, 0, 0.8); z-index:100;    overflow-y: auto;}
.diamond-fix .container-flex {padding:100px 0;min-height:100vh; align-items: center; text-align: center; color:#fff;}
.diamond-fix .container-flex .col-container {width:100%; max-width:900px; margin:0 auto; padding:0 10px;}
.diamond-fix .container-flex .header {padding:0 20px;}
.diamond-fix .container-flex .header .item {display:inline-block}
.diamond-fix .container-flex .header .header-tit {font-size:80px; line-height:1.1; margin-top:25px; font-weight:700; display:block;}
.diamond-fix .container-flex .header .header-dec {font-size:14px; line-height:1.1; margin-top:20px; font-weight:400;}
.diamond-fix .container-flex .diamond {margin-top:70px;}
.diamond-fix .container-flex .dec-flex {margin-top:-40px;}
.diamond-fix .container-flex .dec-flex .col {width:50%; text-align: center; padding:0 15px; position:relative}
.diamond-fix .container-flex .dec-flex .col .ico-plus {
    display:block; width:21px; height:21px; position:absolute; right:-10px; top:50%;
    -webkit-transform: translate(0, -50%);-moz-transform: translate(0, -50%);-ms-transform: translate(0, -50%);-o-transform: translate(0, -50%);transform: translate(0, -50%);
}
.diamond-fix .container-flex .dec-flex .col .ico-plus:before,
.diamond-fix .container-flex .dec-flex .col .ico-plus:after {
    content:""; display:block; height:1px;width:21px; background:#fb069d; position:absolute; left:50%; top:50%;
    -webkit-transform: translate(-50%, -50%);-moz-transform: translate(-50%, -50%);-ms-transform: translate(-50%, -50%);-o-transform: translate(-50%, -50%);transform: translate(-50%, -50%);
}
.diamond-fix .container-flex .dec-flex .col .ico-plus:after {
    -webkit-transform: translate(-50%, -50%) rotate(90deg);-moz-transform: translate(-50%, -50%) rotate(90deg);-ms-transform: translate(-50%, -50%) rotate(90deg);-o-transform: translate(-50%, -50%) rotate(90deg);transform: translate(-50%, -50%) rotate(90deg);
}
.diamond-fix .container-flex .dec-flex .col .tit {display:block; line-height:1.1; font-size:36px;}
.diamond-fix .container-flex .dec-flex .col .dec {margin-top:30px;line-height:1.4; font-size:14px;}

.ua-ie-9 .diamond-fix .container-flex {display:table; table-layout: fixed; width:100%; vertical-align: middle;}
.ua-ie-9 .diamond-fix .container-flex > * {display:table-cell;}

/*motion*/
.diamond-fix,
.diamond-fix ._motion {
    opacity: 0;
    -webkit-transition-duration: 1s;-moz-transition-duration: 1s;-ms-transition-duration: 1s;-o-transition-duration: 1s;transition-duration: 1s;
}
.diamond-fix._active,
.diamond-fix._active ._motion {opacity: 1}
.diamond-fix._active .header {
    -webkit-transition-delay: .3s;
    -moz-transition-delay: .3s;
    -ms-transition-delay: .3s;
    -o-transition-delay: .3s;
    transition-delay: .3s;
}
.diamond-fix._active .diamond {
    -webkit-transition-delay: .6s;
    -moz-transition-delay: .6s;
    -ms-transition-delay: .6s;
    -o-transition-delay: .6s;
    transition-delay: .6s;
}
.diamond-fix._active .dec-flex {
    -webkit-transition-delay: .9s;
    -moz-transition-delay: .9s;
    -ms-transition-delay: .9s;
    -o-transition-delay: .9s;
    transition-delay: .9s;
}

@media (max-width:1140px) {
    .diamond-fix .container-flex .header .header-tit {font-size:7.02vw;}
}
@media (max-width:768px) {
    .diamond-fix .container-flex {padding-top:50px}
    .diamond-fix .container-flex .diamond {margin-top:30px;}
    .diamond-fix .container-flex .dec-flex .col .tit {font-size:4.69vw;}
    .diamond-fix .container-flex .dec-flex {margin-top:-80px;}
}
@media (max-width:500px) {
    .diamond-fix .container-flex .dec-flex,
    .diamond-fix .container-flex .dec-flex .col {display:block; width:100%;}
    .diamond-fix .container-flex .dec-flex .col {padding:0 20px;padding-bottom:40px; }
    .diamond-fix .container-flex .dec-flex .col:last-child {padding-bottom:0;}
    .diamond-fix .container-flex .dec-flex .col .ico-plus{
        bottom:10px; top:auto;left:50%;
        -webkit-transform: translate(-50%, 0);-moz-transform: translate(-50%, 0);-ms-transform: translate(-50%, 0);-o-transform: translate(-50%, 0);transform: translate(-50%, 0);
    }
    .diamond-fix .container-flex .dec-flex .col .dec {margin-top:15px;}
    .diamond-fix .container-flex .dec-flex .col .dec br {display:none;}
}
@media (max-width:320px) {
    .diamond-fix .container-flex .header .header-tit {font-size:22px;}
}

/*------- container --------------------------------------------------------*/
.kv-container .img-box {height:100vh; min-height:600px; position:relative}
.kv-container .m-main {position:relative; height:100%;}
.kv-container .page-header {
    position:absolute; left:0; top:50%; font-family: 'Montserrat';color:#fff; padding:0 10px;
    -webkit-transform: translate(0, -50%);-moz-transform: translate(0, -50%);-ms-transform: translate(0, -50%);-o-transform: translate(0, -50%);transform: translate(0, -50%);
}
.page-header .page-tit {display:inline-block; font-size:70px; font-weight:700; line-height:1.2; position:relative; padding-top:25px; }
.page-header .page-tit:before {content:""; display:block; width:42px; height:12px; background:url(../../img/logo_blit.png) center no-repeat; bakcground-size:cover;}
.page-header .page-dec {font-size:48px; display:block;  line-height:1.2;}
.page-header .dec {display:block; line-height:1.2; font-size:14px;font-family: 'Noto'; margin-top:10px; color:rgba(255, 255, 255, 0.5)}

.kv-container .scroll {
    position:absolute; bottom:50px; left:50%; width:80px;text-align:center;
    -webkit-transform: translate(-50%, 0);-moz-transform: translate(-50%, 0);-ms-transform: translate(-50%, 0);-o-transform: translate(-50%, 0);transform: translate(-50%, 0);
}
.kv-container .scroll .ico {display:inline-block; position:relative; border:2px solid #989898; width:20px; height:35px; border-radius: 20px;}
.kv-container .scroll .ico::after {
    content:""; display:block; width:2px; height:8px; background:#989898; position:absolute; left:50%; top:5px; margin-left:-1px;
    animation-name: mouse;animation-duration: .6s;animation-iteration-count: infinite;animation-direction: alternate-reverse;
}
.kv-container .scroll .txt {line-height:1.2; color:#989898; font-size:14px; display:inline-block; font-style: italic; margin-top:10px;}

@keyframes mouse {
    from {
        -webkit-transform: translate(0,0);-moz-transform: translate(0,0);-ms-transform: translate(0,0);-o-transform: translate(0,0);transform: translate(0,0);
    }
    to {
        -webkit-transform: translate(0, 10px);-moz-transform: translate(0, 10px);-ms-transform: translate(0, 10px);-o-transform: translate(0, 10px);transform: translate(0, 10px);
    }
}

.body-container {padding-top:150px;}
.body-container:last-child {padding-bottom:150px;}
.body-container .sec-header .dec {margin-top:10px; line-height:1.6; font-family: 'Noto'}

@media (max-width:768px) {
    .page-header .page-tit {font-size:9.11vw; }
    .page-header .page-dec {font-size:6.25vw;}
    .body-container {padding:80px 0 50px 0;}
}
@media (max-width:320px) {
    .page-header .page-tit {font-size:30px }
    .page-header .page-dec {font-size:20px;}
}

/*page-main*/
.slide-container *:focus {outline:0;}
.page-main {color:rgba(255, 255, 255, 0.7);}
.page-main .section  {min-height:100vh; }
.page-main .m-main  {padding:50px 10px;}

/*.page-main .m-main {padding:50px 0 100px 0;}*/
.page-main .more {margin-top:70px;}
.page-main .main-tit small,
.page-main .main-tit strong {display:block; line-height:1.2; color:#fff;}
.page-main .main-tit small {font-size:24px;}
.page-main .main-tit strong {font-size:84px;}
.page-main .sec-tit {color:#fff; font-size:32px; text-align: left;}
.page-main .section.sec1 .col-left {width:43%;}
.page-main .section.sec1 .col-right {width:57%;padding-left:20px;}
.page-main .section.sec1 .col-left .dec {margin-top:50px; font-size:14px;}
.page-main .section.sec1 .symbol-wrap {padding-top:20.45%; position:relative}
.page-main .section.sec1 .symbol-wrap .dott {display:block; width:10px; height:10px; background:#fff; border-radius: 100%; position:absolute;}
.page-main .section.sec1 .symbol-wrap .dott.dot1 {left:184px; bottom:0;}
.page-main .section.sec1 .symbol-wrap .dott.dot2 {left:269px; top:7px;}
.page-main .section.sec1 .symbol-wrap .dott.dot3 {left:484px; bottom:21px;}
.page-main .section.sec1 .symbol-wrap .dott:after {
    content:""; display:block; width:28px; height:28px; border-radius:100%; border:1px solid #fff;position:absolute; left:50%; top:50%;
    -webkit-transform: translate(-50%, -50%);-moz-transform: translate(-50%, -50%);-ms-transform: translate(-50%, -50%);-o-transform: translate(-50%, -50%);transform: translate(-50%, -50%);
}
.page-main .section.sec1 .symbol-wrap .dott._active:after {animation-name: symbol;animation-duration: .6s;animation-iteration-count: infinite;animation-direction: alternate-reverse;-webkit-animation-timing-function: linear;animation-timing-function: linear;
}

@keyframes symbol {
    from {
        width:28px; height:28px;
    }
    to {
        width:40px; height:40px;
    }
}

.page-main .section.sec2 .col {width:100%;position:relative}
.page-main .section.sec2 .img-flex {align-items: flex-end; vert-align: bottom}
.page-main .section.sec2 .col-left {width:calc(100% - 290px); padding-right:10px;}
.page-main .section.sec2 .col-right {width:290px;;font-size:14px; color:#fff;}
.page-main .section.sec2 figure {text-align: right;}

.page-main .section.sec3 .col-flex {background:#000;}
.page-main .section.sec3 .col-flex .col {width:33%; min-height:100vh; height:100%;position:relative; overflow: hidden}
.page-main .section.sec3 .col-flex .col:nth-child(2) {width:34%;}
.page-main .section.sec3 .col-flex .col .img-box {position:absolute;left:-60px; width:calc(100% + 60px); top:0; bottom:0;display: flex; align-items: center}

.page-main .section.sec3 .col-flex .col .dec-flex {min-height:100vh;position:relative}
.page-main .section.sec3 .col-flex .col .dec-flex:before {content:""; display:block; width:100%; height:100%; position:absolute; left:0; top:0; background:rgba(0, 0, 0, 0.5); padding:20px 10px;}
.page-main .section.sec3 .col-flex .col .dec-wrap {text-align: center; width:100%;  z-index:1;}
.page-main .section.sec3 .col-flex .col .sec-tit {text-align: center;}
.page-main .section.sec3 .col-flex .col .dec {margin-top:40px; color:#fff; font-size:14px; margin-bottom:50px;}
.page-main .section.sec3 .col-flex .col a.btn {margin-top:25px; min-width:115px; color:#fff; border-color:#fff; font-size:13px; line-height:29px; height:31px;border-radius: 2px;}
.page-main .section.sec3 .col-flex .col a.btn:hover {background:#fff; color:#fa0099; font-weight:700;}
.page-main .section.sec3 .line-ul {max-width:230px; margin:0 auto; }
.page-main .section.sec3 .line-ul > li {margin-bottom:20px; width:100%;text-align: left;line-height:1.2}
.page-main .section.sec3 .line-ul > li .txt {display:inline-block; padding-left:70px; position:relative; font-style: italic; color:#fff; font-size:14px; white-space: nowrap; }
.page-main .section.sec3 .line-ul > li .txt:before {content:""; display:block ;width:60px; height:1px; background:#fff; position:absolute; left:0; top:50%;}

/*motion*/
.page-main .section.sec3 .col-flex .col:hover .img-box{
    left:0;
    -webkit-transition-duration: 3s;-moz-transition-duration: 3s;-ms-transition-duration: 3s;-o-transition-duration: 3s;transition-duration: 3s;
}
.page-main .section.sec3 .col-flex .col .dec-flex:hover:before {
    opacity: 0;
    -webkit-transition-duration: .5s;-moz-transition-duration: .5s;-ms-transition-duration: .5s;-o-transition-duration: .5s;transition-duration: .5s;
}

.page-main .section.sec3 .line-container {
    max-height:0; overflow: hidden;
    -webkit-transition: max-height .5s;-moz-transition: max-height .5s;-ms-transition: max-height .5s;-o-transition: max-height .5s;transition: height .5s;
}
.page-main .section.sec3 .col:hover .line-container {
    max-height:100%;
}
.page-main .section.sec3 .line-container .line-ul {opacity:0;}
.page-main .section.sec3 .col:hover .line-container .line-ul {opacity:1;}

@media (max-width:1140px) {
    .page-main .main-tit small {font-size:2.11vw;}
    .page-main .main-tit strong {font-size:7.37vw;}
    .page-main .sec-tit {font-size:2.81vw}
    .page-main .section.sec1 .symbol-wrap .dott.dot1 {left:16.14vw;}
    .page-main .section.sec1 .symbol-wrap .dott.dot2 {left:23.6vw; top:0.61vw;}
    .page-main .section.sec1 .symbol-wrap .dott.dot3 {left:42.46vw; bottom:1.84vw;}

    .page-main .section.sec2 figure img {max-width:51.05vw; width:100%;}
}
@media (max-width:768px) {
    .page-main .main-tit small {font-size:16px;}
    .page-main .sec-tit {font-size:20px;}
    .page-main .more {margin-top:20px;}

    .page-main .section.sec2 .img-flex,
    .page-main .section.sec2 .col-left,
    .page-main .section.sec2 .col-right {width:100%;padding:0; text-align: center;}
    .page-main .section.sec2 .img-flex {margin-top:50px;}
    .page-main .section.sec2 figure {padding:0 10px;text-align: center;}
    .page-main .section.sec2 figure img {max-width:350px;}
    .page-main .section.sec2 .col-right {margin-top:20px;}

    .page-main .section.sec3 .col-flex,
    .page-main .section.sec3 .col-flex .col,
    .page-main .section.sec3 .col-flex .col:nth-child(2) {display:block; width:100%;}
    .page-main .section.sec3 .col-flex .col {min-height:0;text-align: center; /*padding:30px 10px;*/}
    .page-main .section.sec3 .col-flex .col .dec-wrap {display:block;width:100%;}
    .page-main .section.sec3 .col-flex .col .dec-flex {min-height:0;text-align: center; padding:30px 10px;}
}
@media (max-width:500px) {
    .page-main .section.sec1 .col-left .dec {margin-top:20px;}
    .page-main .section.sec1 .m-main,
    .page-main .section.sec1 .m-main .col-left,
    .page-main .section.sec1 .m-main .col-right {display:block; width:100%;}
    .page-main .section.sec1 .m-main .col-right {padding:0; margin-top:30px;}
    .page-main .section.sec1 .symbol-wrap .dott.dot1 {left:28.6vw}
    .page-main .section.sec1 .symbol-wrap .dott.dot2 {left:42vw;}
    .page-main .section.sec1 .symbol-wrap .dott.dot3 {left:76vw; bottom:4vw;}
}
@media (max-width:320px) {
    .page-main .main-tit strong {font-size:23px;}
    .page-main .section.sec1 .symbol-wrap .dott.dot1 {left:91px}
    .page-main .section.sec1 .symbol-wrap .dott.dot2 {left:134px;}
    .page-main .section.sec1 .symbol-wrap .dott.dot3 {left:243px; bottom:13px;}
}


/*page-company*/
.page-company .article-container {padding-top:80px;}
.page-company .article-container .article {margin-bottom:65px;}
.page-company .article-container .article:last-child {margin-bottom:0;}
.page-company .article-container .article > dt {width:calc(100% - 330px); font-size:14px; padding-right:100px;}
.page-company .article-container .article > dd {width:330px; text-align: right;}
.page-company .article-container .article .tit {font-size:24px; font-weight:700; display:block; line-height:1.2;margin-bottom:20px;}
.page-company .article-container .article .c1 {color:#5d2bae}
.page-company .article-container .article .c2 {color:#ff009c}

.history-container {margin-top:100px; position:relative;border-left:1px solid #050505; margin-left:5px; margin-right:0;}
.history-container > li {display:block; width:100%; text-align: left; position:relative; padding-left:25px;margin-bottom:60px;}
.history-container > li:last-child {margin-bottom:0;}
.history-container > li:before {content:""; display:block ;width:8px; height:8px; border-radius: 100%; position:absolute; left:-4px; top:13px;background:#ff009c;z-index:1;}
.history-container > li:first-child:after,
.history-container > li:last-child:after {content:""; display:block;width:1px; left:-1px; top:0; height:14px;background:#fff; position:absolute; }
.history-container > li:last-child:after {top:20px; height:auto; bottom:0;}
.history-container .year-flex {align-items: flex-start; vertical-align: top;}
.history-container .year-flex > dt {width:75px; font-size:30px; font-weight:700; line-height:1.1}
.history-container .year-flex > dd {width:calc(100% - 75px); padding-left:100px;}
.history-container .month-flex {padding-top:6px; margin-bottom:30px; vertical-align: top; align-items: flex-start}
.history-container .month-flex:last-child {margin-bottom:0;}
.history-container .month-flex > dt {width:90px; font-size:17px; font-weight:700; line-height:1.1; padding-left:15px; position:relative}
.history-container .month-flex > dd {width:calc(100% - 90px); padding-left:60px; font-size:14px;}
.history-container .month-flex > dt:before {content:""; display:block; width:5px; height:5px; border-radius: 100%; background:#5d2bae; position:absolute; left:0; top:50%; margin-top:-2px;}
.history-container .dec {font-size:14px;margin-top:30px;}

.partner-flex {margin-left:-25px;margin-right:-25px; margin-top:100px; align-items: flex-start}
.partner-flex  > li {padding:0 25px; width:25%; margin-bottom:70px;}
.ua-ie-9 .partner-flex {display:block;}
.ua-ie-9 .partner-flex:after {content:""; display:block; width:100%; height:0; visibility: hidden; clear: both}
.ua-ie-9 .partner-flex  > li {float:left;}
.partner-flex .img-box {padding-top:61.34%;}
.partner-flex .dec-wrap {border-top:1px solid #aaa; padding-top:15px; text-align: center; }
.partner-flex .dec-wrap .tit { font-weight:700; display:block;line-height:1.1}
.partner-flex .dec-wrap .dec {font-size:14px;margin-top:5px}

@media (max-width:1140px) {
    .page-company .article-container .article > dt {padding-right:9.77vw;}
    .history-container .year-flex > dd {padding-left:9.77vw;}
    .history-container .month-flex > dd {padding-left:5.26vw;}
}
@media (max-width:768px) {
    .page-company .article-container {padding-left:10px; padding-right:10px}
    .page-company .article-container .article .tit {font-size:18px;}
    .page-company .article-container .article {margin-bottom:30px;}
    .page-company .article-container .article:last-child {margin-bottom:0;}
    .page-company .article-container .article {display:block}
    .page-company .article-container .article > dt,
    .page-company .article-container .article > dd {display:block; width:100%; text-align: center; padding:0;}
    .page-company .article-container .article > dd {margin-top:20px;}
    
    .history-container,
    .partner-flex {margin-top:50px;}
    .history-container .year-flex > dt {font-size:20px;margin-top:6px;}
    .history-container .year-flex > dd {padding-left:0;}
    .history-container .month-flex {padding-top:10px;margin-bottom:20px;}
    .history-container .month-flex:last-child {margin-bottom:0;}
    .history-container .month-flex > dt {font-size:15px;}
    .history-container .month-flex > dd {padding-left:0;}
    
    .partner-flex {margin-left:-10px; margin-right:-10px;}
    .partner-flex  > li {width:33.33%; margin-bottom:30px;padding:0 10px;}
}
@media (max-width:500px) {
    .page-header .page-tit {font-size:30px }
    .page-header .page-dec {font-size:20px;}
    .history-container > li {padding-top:6px;}
    .history-container .year-flex {display:block;}
    .history-container .year-flex > dt,
    .history-container .year-flex > dd {width:100%;}
    .history-container .year-flex > dt {margin-top:0;}
    .history-container .year-flex > dd {margin-top:10px;}
    .partner-flex  > li {width:50%;}
}
@media (max-width:320px) {
    .page-header .page-tit {font-size:30px }
    .page-header .page-dec {font-size:20px;}
}

/*page-vision*/
.page-vision .f1 {text-align: right;margin-top:80px;}
.page-vision .group-ul {margin-top:100px; position:relative;border-top:1px solid #050505; align-items: flex-start;}
.page-vision .group-ul > li {width:20%; text-align: center; position:relative; color:#363636; line-height:1.2; padding:0 5px;padding-top:45px;}
.page-vision .group-ul > li:first-child:after,
.page-vision .group-ul > li:last-child:after {content:""; display:block;width:50%; height:1px;background:#fff; position:absolute; left:0; top:-1px;}
.page-vision .group-ul > li:last-child:after {left:auto; right:0;}
.page-vision .group-ul > li:before {
    content:""; display:block ;width:8px; height:8px; border-radius: 100%; position:absolute; left:50%; top:-4px;background:#ff009c;z-index:1;
    -webkit-transform: translate(-50%, 0);-moz-transform: translate(-50%, 0);-ms-transform: translate(-50%, 0);-o-transform: translate(-50%, 0);transform: translate(-50%, 0);
}
.page-vision .group-ul > li:nth-child(2n+0):before {background:#5d2bad}
.page-vision .group-ul .tit {}
.page-vision .group-ul .dec {font-size:14px;margin-top:30px;}

@media (max-width:768px) {
    .page-vision .group-ul {margin-top:50px; padding-left:50px; border:0;}
    .page-vision .group-ul > li {width:100%; text-align: left; padding:30px 0; padding-left:45px;border-left:1px solid #050505; }
    .page-vision .group-ul > li:first-child:after,
    .page-vision .group-ul > li:last-child:after {width:1px; height:50%;left:-1px; top:0;}
    .page-vision .group-ul > li:last-child:after {right:auto; top:auto; bottom:0;}
    .page-vision .group-ul > li:before {
        left:-4px; top:50%;
        -webkit-transform: translate(0, -50%);-moz-transform: translate(0, -50%);-ms-transform: translate(0, -50%);-o-transform: translate(0, -50%);transform: translate(0, -50%);
    }
    .page-vision .group-ul .dec {margin-top:10px;}
}

/*page-business*/
.page-business .body-container figure {margin-top:100px; text-align: center; padding:0 20px;}

.page-business .dl-flex {margin-top:100px; margin-left:-20px; margin-right:-20px; align-items: flex-start; vertical-align: top;}
.page-business .dl-flex > li  {width:50%; padding:0 20px; margin-bottom:50px;}
.page-business .img-dec dd .tit {color:#000; font-size:28px; font-weight:700; display:block; position:relative}
.page-business .img-dec dd .dec {font-size:14px; margin-top:25px;}
.page-business .img-dec dd .dec strong {display:block;}
.page-business .dl-flex .img-dec {align-items:flex-start; vertical-align: top;}
.page-business .dl-flex .img-dec dt {width:150px; padding-right:20px;}
.page-business .dl-flex .img-dec dd {width:calc(100% - 150px);}
.page-business .dl-flex .img-dec dd .tit {padding-bottom:25px; line-height:1.2; min-height:115px;}
.page-business .dl-flex .img-dec dd .tit:before {content:""; display:block ;height:1px; width:25px; background:#000; position:absolute; left:0; bottom:0;}

.page-business .bd-flex {background:url(../../img/business_bg.jpg) center bottom no-repeat; background-size:100% auto; padding-top:150px; padding-bottom:40px;align-items: flex-start; vertical-align: top;}
.page-business .bd-flex > li {width:33.33%; padding:0 10px; text-align: center;}
.page-business .bd-flex .img-dec,
.page-business .bd-flex .img-dec dt,
.page-business .bd-flex .img-dec dd {display:block; width:100%; text-align: center;}

@media (max-width:768px) {
    .page-business .body-container figure,
    .page-business .dl-flex {margin-top:50px;}
    .page-business .bd-flex {padding-top:100px;}

    .page-business .img-dec dd .tit {font-size:18px; }
    .page-business .dl-flex .img-dec {display:block; text-align: center;}
    .page-business .dl-flex .img-dec dt,
    .page-business .dl-flex .img-dec dd {display:block; width:100%; padding:0;}
    .page-business .dl-flex .img-dec dd .tit {min-height:0;}
    .page-business .dl-flex .img-dec dd .tit:before {
        left:50%;
        -webkit-transform: translate(-50%, 0);-moz-transform: translate(-50%, 0);-ms-transform: translate(-50%, 0);-o-transform: translate(-50%, 0);transform: translate(-50%, 0);
    }
}

@media (max-width:500px) {
    .page-business .dl-flex {display:block; margin-left:0; margin-right:0;}
    .page-business .dl-flex > li {width:100%; padding:0 10px;}
    .page-business .dl-flex .img-dec dd br {display:none;}
    .page-business .bd-flex > li {width:33.33%; padding:0 10px; text-align: center;}

    .page-business .bd-flex,
    .page-business .bd-flex > li {display:block; width:100%; margin-bottom:30px;}
}

/*page-3d*/
.page-3d .article-container {padding-top:100px;}
.page-3d .article {margin-bottom:150px;}
.page-3d .article:last-child {margin-bottom:0;}
.page-3d .article.a1 .tit {font-size:60px; margin-top:30px; color:#000; line-height:1.2; display:block; text-align: center;}

.page-3d .article .article-dec strong {display:block; font-size:30px; line-height:1.1; margin-bottom:10px;}
.page-3d .article .mark-flex {margin-top:60px; margin-left:-20px; margin-right:-20px;}
.page-3d .article .mark-flex > li {padding:0 20px;width:33.33%;}
.page-3d .article.a2 .mark-flex {margin:0;margin-top:80px;}
.page-3d .article.a2 .mark-flex > li {width:25%; text-align: center; padding:0;}
.page-3d .article.a4 .box {border:1px solid #363636; border-radius: 4px; margin-top:70px; text-align: center; padding:40px 10px 20px 10px; position:relative}
.page-3d .article.a4 .box .tit {
    display:inline-block; background:#fff; padding:0 25px; font-size:24px; line-height:1.1; position:absolute; left:50%; top:-12px;
    transform: translate(-50%, 0);
}
.page-3d .article.a4 .box .dec-wrap {margin:0 auto; max-width:880px; }
.page-3d .article.a4 .box .bg {display:block; width:100%; padding:10px; background:#ebebeb; border-radius: 6px; font-size:21px; line-height:1.1; margin-top:15px;}
.page-3d .article.a5 .mark-flex {margin-left:-15px; margin-right:-15px;}
.page-3d .article.a5 .mark-flex > li {margin:0;margin-bottom:30px;width:25%;padding:0 15px; }
.page-3d .article.a5 .mark-flex > li img {border:1px solid #ddd; width:100%;}
.page-3d .article.a6 .mark-flex {margin-left:-10px; margin-right:-10px;}
.page-3d .article.a6 .mark-flex > li {width:50%;padding:0 10px;}
.page-3d .article.a6 .mark-flex .item,
.page-3d .article.a6 .mark-flex .img-box {display:block;width:100%;}
.page-3d .article.a6 .mark-flex .img-box {height:87px; background-size:auto 100%; border-radius: 6px;}
.page-3d .article.a6 .mark-flex .dec-wrap {text-align: center; margin-top:15px;}
.page-3d .article.a6 .mark-flex .dec-wrap .tit { line-height:1.2; font-weight:700; display:block;}
.page-3d .article.a6 .mark-flex .dec-wrap .dec {font-size:14px;margin-top:5px;}

@media (max-width:1140px) {
    .page-3d .article.a1 .tit {font-size:5.26vw;}
    
}
@media (max-width:768px) {
    .page-3d .article-container {padding-top:50px;}
    .page-3d .article {margin-bottom:50px;}
    .page-3d .article:last-child {margin-bottom:0;}
    .page-3d .article .article-dec strong {font-size:18px;}
    .page-3d .article .mark-flex,
    .page-3d .article.a2 .mark-flex {margin-top:40px;}
    .page-3d .article .mark-flex {margin-left:-5px; margin-right:-5px;}
    .page-3d .article .mark-flex > li {padding:0 5px;}
    .page-3d .article.a4 .box {padding-top:60px}
    .page-3d .article.a4 .box .tit,
    .page-3d .article.a4 .box .bg {font-size:20px;}
    .page-3d .article.a4 .box .tit {top:-10px;white-space: nowrap}
    .page-3d .article.a5 .mark-flex > li {width:50%;}
    .page-3d .article.a6 .mark-flex {margin-left:-5px; margin-right:-5px;}
    .page-3d .article.a6 .mark-flex > li {padding:0 5px;}
    .page-3d .article.a6 .mark-flex .img-box {padding-top:23.9%; height:auto;}
}
@media (max-width:500px) {
    .page-3d .article .mark-flex > li {width:100%; margin-bottom:10px;}
    .page-3d .article.a5 .mark-flex {margin-left:-5px; margin-right:-5px;}
    .page-3d .article.a5 .mark-flex > li {padding:0 5px;margin-bottom:5px;}
    .page-3d .article.a6 .mark-flex > li {width:100%; margin-bottom:20px;}
    .page-3d .article.a6 .mark-flex > li:last-child {margin-bottom:0;}
}

/*page-beauty*/
.page-beauty .sec-header .dec {margin-top:45px; }
.page-beauty .body-container figure {padding:180px 0 80px 0;}
.page-beauty .btn-container {text-align: center; margin-left:-8px; margin-right:-8px;}
.page-beauty .btn-container > li {display:inline-block; margin:0 6px;margin-bottom:20px; }
.page-beauty .btn-container .item {height:40px; line-height:38px; width:210px;color:#5d2bae; white-space: nowrap;border-radius: 4px;}
.page-beauty .btn-container > li:nth-child(2n+0) .item {color:#ff009c}
.page-beauty .article {padding-top:220px;}
.page-beauty .brand-flex {padding-top:60px;margin-left:-15px; margin-right:-15px;}
.page-beauty .brand-flex  > li {width:50%; padding:0 15px; margin-bottom:40px;}
.page-beauty .brand-flex .item {display:block; width:100%; text-align: center;}
.page-beauty .brand-flex .img-box {height:85px; width:100%; background-size:auto 100%;border-radius: 4px;}
.page-beauty .brand-flex .tit {display:block; margin-top:15px;  line-height:1.1;  font-weight:700;}
.page-beauty .brand-flex .dec {margin-top:5px;  line-height:1.1; font-size:14px; }

@media (max-width:768px) {
    .page-beauty .body-container figure {padding:50px 0 20px 0;}
    .page-beauty .btn-container {margin-left:-5px; margin-right:-5px; display:flex; flex-wrap:wrap}
    .page-beauty .btn-container > li {margin-left:0; margin-right:0; padding:0 5px; width:33.33%;}
    .page-beauty .btn-container .item {width:100%;}

    .page-beauty .article {padding-top:50px;}
    .page-beauty .brand-flex {margin-left:-5px; margin-right:-5px;}
    .page-beauty .brand-flex  > li {padding:0 5px;}
    .page-beauty .brand-flex .img-box {height:auto; padding-top:23%; }
    .page-beauty .brand-flex .tit {font-size:16px;}
}
@media (max-width:600px) {
    .page-beauty .btn-container > li {width:50%;}
    .page-beauty .btn-container .item {font-size:12px;}
}
@media (max-width:400px) {
    .page-beauty .brand-flex  > li {width:100%;}
}

/*.page-ecommerce*/
.page-ecommerce .article-container {margin-top:150px;}
.page-ecommerce .article {margin-bottom:150px;}
.page-ecommerce .article-tit {display:block; line-height:1.2;font-size:30px;font-weight:700;text-align: left;}
.page-ecommerce .article-tit small {font-size:18px; display:inline-block}
.page-ecommerce .article-tit + .dec {margin-top:10px;}
.page-ecommerce .article.a1 figure {margin-top:60px;}
.page-ecommerce .article.a1 .img-flex {margin-left:-25px; margin-right:-25px; margin-top:85px;}
.page-ecommerce .article.a1 .img-flex > li {padding:0 25px; width:50%;}
.page-ecommerce .article.a1 .img-flex > li img{display:block; width:100%;}
.page-ecommerce .link-container {margin-top:125px;}
.page-ecommerce .link-flex {margin-top:30px; margin-left:-10px; margin-right:-10px; vertical-align: top; align-items: flex-start}
.page-ecommerce .link-flex > li {padding:0 10px; margin-bottom:30px; width:50%;}
.page-ecommerce .link-flex .item,
.page-ecommerce .link-flex .item .btn {display:block; width:100%; text-align: center;}
.page-ecommerce .link-flex .item .btn {border-radius: 6px; background-size:auto 100%; height:87px;}
.page-ecommerce .link-flex .item .dec-wrap {margin-top:15px;}
.page-ecommerce .link-flex .item .dec-wrap .tit {display:block; font-weight:700; line-height:1.2}
.page-ecommerce .link-flex .item .dec-wrap .dec {font-size:14px;margin-top:5px;}

.page-ecommerce .article.a2 .img-flex {margin-top:70px; margin-left:-25px; margin-right:-25px; }
.page-ecommerce .article.a2 .img-flex > li {padding:0 25px; width:33.33%;}
.page-ecommerce .article.a2 .link-flex {justify-content: center}

@media (max-width:768px) {
    .page-ecommerce .article-container,
    .page-ecommerce .link-container {margin-top:50px;}
    .page-ecommerce .article {margin-bottom:50px;}
    .page-ecommerce .article:last-child {margin-bottom:0;}
    
    .page-ecommerce .article-tit {font-size:20px;}
    .page-ecommerce .article-tit small {font-size:14px;}
    .page-ecommerce .article.a1 figure,
    .page-ecommerce .article.a1 .img-flex,
    .page-ecommerce .article.a2 .img-flex {margin-top:30px;}
    
    .page-ecommerce .article.a1 .img-flex,
    .page-ecommerce .article.a2 .img-flex {margin-left:-10px; margin-right:-10px;}
    .page-ecommerce .article.a1 .img-flex > li,
    .page-ecommerce .article.a2 .img-flex > li {padding:0 10px;}
    
    .page-ecommerce .link-flex .item .btn {padding-top:23.9%; height:auto;}
}
@media (max-width:500px) {
    .page-ecommerce .article.a1 .img-flex > li,
    .page-ecommerce .article.a2 .img-flex > li {width:100%; margin-bottom:30px;}
    .page-ecommerce .article.a1 .img-flex > li:last-child,
    .page-ecommerce .article.a2 .img-flex > li:last-child {margin-bottom:0;}
    .page-ecommerce .link-flex > li {width:100%;}
}
/*page-contact*/
.page-contact .info-flex {margin-top:60px;}
.page-contact .info-flex .col {width:50%; padding-right:10px;}
.page-contact .info-flex dl,
.page-contact .info-flex dl dt,
.page-contact .info-flex dl dd {width:100%; }
.page-contact .info-flex dl {margin-bottom:80px;}
.page-contact .info-flex dl:last-child {margin-bottom:0;}
.page-contact .info-flex dl dt {color:#000; font-size:24px; font-weight:700;}
.page-contact .info-flex dl dd {color:#363636;  margin-top:10px;}
.page-contact .info-flex .btn {height:60px; line-height:58px;max-width:285px;width:100%; margin-top:30px; border-radius: 6px;}

.page-contact .contact-container {margin-top:45px; padding:55px; background:#363636; color:#fff;}
.page-contact .contact-container .btn {font-size:14px; padding:0 30px; line-height:28px; height:30px;}
.tbl-flex {margin-left:-30px; margin-right:-30px;}
.tbl-flex .col {padding:0 30px; width:100%; padding-bottom:15px;}
.tbl-flex .col:last-child {padding-bottom:0;}

.page-contact .contact-container .btn {font-size:14px; padding:0 30px; line-height:28px; height:30px;}
.page-contact .contact-container .btn-right {padding-top:40px;}

@media (max-width:768px) {
    .page-contact .info-flex dl {margin-bottom:30px;}
    .page-contact .info-flex dl:last-child {margin-bottom:0;}
    .page-contact .info-flex .col {width:100%; padding-right:0; margin-bottom:20px;}
    .page-contact .info-flex .col:last-child {margin-bottom:0;}
    .page-contact .contact-container {padding:20px 10px;}
}