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

html{
    height:auto;
}

body{
    background:#333;
    height: 100%;
    margin:0;
    font-size:0.8em;
    color: #fff;
}

/*------------------------------
header
------------------------------*/
.area-header{
    line-height: 1em;
    background:#333;
    display: table;
    max-width:530px;
    width:100%;
    margin:0 auto;
    text-align:left;
    font-size:1em;
}

.area-header-left{
    display: table-cell;
    margin:0;
    padding:4px 10px;
    vertical-align: middle;
}

.btn-pagination{
    border:1px solid #fff;
    padding:5px 18px;
    margin:0;
    display:inline-block;
    cursor: pointer;
}

.btn-header{
    display: table-cell;
    padding:5px 10px;
    text-align: right;
    vertical-align: middle;
    white-space: nowrap;
}

.btn-header a{
    display:inline-block;
    padding:5px 0;
    color:#fff;
    text-decoration:underline;
     text-align: left;
}

/*------------------------------
swiper
------------------------------*/
.swiper-container{
    position:relative;
}

.swiper-slide {
    padding:0 20px;
    overflow-y: auto;
    direction:ltr;
}

.swiper-slide p{
    height:auto;
}

.swiper-slide img {
    max-width:100%;
    height:auto;
    vertical-align: bottom;
}

.area-swiper-button{
    position: absolute;
    max-width: 530px;
    z-index: 999;
    bottom:2px;
    left:0;
    right:0;
    margin:auto;
}

.swiper-button-prev,
.swiper-button-next{
    height:auto;
    width:auto;
    border:1px solid #fff;
    line-height:1em;
    padding: 5px;
    background:#333;
}

.swiper-button-prev,
.swiper-container-rtl .swiper-button-next {
    left: 10px;
    background-position:left;
    padding-left:20px;
    background-image:none;
}

.swiper-button-next,
.swiper-container-rtl .swiper-button-prev {
    right: 10px;
    background-position: right;
    padding-right:20px;
    background-image:none;
}

.txt-even{
	display: block;
	position: static;
    line-height:1.8em;
    padding-top:7px;
	padding-bottom:0px;
}

/*------------------------------
pagination
------------------------------*/
.area-pagination{
    width: 100%;
}

#toggle-pagination{
    position: absolute;
    z-index: 1000;
    top:0;
    width:100%;
    padding:10px;
    box-sizing: border-box;
    display: none;
    background:rgba(0,0,0,.7);
    text-align: center;
}

.hide{
    display: inline-block;
    padding:9px 18px;
    line-height:1em;
    margin:0 0 6px 4px;
    text-align: center;
    border:1px solid #fff;
    text-align:left;
    cursor: pointer;
}

.swiper-pagination{
    position:static;
    color:#fff;
    margin:0 auto;
    text-align: left;
}

.swiper-pagination-bullet{
    display: block;
    display: inline-block;
    opacity: 1;
    background:none;
    padding:4px;
    text-align: center;
}

.swiper-pagination-bullet-active{
    background: #005f8c;
}
.next-story p{
    max-width: 518px;
}
.next-story p:before {
    padding-top: 142%;
}