/*reset*/
@charset "utf-8";
/* CSS Document */

html,body,div,span,object,embed,iframe,h1,h2,h3,h4,h5,h6,p,pre,a,cite,code,del,dfn,em,img,strong,sub,sup,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,tbody,tfoot,thead,tr,th,td,section,article{margin:0;padding:0;-webkit-text-size-adjust:none;}
html{overflow-y:scroll; overflow-x:hidden;}
table{border-collapse:collapse; border-spacing:0;}
img{border:none;display:block;}
ul,li,ol {list-style:none;}
i,em,cite,dfn{font-style:normal;}
.clearfix:after {content: ".";display: block;height: 0;clear: both;visibility: hidden;}
.clearMargin:before{content: "";display: table;height: 0;clear: both;visibility: hidden;}
.clearfix{*display:inline-block;*zoom:100%;}
.clearMargin:before{content: "";display: table;height: 0;clear: both;visibility: hidden;}
.clear{clear:both; line-height:1px; height:1px; *display:inline; font-size:1px;}
.fl{float:left;}
.fr{float:right;}
.alignL{text-align:left;}
.alignC{text-align:center;}
.alignR{text-align:right;}
.middle{vertical-align:middle;}
.relative{position:relative;}
.absolute{position:absolute;}
.none{display:none;}
.block{display:block;}
.overf{overflow:hidden;}
.center{margin:0 auto;}
:focus,a{outline:none; -moz-outline-style:none;}
a:visited,a:link{text-decoration:none;}
a:hover {text-decoration:none;}
.yellow{color:#fff954;}
.font_14{font-size:14px;}
.font_16{font-size:16px;}
.mt15 {margin-top: 15px;}
.mr20{margin-right:20px;}
.mb25{margin-bottom:25px;}
.z10{z-index:10;}
.z20{z-index:20;}
.z30{z-index:30;}
body{font:13px/1.6 "Microsoft YaHei","\5FAE\8F6F\96C5\9ED1",tahoma,Arial; color:#333;}


/*body*/
.wrap{
    position: relative;
    max-width: 1920px;
    /*min-width: 1200px;*/
    margin: 0 auto;
    overflow: hidden;
    height: 1080px;
}
.wrap02{
    background:url("https://static.web.sdo.com/dn/pic/dn_19act/2019IONA/wrap01_bg.jpg")  no-repeat center;
}
.wrap02 .contain {
    position: relative;
    width: 1000px;
    height: 1080px;
    margin: 0 auto;
    background:url("https://static.web.sdo.com/dn/pic/dn_19act/2019IONA/wrap01_cen.jpg")  no-repeat center;
}
.logo{
    width: 201px;
    height: 47px;
    background:url("https://static.web.sdo.com/dn/pic/dn/web10/logo.png?a3")  no-repeat center;
    right: 50px;
    bottom: 37px;
    z-index: 10000;
}
.nav{
    width: 465px;
    height: 225px;
    margin: 554px 0 0 444px;
}
.a1 .txt {
    top: 112px;
    right: 30px;
}
.a2 .txt {
    top: 112px;
    right: -17px;
}
.a3 .txt {
    top: 112px;
    right: 25px;
}
.nav .a{
    width: 100px;
    height: 101px;
    top: 0;
    left: 0;
}
.nav .a1{
    top: 0;
    left: 0;
}
.nav .a2{
    top: 0;
    left: 190px;
}
.nav .a3{
    top: 0;
    left: 380px;
}
.nav .nav_bg{
    display: block;
    width: 100px;
    height: 100px;
}
.a1{
    /*background: url("https://static.web.sdo.com/dn/pic/dn_18act/201808Aisha/wq_icon.png") no-repeat center;*/
}
.a2{
    /*background: url("https://static.web.sdo.com/dn/pic/dn_18act/201808Aisha/sjt_icon.png") no-repeat center;*/
}
.a3{
    /*background: url("https://static.web.sdo.com/dn/pic/dn_18act/201808Aisha/xl_icon.png") no-repeat center;*/
}
.nav>a:hover .nav_bg{
    -webkit-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    transform: rotate(360deg);
    transition: transform 0.5s linear;
}
.a1 .nav_bg{
    background: url("https://static.web.sdo.com/dn/pic/dn_19act/2019IONA/wq_icon.png") no-repeat center;
}
.a2 .nav_bg{
    background: url("https://static.web.sdo.com/dn/pic/dn_19act/2019IONA/sjt_icon.png") no-repeat center;
}
.a3 .nav_bg{
    background: url("https://static.web.sdo.com/dn/pic/dn_19act/2019IONA/xl_icon.png") no-repeat center;
}
.a1:hover .nav_bg{
    background: url("https://static.web.sdo.com/dn/pic/dn_19act/2019IONA/wq_icon_h.png") no-repeat center;
}
.a2:hover .nav_bg{
    background: url("https://static.web.sdo.com/dn/pic/dn_19act/2019IONA/sjt_icon_h.png") no-repeat center;
}
.a3:hover .nav_bg{
    background: url("https://static.web.sdo.com/dn/pic/dn_19act/2019IONA/xl_icon_h.png") no-repeat center;
}
.detail_nav{
    width: 500px;
    top: 745px;
    left: 461px;
}
.detail_nav span{
    -webkit-opacity:0;
    -moz-opacity:0;
    opacity:0;
    filter:alpha(opacity=0);
}
.detail_nav>li{
    width: 137px;
    height: 44px;
    float: left;
    filter:alpha(opacity=0);
}
.detail_nav>li:hover{
    cursor: pointer;
}
.margin_r{
    margin-right: 41px;
}
.show_box{
    width: 148px;
    height: 336px;
    background:url("https://static.web.sdo.com/dn/pic/dn_act/2017irin/show.png")  no-repeat center;
    top: 145px;
    left: 30px;
}
.look{
    top: 25px;
    left: 25px;
    -webkit-animation: moveDown 0.4s linear 1 both;
    -o-animation: moveDown 0.4s linear 1 both;
    animation: moveDown 0.4s linear 1 both;
    -moz-animation: moveDown 0.4s linear 1 both;
}
@keyframes moveDown {
    from{
        -webkit-transform: translateY(-30px);
        -moz-transform: translateY(-30px);
        -ms-transform: translateY(-30px);
        -o-transform: translateY(-30px);
        transform: translateY(-30px);
        opacity: 0;
    }
    to{
        -webkit-transform: translateY(0px);
        -moz-transform: translateY(0px);
        -ms-transform: translateY(0px);
        -o-transform: translateY(0px);
        transform: translateY(0px);
        opacity: 1;
    }
}
@-moz-keyframes moveDown {
    from{
        -webkit-transform: translateY(-30px);
        -moz-transform: translateY(-30px);
        -ms-transform: translateY(-30px);
        -o-transform: translateY(-30px);
        transform: translateY(-30px);
        opacity: 0;
    }
    to{
        -webkit-transform: translateY(0px);
        -moz-transform: translateY(0px);
        -ms-transform: translateY(0px);
        -o-transform: translateY(0px);
        transform: translateY(0px);
        opacity: 1;
    }
}
@-webkit-keyframes moveDown {
    from{
        -webkit-transform: translateY(-30px);
        -moz-transform: translateY(-30px);
        -ms-transform: translateY(-30px);
        -o-transform: translateY(-30px);
        transform: translateY(-30px);
        opacity: 0;
    }
    to{
        -webkit-transform: translateY(0px);
        -moz-transform: translateY(0px);
        -ms-transform: translateY(0px);
        -o-transform: translateY(0px);
        transform: translateY(0px);
        opacity: 1;
    }
}
.show_txt{
    top: 145px;
    right: 27px;
    -webkit-animation: moveUp 0.4s linear 1 both;
    -o-animation: moveUp 0.4s linear 1 both;
    animation: moveUp 0.4s linear 1 both;
    -moz-animation: moveUp 0.4s linear 1 both;
}
@keyframes moveUp {
    from{
        -webkit-transform: translateY(30px);
        -moz-transform: translateY(30px);
        -ms-transform: translateY(30px);
        -o-transform: translateY(30px);
        transform: translateY(30px);
        opacity: 0;
    }
    to{
        -webkit-transform: translateY(0px);
        -moz-transform: translateY(0px);
        -ms-transform: translateY(0px);
        -o-transform: translateY(0px);
        transform: translateY(0px);
        opacity: 1;
    }
}
@-moz-keyframes moveUp {
    from{
        -webkit-transform: translateY(30px);
        -moz-transform: translateY(30px);
        -ms-transform: translateY(30px);
        -o-transform: translateY(30px);
        transform: translateY(30px);
        opacity: 0;
    }
    to{
        -webkit-transform: translateY(0px);
        -moz-transform: translateY(0px);
        -ms-transform: translateY(0px);
        -o-transform: translateY(0px);
        transform: translateY(0px);
        opacity: 1;
    }
}
@-webkit-keyframes moveUp {
    from{
        -webkit-transform: translateY(30px);
        -moz-transform: translateY(30px);
        -ms-transform: translateY(30px);
        -o-transform: translateY(30px);
        transform: translateY(30px);
        opacity: 0;
    }
    to{
        -webkit-transform: translateY(0px);
        -moz-transform: translateY(0px);
        -ms-transform: translateY(0px);
        -o-transform: translateY(0px);
        transform: translateY(0px);
        opacity: 1;
    }
}
/*ÂÖ²¥*/

.clearfloat:after {
    content: "";
    display: table;
    height: 0;
    clear: both;
    visibility: hidden;
}
.banner,.banner01 {
    width: 860px;
    height: 470px;
    position: relative;
    margin: 20px auto;
}
.banner01{
    display: none;
}
.banner{
    margin:0;
}
.banner ul li {
    height: 100%;
    width: 100%;
    position: absolute;
    display: none;
    z-index:10;
}
.banner ul li a {
    display: block;
    width: 100%;
    height: 100%;
}
.banner .cut {
    position: absolute;
    width: 80px;
    height: 40px;
    top: 42%;
    left: 42%;
    z-index: 20000;
    -webkit-opacity:0;
    -moz-opacity:0;
    opacity:0;
    filter:alpha(opacity=0);
    display: none;
}
.banner:hover .cut{
    display: block;
}
.banner_btn:hover{
    display: block;
}
.banner .cut:hover {
    cursor: pointer;
}
.banner_btn{
    width: 73px;
    height: 73px;
    top: 50%;
    left: 50%;
    margin: -37px 0 0 -37px;
    z-index: 9999;
    display: none;
}
.banner .prev {
    margin: -3px 0 0 26px;
}
.banner .next {
    margin: 37px 0 0 26px;
}
.banner01 .indicator {
    position: absolute;
    width: 100%;
    left: 25px;
    bottom: -55px;
    text-align: right;
    z-index: 20;
}
.banner01 .indicator a {
    display: inline-block;
    width: 8px;
    height: 8px;
    margin: 0 5px;
    border:3px solid #00B7EE;
    border-radius:50%;
    background:#00B7EE;
}
.banner01 .indicator a.cur {
    border:3px solid #00B7EE;
    border-radius:50%;
    background:transparent;
}
.banner li img{
    width: 471px;
    height: 470px;
}
.gallery_clothes {
    float: left;
    animation: clothes 1s both;
}
.gallery__clothes--r {
    margin-left: -82px;
    animation: clothesRight 1s both;
}
@keyframes clothes {
    0%{opacity:0;-webkit-transform:translate3d(0,-100px,0);transform:translate3d(0,-100px,0)}
    100%{opacity:1;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}
}
@-ms-keyframes clothes {
    0%{opacity:0;-webkit-transform:translate3d(0,-100px,0);transform:translate3d(0,-100px,0)}
    100%{opacity:1;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}
}
@-webkit-keyframes clothes {
    0%{opacity:0;-webkit-transform:translate3d(0,-100px,0);transform:translate3d(0,-100px,0)}
    100%{opacity:1;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}
}
@-moz-keyframes clothes {
    0%{opacity:0;-webkit-transform:translate3d(0,-100px,0);transform:translate3d(0,-100px,0)}
    100%{opacity:1;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}
}
@keyframes clothesRight{
    0%{opacity:0;-webkit-transform:translate3d(0,100px,0);transform:translate3d(0,100px,0)}
    100%{opacity:1;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}
}
@-ms-keyframes clothesRight{
    0%{opacity:0;-webkit-transform:translate3d(0,100px,0);transform:translate3d(0,100px,0)}
    100%{opacity:1;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}
}
@-webkit-keyframes clothesRight{
    0%{opacity:0;-webkit-transform:translate3d(0,100px,0);transform:translate3d(0,100px,0)}
    100%{opacity:1;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}
}
@-moz-keyframes clothesRight{
    0%{opacity:0;-webkit-transform:translate3d(0,100px,0);transform:translate3d(0,100px,0)}
    100%{opacity:1;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}
}
.banner li img.li03{
    width: 100%;
}
.video_btn{
    display: block;
    width: 80px;
    height: 85px;
    top: 113px;
    right: 112px;
    background: url(about:blank) no-repeat center top;
}
.video_btn .inner{
    -webkit-animation: in_scale 1.5s linear infinite alternate both;
    -o-animation: in_scale 1.5s linear infinite alternate both;
    animation: in_scale 1.5s linear infinite alternate both;
    -moz-animation: in_scale 1.5s linear infinite alternate both;
}
.video_btn .out{
    -webkit-animation: v_rotate 1.5s linear infinite both;
    -o-animation: v_rotate 1.5s linear infinite both;
    animation: v_rotate 1.5s linear infinite both;
    -moz-animation:v_rotate 1.5s linear infinite both;
}
@keyframes v_rotate {
    100%{
        -webkit-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -ms-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}
@-webkit-keyframes v_rotate {
    100%{
        -webkit-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -ms-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}
@-moz-keyframes v_rotate {
    100%{
        -webkit-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -ms-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}
@-ms-keyframes v_rotate {
    100%{
        -webkit-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -ms-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}


@keyframes in_scale {
    0% {
        -moz-transform: scale(1);
        transform: scale(1)
    }
    100% {
        -moz-transform: scale(.7);
        transform: scale(.7)
    }
}
@-webkit-keyframes in_scale {
    0% {
        -moz-transform: scale(1);
        transform: scale(1)
    }
    100% {
        -moz-transform: scale(.7);
        transform: scale(.7)
    }
}
@-moz-keyframes in_scale {
    0% {
        -moz-transform: scale(0.9);
        transform: scale(0.9)
    }
    100% {
        -moz-transform: scale(.7);
        transform: scale(.7)
    }
}
@-ms-keyframes in_scale {
    0% {
        -moz-transform: scale(0.9);
        transform: scale(0.9)
    }
    100% {
        -moz-transform: scale(.7);
        transform: scale(.7)
    }
}
/*µ¯²ã*/
.detail {
    z-index: 9999;
    width: 100%;
    height: 1080px;
    top: 0;
    left: 0;
    background:rgba(0,0,0,0.7);
    display: none;
}
.detail .contain_box {
    width: 1000px;
    height: 1080px;
    margin: 0 auto;
}
.return{
    display: block;
    width: 60px;
    height: 60px;
    background: url("https://static.web.sdo.com/dn/pic/dn_19act/2019IONA/close.png") no-repeat center;
    color: #fff;
    font-size: 20px;
    right: -24px;
    top: 180px;
    z-index: 1000;
}
.detail .tit {font-size:36px; font-weight:bold; color:#fff; line-height:1.1; position:absolute; left:55px; top: 135px;}

/*detail*/
.detail_box{
    width: 900px;
    height: 510px;
    border:1px solid #01AFE6;
    top:190px;
    left:55px;
}

.detail_nav{
    width: 530px;
    top: 735px;
    left:56px;
}
.detail_nav span{
    -webkit-opacity:0;
    -moz-opacity:0;
    opacity:0;
    filter:alpha(opacity=0);
}
.detail_nav>li{
    width: 147px;
    height: 44px;
    line-height:44px;
    font-size:20px;
    text-align:center;
    float: left;
    border:1px solid #00B7EE;
    color:#fff;

}
.detail_nav>li:hover, .detail_nav>li.hover{
    cursor: pointer;
    background:#00B7EE;
    border:1px solid #00B7EE;
}

.detail_nav .wing {font-size:16px;}

.margin_r{
    margin-right: 36px;
}
.show_box{
    width: 148px;
    height: 336px;
    background:url("https://static.web.sdo.com/dn/pic/dn_act/2017irin/show.png")  no-repeat center;
    top: 145px;
    left: 30px;
}
.look{
    top: 25px;
    left: 25px;
    -webkit-animation: moveDown 0.4s linear 1 both;
    -o-animation: moveDown 0.4s linear 1 both;
    animation: moveDown 0.4s linear 1 both;
    -moz-animation: moveDown 0.4s linear 1 both;
}
@keyframes moveDown {
    from{
        -webkit-transform: translateY(-30px);
        -moz-transform: translateY(-30px);
        -ms-transform: translateY(-30px);
        -o-transform: translateY(-30px);
        transform: translateY(-30px);
        opacity: 0;
    }
    to{
        -webkit-transform: translateY(0px);
        -moz-transform: translateY(0px);
        -ms-transform: translateY(0px);
        -o-transform: translateY(0px);
        transform: translateY(0px);
        opacity: 1;
    }
}
@-moz-keyframes moveDown {
    from{
        -webkit-transform: translateY(-30px);
        -moz-transform: translateY(-30px);
        -ms-transform: translateY(-30px);
        -o-transform: translateY(-30px);
        transform: translateY(-30px);
        opacity: 0;
    }
    to{
        -webkit-transform: translateY(0px);
        -moz-transform: translateY(0px);
        -ms-transform: translateY(0px);
        -o-transform: translateY(0px);
        transform: translateY(0px);
        opacity: 1;
    }
}
@-webkit-keyframes moveDown {
    from{
        -webkit-transform: translateY(-30px);
        -moz-transform: translateY(-30px);
        -ms-transform: translateY(-30px);
        -o-transform: translateY(-30px);
        transform: translateY(-30px);
        opacity: 0;
    }
    to{
        -webkit-transform: translateY(0px);
        -moz-transform: translateY(0px);
        -ms-transform: translateY(0px);
        -o-transform: translateY(0px);
        transform: translateY(0px);
        opacity: 1;
    }
}
.show_txt{
    top: 145px;
    right: 27px;
    -webkit-animation: moveUp 0.4s linear 1 both;
    -o-animation: moveUp 0.4s linear 1 both;
    animation: moveUp 0.4s linear 1 both;
    -moz-animation: moveUp 0.4s linear 1 both;
}
@keyframes moveUp {
    from{
        -webkit-transform: translateY(30px);
        -moz-transform: translateY(30px);
        -ms-transform: translateY(30px);
        -o-transform: translateY(30px);
        transform: translateY(30px);
        opacity: 0;
    }
    to{
        -webkit-transform: translateY(0px);
        -moz-transform: translateY(0px);
        -ms-transform: translateY(0px);
        -o-transform: translateY(0px);
        transform: translateY(0px);
        opacity: 1;
    }
}
@-moz-keyframes moveUp {
    from{
        -webkit-transform: translateY(30px);
        -moz-transform: translateY(30px);
        -ms-transform: translateY(30px);
        -o-transform: translateY(30px);
        transform: translateY(30px);
        opacity: 0;
    }
    to{
        -webkit-transform: translateY(0px);
        -moz-transform: translateY(0px);
        -ms-transform: translateY(0px);
        -o-transform: translateY(0px);
        transform: translateY(0px);
        opacity: 1;
    }
}
@-webkit-keyframes moveUp {
    from{
        -webkit-transform: translateY(30px);
        -moz-transform: translateY(30px);
        -ms-transform: translateY(30px);
        -o-transform: translateY(30px);
        transform: translateY(30px);
        opacity: 0;
    }
    to{
        -webkit-transform: translateY(0px);
        -moz-transform: translateY(0px);
        -ms-transform: translateY(0px);
        -o-transform: translateY(0px);
        transform: translateY(0px);
        opacity: 1;
    }
}