@charset "UTF-8";


@media screen and (min-width: 769px) {
	.pageHeaderOuterSP,
	.pageHeader .bnr_otsukidama,
	.pageHeader .bnr_otsukidama a {
	display:none;
	}
}

@media screen and (max-width: 768px) {
	.pageHeader .bnr_otsukidama {
	background-color: #B53229;
	max-width: none;
}

.pageHeader .bnr_otsukidama a {
	background-color: #FFDC00;
	color: #ff517b;
	width:90px;
}

.sp_s{ 
display: none;
}

}

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

.pageHeader .bnr_otsukidama .main{ width: 230px;}
.pageHeader .bnr_otsukidama .main img{ width: 100%;}
.pageHeader .bnr_otsukidama .closeBtn{ width: 24px;margin-left: -6px;}
.sp_s{ display: block;}
.pageHeader .bnr_otsukidama a{ width: 50px; padding: 4px; margin: 16px 4px;}
}









@media screen and (min-width: 769px) {
	.pageHeader .bnr_otsukidama2,
	.pageHeader .bnr_otsukidama2 a {
	display:none;
	}
}

@media screen and (max-width: 768px) {
	.pageHeader .bnr_otsukidama2 {
		max-width: none;
		background-color: #192549;
		background-image: url("/spn/cmn/img/hd_bnr_otsukidama2_bg.gif");
	}
	.pageHeader .bnr_otsukidama3 {
		max-width: none;
		background-color: #E9D17D;
		background-image: url("/spn/cmn/img/hd_bnr_otsukidama3_bg.gif");
	}
	.pageHeader .bnr_otsukidama4 {
		max-width: none;
		background-color: #E9D17D;
		background-image: url("/spn/cmn/img/hd_bnr_otsukidama4_bg.gif");
	}
	.pageHeader .bnr_otsukidama5 {
		max-width: none;
		background-color: #E9D17D;
		background-image: url("/spn/cmn/img/hd_bnr_otsukidama5_bg.jpg");
		background-size: cover;
	}
	.pageHeader .bnr_otsukidama6 {
		max-width: none;
		background-color: #E9D17D;
		background-image: url("/spn/cmn/img/hd_bnr_otsukidama6_bg.jpg");
		background-size: cover;
	}
	.pageHeader .bnr_otsukidama7 {
		max-width: none;
		background-color: #e8f13d;
	//background-image: url("/spn/cmn/img/hd_bnr_otsukidama7_bg.jpg");
	//background-size: cover;
	}
	.pageHeader .bnr_otsukidama8 {
		max-width: none;
		background-color: #e8f13d;
		background-image: url("/spn/cmn/img/hd_bnr_otsukidama8_bg.jpg");
		background-size: cover;
	}
	.pageHeader .bnr_otsukidama2 a,
	.pageHeader .bnr_otsukidama3 a,
	.pageHeader .bnr_otsukidama4 a,
	.pageHeader .bnr_otsukidama5 a,
	.pageHeader .bnr_otsukidama6 a,
	.pageHeader .bnr_otsukidama7 a,
	.pageHeader .bnr_otsukidama8 a  {
		background: none;
		width:calc(100% - 32px);
		margin:0;
		padding:0;
		position:relative;
		overflow:visible;
	}

	.pageHeader .bnr_otsukidama2 a .main .p1,
	.pageHeader .bnr_otsukidama3 a .main .p1 {
		position:absolute;
		left:0%;
	}
	.pageHeader .bnr_otsukidama4 a .main .p1{
		position:absolute;
		left:-1%;
	}
	.pageHeader .bnr_otsukidama5 a .main .p1 {
		position:absolute;
		left:1%;
	}
	.pageHeader .bnr_otsukidama6 a .main .p1,
	.pageHeader .bnr_otsukidama7 a .main .p1,
	.pageHeader .bnr_otsukidama8 a .main .p1 {
		position:absolute;
		left:-2%;
	}

	.pageHeader .bnr_otsukidama2 a .main .p2 {
		position:absolute;
		left:10%;
	}
	.pageHeader .bnr_otsukidama2 a .main .p3 {
		position:absolute;
		left:30%;
	}
	.pageHeader .bnr_otsukidama2 a .main .p4,
	.pageHeader .bnr_otsukidama3 a .main .p4,
	.pageHeader .bnr_otsukidama5 a .main .p4,
	.pageHeader .bnr_otsukidama6 a .main .p4,
	.pageHeader .bnr_otsukidama7 a .main .p4,
	.pageHeader .bnr_otsukidama8 a .main .p4 {
		position:absolute;
		left:16%;
	}
	.pageHeader .bnr_otsukidama4 a .main .p4 {
		position:absolute;
		left:17%;
	}

	.pageHeader .bnr_otsukidama2 a .bnr_otsukidama_btn,
	.pageHeader .bnr_otsukidama3 a .bnr_otsukidama_btn,
	.pageHeader .bnr_otsukidama4 a .bnr_otsukidama_btn,
	.pageHeader .bnr_otsukidama5 a .bnr_otsukidama_btn,
	.pageHeader .bnr_otsukidama6 a .bnr_otsukidama_btn,
	.pageHeader .bnr_otsukidama7 a .bnr_otsukidama_btn,
	.pageHeader .bnr_otsukidama8 a .bnr_otsukidama_btn {
		display:block;
		background-color: #FFDC00;
		color: #005e15;
		width: 90px;
		padding: 10px 2px;
		margin: 16px 4px;
		position:absolute;
		border-radius: 6px;
		right: 0px;
	}
	.pageHeader .bnr_otsukidama5 a .bnr_otsukidama_btn {
		background-color: #ff6f92;
		color: #FFF;
	}
	.pageHeader .bnr_otsukidama7 a .bnr_otsukidama_btn {
		background-color: #1182dc;
		color: #FFF;
	}
	.pageHeader .bnr_otsukidama8 a .bnr_otsukidama_btn {
		background-color: #D00;
    	color: #FFF;
	}
	.sp_s{ 
	display: none;
	}

}

