html {
	background:#000;
	}

body, html {
    width:100%;
	height: 100%;
	font-size:62.5%;
	}	

.pop_wrap {
	width:100%;
	}

#pop_caption {
	background: linear-gradient(#fbc200,#e18700);
	color: #fff;
	line-height: 25px;
	padding: 10px;
	max-width:1000px;
	margin:0 auto;
}

#pop_caption img {
	width:100%;
	}

#pop_caption p {
	font-size: 1.6rem;
}

#pop_list_box {
	list-style-type: none;
	padding-top: 25px;
	max-width:1000px;
	height:auto;
	margin:0 auto;
	display:-webkit-box;
	display: -webkit-flex;
	display:-moz-box;
	display:-ms-flexbox;
	display:flex;
	-ms-flex-wrap : wrap; 
	-webkit-flex-wrap : wrap; 
	flex-wrap:wrap;
}
	
#pop_list_box li {
	background: #69127f;
	}	
	
#pop_list_box li a {
	display: block;
}

.list_img {
	background-color: #FFF;
	text-align: center;
	padding-top: 5px;
	padding-bottom: 5px;
	
}

.list_caption p {
	line-height: 30px;
	color: #fff;
	background: linear-gradient(#fbc200,#e18700);
	text-align: center;
	font-size: 1.4rem;
}

.attention {
	background-color:#000;
	position:relative;
	max-width:1200px;
	height:auto;
	padding:10px 10px 0 10px;
	margin:0 auto;
	margin-top:1%;
	color:#fff;
	border:2px solid #fff;
	font-size:1.4rem;
	}
	
.attention h1 {
	margin:0;
	padding:0;
	margin-bottom:10px;
	border-bottom:1px solid #fff;
	}	
	
.attention h2 {
	border-bottom:1px dotted #fff;
	}

.attention li {	
	list-style-type: decimal;
	margin-bottom:10px;		
}

#pop_frame {
	width:69.2%;
	margin:0 auto;
	top:0;
	right:0;
	left:0;
	position: absolute;
	}
	
#pop_frame img, #popButton_left img {
	width:100%;
	}	
	
.dl_content {
	padding:0 25px;
	min-height:830px;
	}	

@media screen and (min-width: 769px){

body::before {
	content:"";
    display:block;
    position:fixed;
    top:0;
    z-index:-1;
    width:100%;
    height:100vh;
	background:url(../images/bg_back.jpg) center no-repeat;
    background-size:cover;
	}		


.nav {
	position:relative;
	max-height:70px;
	background:none;
	}	

.nav ul li:nth-child(1) {
	position:relative;
	}

.pop_inner {
	position:relative;
	max-width:1920px;
	height:100%;
	overflow:hidden;
	right:0;
	left:0;
	margin:0 auto;
	}

.pop_content,.dl_content {
	max-width:1300px;
	min-height:910px;
	height:calc(100vh - 70px);
	margin:0 auto;
	padding:0 25px;
	overflow:hidden;
	}

.pop_title {
	width:100%;
	margin:0 auto;
	margin-top:2%;
	}

#pop_list_box li {
	margin-bottom: 15px;
	border: 1px solid #fff;
	width: calc((100% - 25px * 4 ) / 5 - 0.1px);
	margin-right:25px;
}
	
#pop_list_box li:nth-child(5n) {
	margin-right:0;
	}

#pop_caption {
	margin-top:4%;
	}

.footer {
	position:relative;
	margin:0;
	}

.buttons {
	width:70%;
	margin:0 auto;
	display:-webkit-box;
	display: -webkit-flex;
	display:-moz-box;
	display:-ms-flexbox;
	display: flex;
	display : flex;
	}

.pop_button {
	max-width: 201px;
	height:auto;
	margin:0 auto;
	margin-top:10px;
	margin-bottom:30px;
}
	
.pop_button a:hover {
	transition-duration:0.13s;
	opacity:0.8;
}

}

@media screen and (min-width:769px) and (max-width: 1200px) {
	.attention {
	font-size:1.166vw;
	}
}

@media screen and (max-width: 1005px){

.list_caption p {
	font-size:1.3vw;
	}

#pop_list_box li {
	width: calc((100% - 25px * 3 ) / 4);
}

#pop_list_box li:nth-child(5n) {
	margin-right:25px;
	}

#pop_list_box li:nth-child(4n) {
	margin-right:0;
	}
	
.dl_content {
	min-height:1080px;
	}

}

@media screen and (max-width: 768px){

body::before {
	content:"";
    display:block;
    position:fixed;
    top:0;
    z-index:-1;
    width:100%;
    height:100vh;
	background:url(../images/bg_sp.jpg) center no-repeat;
    background-size:cover;
	}

.pop_content {
	padding-bottom:2.5%;
	padding-right:2.5%;
	padding-left:2.5%;
	}

.dl_content {
	padding-top:25px;
	padding-right:2.5%;
	padding-left:2.5%;
	}

.pop_title {
	width:100%;
	margin:0 auto;
	padding-top:4.5%;
	}

.attention {
	max-width:100%;
	font-size:1.4rem;
	}

.pop_button {
	width:24.2%;
	height:auto;
	margin:0 auto;
	margin-top:30px;
	margin-bottom:30px;
	}

#pop_list_box li {
	margin-bottom: 15px;
	border: 1px solid #fff;
	width: calc((100% - 2.5% * 1) / 2 - 0.1px);
	margin-right:2.5%;
	}

#pop_list_box li:nth-child(4n),
#pop_list_box li:nth-child(5n) {
	margin-right:2.5%;
	}

#pop_list_box li:nth-child(2n) {
	margin-right:0px;
	}

.list_caption p {
	font-size: 1.4rem;
	line-height: 30px;
	}

.top_btn {
	width:53%;
	margin:30px auto 0;
	}

.footer {
	margin-top:30px;
	margin-bottom:0;
	}

}

/*---フッターEND---*/