/*===============================================
	TRAIANGLE WORLDページスタイル
===============================================*/

/*---------------------------
    worldMain
----------------------------*/
#worldMain {
    position: relative;
    width: 100%;
    margin-top: 5px;
}

#worldMain .content-wrapper {
    width: 854px;
    margin: 0 auto;
    padding: 42px 0 52px;
}

/*---------------------------
    photo-area
----------------------------*/
.photo-area {
    margin-top: 45px;
}

/*slider*/
.bx-wrapper {
    margin-bottom: 0;
}
.bx-wrapper .bx-viewport {
    border: none;
    box-shadow: none;
    left: 0;
    transform: none;
    z-index: 0;
}
.photo-area .slider-box {
    margin-top: 10px;
}
.photo-area .main-slider {
    height: 506px;
    overflow: hidden;
}
.photo-area .thum-list {
    width: 100%;
    height: 138px;
    margin-top: 4px;
    padding: 7px 0;
    text-align: center;
    font-size: 0;
    background: #000;
}
.photo-area .thum-list li {
    display: inline-block;
    width: 210px;
    margin-left: 12px;
}
.photo-area .thum-list li img  {
    width: 100%;
    height: auto;
}
.photo-area .thum-list a {
    display: inline-block;
}
.photo-area .thum-list .active {
    border: solid 2px #fff100;
}


/*---------------------------
    direction-area
----------------------------*/
.direction-area .intro-box {
    z-index: 1;
    position: relative;
}
.direction-area {
    position: relative;
    margin-top: 55px;
}
.direction-area .animate-wrap {
    position: relative;
    width: 100%;
    height: 100%;
}
.direction-area .anime-layer {
    position: absolute;
    width: 100%;
    height: 100%;
}
.direction-area .anime-layer2 {
    position: absolute;
    width: 100%;
    height: 100%;
}
.direction-area .anime-layer3 {
    position: absolute;
    width: 100%;
    height: 100%;
}
.direction-area .section01 {
    position: relative;
    margin-top: 40px;
    z-index: 1;
}
.direction-area .section02 {
    position: relative;
    margin-top: 39px;
    z-index: 3;
}
.direction-area .section03 {
    position: relative;
    margin-top: 35px;
    margin-bottom: 180px;
    z-index: 3;
}

/*anime*/
.direction-area .image-box01 {
    position: absolute;
    top: -32px;
    right: 14px;
    
}
.direction-area .image-box01 .anime-layer {
    background: url(../img/world_vol03_imagebox01_layer01.png) no-repeat;
    width: 96%;
    opacity: 1;
    z-index: 3;
}
.direction-area .image-box01 .anime-layer2 {
    background: url(../img/world_vol03_imagebox01_layer02.png) no-repeat;
    height: 23.5%;
    opacity: 1;
    z-index: 2;
}
.direction-area .image-box01 .anime-layer3 {
    background: url(../img/world_vol03_imagebox01_layer03.png) no-repeat;
    width: 64%;
    height: 71%;
    opacity: 1;
    z-index: 1;
}

.direction-area .image-box02 {
    position: absolute;
    top: 486px;
    right: 0;
}
.direction-area .image-box02 .anime-layer {
    background: url(../img/world_vol03_imagebox02_layer01.png) no-repeat;
    height: 0;
    z-index: 2;
    opacity: 1;
}
.direction-area .image-box02 .anime-layer2 {
    background: url(../img/world_vol03_imagebox02_layer02.png) no-repeat;
    height: 30%;
    z-index: 1;
    opacity: 1;
}