@media screen and (max-width: 374px) {
	.pageHeader .bnr_otsukidama2 a,
	.pageHeader .bnr_otsukidama3 a,
	.pageHeader .bnr_otsukidama4 a,
	.pageHeader .bnr_otsukidama5 a,
	.pageHeader .bnr_otsukidama6 a,
	.pageHeader .bnr_otsukidama7 a,
	.pageHeader .bnr_otsukidama8 a  {
		width:calc(100% - 24px);
	}
	.pageHeader .bnr_otsukidama2 .closeBtn,
	.pageHeader .bnr_otsukidama3 .closeBtn,
	.pageHeader .bnr_otsukidama4 .closeBtn,
	.pageHeader .bnr_otsukidama5 .closeBtn,
	.pageHeader .bnr_otsukidama6 .closeBtn,
	.pageHeader .bnr_otsukidama7 .closeBtn,
	.pageHeader .bnr_otsukidama8 .closeBtn { 
		width: 24px;margin-left: -6px;
	}
	.sp_s{ display: block;}
	.pageHeader .bnr_otsukidama2 a .bnr_otsukidama_btn,
	.pageHeader .bnr_otsukidama3 a .bnr_otsukidama_btn,
	.pageHeader .bnr_otsukidama4 a .bnr_otsukidama_btn,
	.pageHeader .bnr_otsukidama5 a .bnr_otsukidama_btn,
	.pageHeader .bnr_otsukidama6 a .bnr_otsukidama_btn,
	.pageHeader .bnr_otsukidama7 a .bnr_otsukidama_btn,
	.pageHeader .bnr_otsukidama8 a .bnr_otsukidama_btn { 
		width: 50px; padding: 4px; margin: 16px 4px;top:0;
	}
}