﻿@import url(/jquery/plugin/swiper/css/swiper.min.css);
@import url(/css/basic.css);
@import url(/css/snslayer.css);

.container { width:100%;min-width:320px;}
.sns { position:fixed; top: 7px;right:7px;z-index:10;}
.sns .menu_box {
	float:left; position:relative; left:0; top:0;
	z-index:1;width:204px;overflow:hidden;height:41px;
}
.sns .menu_box img { margin-right: 20px;}
.sns .menu_box img:last-child { margin-right: 8px;}
.sns .button { float:left; }
.sns .button img { width:44px; height:auto;display:block; }
.sns .menu_box .menu { border:1px solid #3e4142; background:#d6edf1;padding: 3px 0 3px 3px;
	height:33px; margin: 0 0 0 0; border-right: 0;width:200px;position:absolute;left:204px;top:0;}
.sns .menu_box .menu img { float: left; }
.sns.sel .menu_box .menu { left:0px; }

.btnarrow { position:fixed; left:0; width:100%;top:50%;height:32px;display:block;z-index:2;margin-top:-12px; }
.btnarrow a { 
	background: url("https://img.nocutnews.co.kr/mnocut/v2/story/interview/btn_pagearrow_a.png") no-repeat;
	background-size: auto 62px; text-indent:-3000em; width:28px; height:31px;display:block;
}
.btnarrow a.prev { background-position: 0 0;float:left; }
.btnarrow a.next { background-position: 0 -31px;float:right;}
.firstpage .btnarrow a.prev { display:none; }
.firstpage .replyarrow { display:none; }
.lastpage .btnarrow a.next { display:none; }
.lastpage .replyarrow { display:none; }
.lastpage .sns { top:39%; }
.swiper-container { width:100%; overflow: hidden; }
.swiper-container ul { height:100%;}
.swiper-container ul li { float: left;width:8.4%;height:100%;position:relative;}
.swiper-container ul li img { width: 100%; height: 100%; vertical-align:top; }
.swiper-container ul li .reply { position: absolute; left:0; bottom:0; width:100%; height:15%;}
.swiper-container ul li .reply .listwrap { 
	overflow:hidden; width:80%;height: 70%; position:absolute; left:50%; top:15%;margin-left:-40%;}
.swiper-container ul li .reply .list { width:400%;float: none;height:100%;position:absolute;left:0;top:0;}
.swiper-container ul li .reply .list li { 
	color:#fff; line-height: 120%;height:100%;width:25%;
	text-align:center;font-size:140%;letter-spacing:-1px;
}

.swiper-container ul li .reply .txtpage { width:100%; text-align:center; bottom:8%;height:8px;position: absolute; left:0;display:block;}
.swiper-container ul li .reply .txtpage em { 
	display:inline-block;width: 8px; height:8px;
	background: url("https://img.nocutnews.co.kr/mnocut/v2/story/interview/textpaging_a.png") no-repeat 0 0;
	text-indent: -3000em;
}
.swiper-container ul li .reply .txtpage em.sel { background-position: 0 -8px; }
.swiper-container ul li.last iframe { position:absolute; left:0; top:0; }
.replyarrow { 
	width:94%; height:60px;bottom:0; left:50%;z-index:2;
	margin-top:-10px;position: fixed;display:block;margin-left:-47%;
}
.replyarrow a { display:block; width:50px;height:50px;line-height:50px;}
.replyarrow a img { vertical-align:middle; }
.replyarrow a.prev { float:left;text-align:left;}
.replyarrow a.next { float:right;text-align:right; }

.swiper-container ul li .btn_interview { position: absolute; right:15%; top:12%;display:block; }
.swiper-container ul li .btn_interview img { width:138px; height:auto; }
.byline { position:absolute; left:0; bottom:0; width:100%;overflow:hidden;}
.byline span { display:block;width:100%;font-size:11px;line-height:120%; color:#fff;}
.byline span em { text-align:right; display:inline-block;float:left;width: 18%;}

@media all and (min-width:500px){
	.swiper-container ul li .reply .list li { font-size: 150%;line-height: 130%; }
}
@media all and (min-width:320px){
	.swiper-container ul li .reply .list li { font-size: 120%; }
}
@media all and (min-height:640px){
	.replyarrow { bottom:3%; }
}