@charset "UTF-8";

/* ------------------------------------
 * Over Ride
 * ------------------------------------ */
body {
	background: url(/shared/img/common/bg.png) repeat left top;
	background-attachment: fixed;
}
#container {
	width: 100%;
}
#container .inner {
	position: relative;
	width: 1000px;
	margin: 0 auto;
}
article {
	width: 1000px;
	margin: 0 auto;
	padding: 40px 30px;
	font-size: 90%;
	text-align: left;
}
a , input {
	transition: color .3s ease-out , background .3s ease-out;
}
a:hover , input:hover {
	transition: color .3s ease-in , background .3s ease-in;
}
@media (max-width: 999px) {
	article {
		width: 94%;
		padding: 4% 0;
	}
	#container .inner {
		width: 100%;
	}
}
@media (max-width: 767px) {
	article {
		padding: 5% 0;
	}
}

/* ------------------------------------
 * Header
 * ------------------------------------ */
header {
	position: relative;
	width: 100%;
	margin: 0;
	padding: 0;
	text-align: center;
}
header nav {
	position: absolute;
	right: 0;
	zoom:1;
}
header nav #memberNav {
	float: right;
}
header nav #memberNav li {
	float: left;
}
header nav #memberNav li a {
	display: block;
	position: relative;
	height: 30px;
	line-height: 1;
	border: solid 1px #ffee21;
	border-radius: 15px;
	background-color: #ffee21;
	text-decoration: none;
	color: #1c1f87;
	font-family: 'Luckiest Guy', cursive;
}
header nav #memberNav li a:hover {
	opacity: 1;
	border: solid 1px #1c1f87;
	background-color: #1c1f87;
	color: #ffee21;
}
header h1 {
	max-width: 940px;
	margin: 0 auto;
	text-align: left;
}
header h1 a {
	display: block;
	width: 32%;
	padding: 6px 0 4px;
}
header h1 a span {
	display: block;
	overflow: hidden;
	text-indent: 100%;
	white-space: nowrap;
	height: 0;
	padding-top: 32%;
	background: url(../img/common/logo.svg) no-repeat center center;
	background: url(../img/common/logo.png) no-repeat center center;
	background-size: contain;
	line-height: 0;
}
@media (min-width: 768px) {
	header nav #memberNav {
		margin-top: 40px;
		padding-right: 10px;
	}
	header nav #memberNav li {
		width: 120px;
		padding-left: 10px;
		vertical-align: middle;
	}
	header nav #memberNav li a {
		padding-top: 10px;
	}
}
@media (max-width: 999px) {
	header nav #memberNav {
		margin-top: 30px;
	}
	header h1 {
		padding-left: 10px;
	}
}
@media (max-width: 767px) {
	header nav {
		position: relative;
		overflow: hidden;
	}
	header nav #memberNav {
		float: none;
		display: block;
		margin: 0;
		padding: 8px 1%;
		background-color: #1c1f87;
	}
	header nav #memberNav li {
		width: 50%;
		margin: 0;
	}
	header nav #memberNav li a {
		width: 96%;
		margin: 0 auto;
		padding-top: 9px;
		font-size: 14px;
	}
	header h1 a {
		width: 160px;
		padding: .6em 0;
	}
}

main > article section h2 {
	position: relative;
	line-height: 1;
	margin-bottom: 20px;
	color: #333333;
    text-decoration: none;
	text-align: left;
    z-index: 2;
}
main > article section h2::after {
    display: block;
	position: absolute;
	top: 50%;
    width: 100%;
	height: 5px;
	background: url(/shared/img/common/deco_wavy.png) repeat-x left center;
	z-index: -3;
	content: "";
}
main > article section h2 span {
	display: inline-block;
	padding: 0 .4em 0 0;
	background-color: #ffffff;
	font-family: 'Luckiest Guy', cursive;
    font-size: 34px;
	letter-spacing: .07em;
}
main > article section h2 + p {
	margin-bottom: 10px;
	padding: 16px 30px 0;
}

main > article > p {
	width: 95%;
	margin: 2% auto;
	font-weight: bold;
	font-size: 115%;
}
main > article > p span {
	display: block;
	margin-top: 1%;
	color: #617c9e;
	font-weight: bold;
}
main > article > p a {
	color: #343434;
}
@media (max-width: 999px) {
	main > article section h2 {
		margin-bottom: 2%;
	}
	main > article section h2 span {
		font-size: 30px;
	}
}
@media (max-width: 767px) {
	main > article > h2 {
		width: 94%;
		margin: 0 auto 5%;
	}
	main > article section h2 {
		text-align: center;
	}
	main > article section h2 span {
		padding: 0 .4em;
		font-size: 28px;
	}
	main > article section h2 + p {
		padding: 6px 0;
	}
	main > article > p {
		width: 92%;
		margin: 2% auto 3%;
		font-size: 100%;
	}
}

/* ------------------------------------
 * gNav
 * ------------------------------------ */
#cbp-hrmenu {
	position: static;
	background-color: #1c1f87;
	z-index: 2000;
}
#cbp-hrmenu > ul {
	width: 960px;
	margin: 0 auto;
	text-align: center;
	font-size: 0;
}
#cbp-hrmenu > ul > li {
	position: relative;
	display: inline-block;
	color: #ee6c03;
	font-size: 13px;
}
#cbp-hrmenu > ul > li::after {
	display: inline-block;
	content: "●";
	font-size: 16px;
	vertical-align: middle;
}
#cbp-hrmenu > ul > li:nth-of-type(2)::after , #cbp-hrmenu > ul > li:nth-of-type(5)::after , #cbp-hrmenu > ul > li:nth-of-type(8)::after {
	content: "▲";
}
#cbp-hrmenu > ul > li:nth-of-type(3)::after , #cbp-hrmenu > ul > li:nth-of-type(6)::after , #cbp-hrmenu > ul > li:nth-of-type(9)::after {
	content: "■";
}
#cbp-hrmenu > ul > li:last-child::after {
	display: none;
}
#cbp-hrmenu > ul li a,
#cbp-hrmenu > ul li span {
	display: inline-block;
	height: 40px;
	color: #ee6c03;
	line-height: 40px;
	vertical-align: middle;
	padding: 2px 10px 0;
	text-align: center;
	text-decoration: none;
	font-family: 'Luckiest Guy', cursive;
	font-size: 13px;
	letter-spacing: .05em;
}
#cbp-hrmenu > ul > li a:hover {
	color: #ffee21;
	opacity: 1;
}

/* sub-menu */
.cbp-hrmenu .cbp-hrsub {
	display: none;
	position: absolute;
	width: 180%;
	left: -50%;
	background-color: #1c1f87;
}
.cbp-hropen .cbp-hrsub {
	display: block;
	text-align: center;
	z-index: 2001;
}
.cbp-hrmenu .cbp-hrsub-inner::before,
.cbp-hrmenu .cbp-hrsub-inner::after {
	content: " ";
	display: table;
}
.cbp-hrmenu .cbp-hrsub-inner::after {
	clear: both;
}
.cbp-hropen .cbp-hrsub ul {
	padding: 8px 0 6px;
}
.cbp-hrmenu .cbp-hrsub a {
    display: inline-block;
	color: #ffffff;
	text-decoration: none;
	font-family: 'Luckiest Guy', cursive;
    letter-spacing: .05em;
	text-align: center;
}

/* MENU BTN */
#menuBtn {
	display: none;
}
@media (max-width: 1000px) {
	#cbp-hrmenu > ul {
		width: 100%;
		padding: 0;
	}
}
@media (max-width: 900px) {
	#cbp-hrmenu > ul {
		padding: 8px 0;
	}
	#cbp-hrmenu > ul > li {
		display: block;
		float: left;
		width: 20%;
	}
	#cbp-hrmenu > ul > li::after {
		display: block !important;
		position: absolute;
		right: -5px;
		top: 5px;
	}
	#cbp-hrmenu > ul > li:nth-child(5n)::after,
	#cbp-hrmenu > ul > li:last-child::after {
		display: none !important;
	}
	#cbp-hrmenu > ul > li > a,
	#cbp-hrmenu > ul > li > span {
		display: inline-block;
		vertical-align: middle;
		padding: 0 10px;
		text-align: center;
		text-decoration: none;
		font-size: 13px;
		letter-spacing: .05em;
	}
	/* sub-menu */
	.cbp-hrmenu .cbp-hrsub {
		width: 110%;
		left: -3%;
		margin-top: 8px;
	}
	.cbp-hropen .cbp-hrsub ul {
		padding: 7px 0 6px;
	}
	.cbp-hrmenu .cbp-hrsub a {
		height: 30px;
		line-height: 30px;
	}
}
@media (max-width: 767px) {
	#cbp-hrmenu {
		position: absolute;
		top: -875px;
		background: rgba(28,31,135,.97);
		width: 100%;
		text-align: center;
		padding: 0;
		transition: .5s ease-in-out;
		z-index: 1100;
	}
	#cbp-hrmenu > ul {
		width: 100%;
		padding: 0;
	}
	#cbp-hrmenu > ul > li {
		float: none;
		width: 100%;
	}
	#cbp-hrmenu > ul > li.down > a {
		display: none;
	}
	#cbp-hrmenu > ul > li::after {
		display: block !important;
		position: static;
		margin: 0 auto;
	}
	#cbp-hrmenu > ul > li:nth-child(5n)::after {
		display: block !important;
	}
	#cbp-hrmenu > ul > li:last-child::after {
		display: none !important;
	}
	#cbp-hrmenu > ul > li > a {
		width: 100% !important;
		height: 40px;
		line-height: 40px;
		text-align: center;
	}
	#menuBtn {
		display: block;
		position: absolute;
		right: 0;
		top: 46px;
		width: 60px;
		height: 60px;
		cursor: pointer;
		z-index: 101;
	}
	#menuBtn div.icon_menuBtn {
		position: relative;
		top: 12px;
		left: 15px;
		width: 26px;
		height: 20px;
	}
	#menuBtn span {
		display: block;
		position: absolute;
		height: 2px;
		width: 100%;
		-webkit-border-radius: 1px;
		-moz-border-radius: 1px;
		border-radius: 1px;
		background-color: #333333;
		left: 0;
		-webkit-transition: .35s ease-in-out;
		-moz-transition: .35s ease-in-out;
		transition: .35s ease-in-out;
	}
	#menuBtn span:nth-child(1) {
		top: 0;
	}
	#menuBtn span:nth-child(2) {
		top: 9px;
	}
	#menuBtn span:nth-child(3) {
		bottom: 0;
	}
	.open #menuBtn span:nth-of-type(1) {
		-webkit-transform: translateY(9px) rotate(-45deg);
		transform: translateY(9px) rotate(-45deg);
	}
	.open #menuBtn span:nth-of-type(2) {
		opacity: 0;
	}
	.open #menuBtn span:nth-of-type(3) {
		-webkit-transform: translateY(-9px) rotate(45deg);
		transform: translateY(-9px) rotate(45deg);
	}
 	.open #cbp-hrmenu {
		display: block;
		-moz-transform: translateY(76em);
		-webkit-transform: translateY(76em);
		transform: translateY(76em);
	}
	/* sub-menu */
	.cbp-hrmenu .cbp-hrsub {
		display: block;
		position: static;
		left: auto;
		width: auto;
		margin: 0;
		background-color: transparent;
	}
	.cbp-hrmenu .cbp-hrsub ul {
		position: relative;
	}
	.cbp-hrmenu .cbp-hrsub ul li {
		display: block;
	}
	.cbp-hrmenu .cbp-hrsub ul li::after {
		display: block !important;
		margin: 0 auto;
		font-size: 16px;
		content: "★";
	}
	.cbp-hrmenu .cbp-hrsub ul li:last-child::after {
		display: none !important;
	}


	#cbp-hrmenu > ul > li::after {
		display: inline-block;
		content: "★";
		font-size: 16px;
		vertical-align: middle;
	}
	#cbp-hrmenu > ul > li:nth-of-type(2)::after , #cbp-hrmenu > ul > li:nth-of-type(5)::after , #cbp-hrmenu > ul > li:nth-of-type(8)::after {
		content: "★";
	}
	#cbp-hrmenu > ul > li:nth-of-type(3)::after , #cbp-hrmenu > ul > li:nth-of-type(6)::after , #cbp-hrmenu > ul > li:nth-of-type(9)::after {
		content: "★";
	}
}

/* ------------------------------------
 * TopicPath
 * ------------------------------------ */
#topicPath {
	width: 100%;
	padding: 10px 0;
	text-align: left;
}
#topicPath ul {
	width: 1000px;
	margin: 0 auto;
	padding: 0 30px;
}
#topicPath ul li {
	display: inline-block;
	font-size: 75%;
}
#topicPath ul li a,
#topicPath ul li span.path {
	display: inline-block;
	padding: 0 15px 0 0;
	text-decoration: none;
	color: #ee6c03;
	background: url(../img/parts/arrow_topicpath.png) no-repeat center right;
}
#topicPath ul li span {
	color: #1c1f87;
}
@media (max-width: 1000px) {
	#topicPath ul {
		width: 100%;
		padding: 0 3%;
	}
}

/* ------------------------------------
 * TIME & ICON
 * ------------------------------------ */
time {
	display: inline-block;
	margin-right: .5em;
	vertical-align: middle;
	font-size: 12px;
}
.cate {
	display: inline-block;
	position: relative;
	width: auto;
	margin-left: 0.3em;
	padding: 3px 14px;
	border-radius: 8px;
	background-color: #ee6c03;
	color: #ffffff;
	text-align: center;
	vertical-align: middle;
	font-size: 11px;
	line-height: 1;
	z-index: 999;
}
/* NFO */
.cate.info00 { background-color: transparent; }
.cate.info01 { background-color: #ee6c03; }
.cate.info02 { background-color: #00deff; }
.cate.info03 { background-color: #a200ff; }
.cate.info04 { background-color: #009944; }

/* ------------------------------------
 * List
 * ------------------------------------ */
.list li {
	padding: 15px 0;
	border-bottom: solid 1px #d2d2d2;
	position: relative;
    z-index: 100;
}
.list li a {
    text-decoration: none;
    color: #333333;
    line-height: 1.7em;
    display: inline-block;
    margin-top: 3px;
}
/*限定アイコン*/
.list li .member {
	display: inline-block;
    position: relative;
	line-height: 16px;
	margin-left: 0.3em;
    padding: 0 14px;
	border-radius: 8px;
	background-color: #1c1f87;
    text-align: center;
    color: #fff;
    font-size: 11px;
	z-index: 999;
}

.list li .name {
	display: inline-block;
	margin-left: 10px;
	font-size: 83%;
}

/*PC/タブレット*/
@media (min-width: 1000px) {
	.contents .list li:first-child {
		padding-top: 0;
	}
}
@media (min-width: 768px) {
}

/*スマートフォン*/
@media (max-width: 767px) {
	.contents .list li {
		padding: 12px 0;
	}
	.list li .cate {
		margin: 0 5px;
	}
}

/* ------------------------------------
 * STORY
 * ------------------------------------ */
#story h3 {
	margin-bottom: 5%;
	padding: 12px 0 15px;
	font-size: 130%;
	border-bottom: solid 1px #cfc4c9;
	line-height: 1.8;
}
#story h3 time {
	line-height: 1;
}
#story h3 .name {
	display: inline-block;
	margin-left: 10px;
	font-size: 83%;
}
#story .text {
	padding-bottom: 5%;
}
#story .text img {
	max-width: 100%;
}
#story .pv_count,
#story .icon_res {
	display: block;
	text-align: right;
}
#story .pv_count span {
	display: inline-block;
	padding: 0px 20px;
	margin-bottom: 10px;
	background-color: #e1e1e1;
	color: #fff;
	font-size: 130%;
}
#story .photo img {
	max-width: 100%;
	width: auto !important;
	width: 100%;
}
@media (min-width: 768px) {
	#story h3 {
		padding-top: 0;
	}
}
@media (max-width: 767px) {
	#story .text iframe {
		width:100% !important; /*youtube用*/
	}
}

/* ------------------------------------
 * BOX
 * ------------------------------------ */
section .box {
	padding: 30px 0;
	zoom: 1;
	overflow: hidden;
	word-break: break-all;
}
section .box + .box {
	margin-top: 5%;
}
@media (max-width: 999px) {
	section .box {
		padding: 2% 0 4%;
	}
}
@media (max-width: 767px) {
	section .box {
		padding: 4% 0;
	}
}

/* ------------------------------------
 * 2COLUMN LAYOUT
 * ------------------------------------ */
.sub {
	float: left;
	width: 186px;
}
.contents {
	float: right;
	width: 700px;
}
.sub .localNav li a {
	display: block;
	width: 89%;
	margin: 6% auto;
	padding: 1% 0;
	background: #1c1f87;
	color: #ee6c03;
	font-family: 'Luckiest Guy', cursive;
	font-size: 16px;
	text-decoration: none;
	text-align: center;
	-webkit-transform: skewX(-35deg);
	transform: skewX(-35deg);
}
.sub .localNav li a span {
	display: inline-block;
	position: relative;
	-webkit-transform: skewX(35deg);
	transform: skewX(35deg);
}
.sub .localNav li a span::after {
	display: block;
	width: calc(100%+10px);
	height: 5px;
	margin: -11px -5px 0;
	background: #ffffff;
	content: "";
}
.sub .localNav li.cate01 a span::after { background-color: #ffffff; }
.sub .localNav li.cate02 a span::after { background-color: #ffee21; }
.sub .localNav li.cate03 a span::after { background-color: #00deff; }
.sub .localNav li.cate04 a span::after { background-color: #a200ff; }
.sub .localNav li.cate05 a span::after { background-color: #009944; }

.sub h3 {
	background-color: #1c1f87;
	padding: 8px 10px;
	font-size: 115%;
	border: none;
	color: #ffffff;
}
#story .sub h3 {
	line-height: 1.9;
	margin: 0;
	border: none;
	background-color: #1c1f87;
	padding: 8px 10px;
	font-size: 115%;
}

.sub .unit {
	margin-bottom: 5%;
	padding: 10px;
	background-color: #ffffff;
	font-size: 90%;
}
.sub .unit li {
	margin-bottom: 10px;
}
.sub .unit li a {
	line-height: 1.6;
	display: block;
	text-decoration: none;
}
.sub .unit li span {
	display: block;
}
.sub .unit time {
	font-weight: bold;
}
.sub .unit.category li a {
	padding-left: 10px;
	background: url(../img/parts/arrowLink.png) no-repeat left center;
}
.sub .unit.category li span {
	font-weight: bold;
	color: #333333;
}
.sub .unit.category li a.name {
	margin-left: 10px;
}
@media (max-width: 1000px) {
	.sub {
		float: none;
		width: 100%;
	}
	.sub .localNav {
		zoom: 1;
		overflow: hidden;
		margin: 0 -5px;
	}
	.sub .localNav li {
		float: left;
		width: 25%;
		padding: 0 5px;
	}
	.contents {
		float: none;
		width: 100%;
	}
	.sub .unit {
		padding: 0;
	}
	.sub .unit li {
		margin-bottom: 0;
		padding: 10px;
		border-bottom:  solid 1px #ffffff;
	}
	.sub .unit li:last-child {
		border: none;
	}
	.sub .unit.category li {
		padding: 0;
	}
	.sub .unit.category li span {
		padding: 10px;
		background-color: #f7f7f7;
	}
	.sub .unit.category li a.name {
		margin-left: 20px;
	}
}

@media (max-width: 767px) {
	.sub .localNav {
		margin: 0 -4px 2%;
	}
	.sub .localNav li {
		width: 50%;
		padding: 0 4px;
	}
	.sub .localNav li a {
	margin: 3% auto;
		font-size: 14px;
	}
	.sub .localNav li a span::after {
		height: 3px;
		margin: -6px -5px 0;
	}
}

/* ------------------------------------
 * Form
 * ------------------------------------ */
form {
	margin-top: 3%;
}
form input,
form textarea {
	outline: none;
	padding: 5px;
	font-size: 115%;
}
form dl {
	overflow: hidden;
	font-size: 115%;
	zoom: 1;
}
form dl dt {
	float: left;
	clear: both;
	width: 250px;
	margin-bottom: 20px;
	padding: 0 0 0 10px;
	border-left: solid 5px #1c1f87;
	font-weight: bold;
	box-sizing: border-box;
	line-height: 1.4;
}
form dl dd {
	float: left;
	margin: 0 0 10px 20px;
	padding-bottom: 10px;
	box-sizing: border-box;
}
form dl dd textarea {
	width: 100%;
}
form dl dd img {
	max-width: 100%;
	width: auto !important;
	width: 100%;
}
form dl dd .text {
	display: block;
	font-size: 83%;
	line-height: 1.5;
}
form dl dd .photo {
	margin-bottom: 10px;
}

@media (max-width: 767px) {
	form dl dt {
		float: none;
		width: 100%;
		margin-bottom: 0;
	}
	form dl dd {
		float: none;
		margin: 0 0 10px;
		padding: 10px;
	}
	form dl dd input {
		border-radius: 0;
	}
}

/* ------------------------------------
 * Button
 * ------------------------------------ */
.btn {
	position: relative;
	display: block;
	width: 250px;
	margin: 3% auto 0;
	padding: 14px 0;
	text-align: center;
	border: solid 1px #1c1f87;
	border-radius: 2em;
	color: #1c1f87;
	font-size: 120%;
	line-height: 1;
	letter-spacing: 0.05em;
	transition: 0.3s;
	text-decoration: none;
}
.btn:hover {
	background-color: #1c1f87;
	color: #ffffff;
	text-decoration: none;
}
.btn01 {
	display: block;
	margin: 10px auto 0;
	padding: 10px;
	border: solid 1px #1c1f87;
	color: #1c1f87;
	text-align: center;
	text-decoration: none;
}
.btn01:hover {
	background-color: #1c1f87;
	color: #ffffff;
	text-decoration: none;
}

form a.btn,
form a.back {
	-webkit-transition: none;
	transition: none;
}
form a.btn:hover,
form a.back:hover {
	text-decoration: none;
	opacity: 1;
}

form .btn,
form .back {
	-webkit-appearance: none;
	display: block;
	position: relative;
	width: 250px;
	margin: 5% auto;
	padding: 14px 10px;
	border: solid 1px #1c1f87;
	border-radius: 2em;
	background-color: #ffffff;
	color: #1c1f87;
	font-size: 120%;
	text-decoration: none;
	text-align: center;
	line-height: 1;
	letter-spacing: 0.05em;
	z-index: 1000;
	cursor: pointer;
}

form .btn:hover,
form .back:hover {
	color: #1c1f87;
	background-color: #ffffff;
}

/*form .back {
	background-color: #121212;
}*/
nav.backList ul,
form ul {
	zoom: 1;
	width: 600px;
	margin: 0 auto;
}
nav.backList ul li,
form ul li {
	width: 50%;
	float: left;
}

@media (max-width: 767px) {
	nav.backList ul,
	form ul {
		width: 100%;
	}
	nav.backList ul li,
	form ul li {
		float: none;
		width: 100%;
	}
}

/* ------------------------------------
 * Notice
 * ------------------------------------ */
.notice {
	margin: 3% 0;
	padding: 20px;
	border: dotted 1px #ee6c03;
	font-size: 83%;
}
.notice h3 {
	margin-bottom: 10px;
	font-weight: bold;
	font-size: 130%;
	text-align: center;
}
.notice ul li {
	padding-left: 1em;
	text-indent: -1em;
}

/* ------------------------------------
 * Attention
 * ------------------------------------ */
.attention {
	margin: 3% 0;
	padding: 10px;
	border: solid 2px #ff0000;
	color: #ff0000;
	font-weight: bold;
}

/* ------------------------------------
 * TABLE
 * ------------------------------------ */
.tbl01 {
	width:100%;
	margin: 3% 0;
}
.tbl01 th,
.tbl01 td {
	padding: 5px;
	border-collapse: collapse;
	border: solid 1px #e1e1e1;
	text-align: center;
	line-height: 1.4;
}
.tbl01 th {
	width: 25%;
	background-color: #1c1f87;
	color: #ffffff;
}
.tbl01 caption {
	margin-bottom: 5px;
	text-align: left;
	font-weight: bold;
}
@media (max-width: 767px) {
	.tbl01 th,
	.tbl01 td {
		font-size: 83%;
	}
}

/* ------------------------------------
 * More
 * ------------------------------------ */
a.btn_more {
	display: block;
	width: 93%;
	margin: 6% auto;
	padding: 1% 0;
	background: #1c1f87;
	color: #ee6c03;
	font-family: 'Luckiest Guy', cursive;
	font-size: 17px;
	text-decoration: none;
	text-align: center;
	-webkit-transform: skewX(-35deg);
	transform: skewX(-35deg);
}
a.btn_more span {
	display: block;
	-webkit-transform: skewX(35deg);
	transform: skewX(35deg);
}
a.btn_more:hover {
	background: #ee6c03;
	color: #ffffff;
}
@media (max-width: 999px) {
	.btn_more {
		padding: 5px;
		width: auto;
	}
}

/* ------------------------------------
 * SEARCH BOX
 * ------------------------------------ */
#searchBox {
	width: 300px;
	margin: 3% auto;
	background: none repeat scroll 0 0 #ffffff;
}
#searchBox form.search_form {
	overflow: hidden;
	zoom: 1;
}
#searchBox .inputArea {
	position: relative;
	display: block;
	float: left;
	width: 82%;
}
#searchBox input[type="button"],
#searchBox input[type="text"],
#searchBox input[type="submit"] {
   -webkit-appearance: none;
   border-radius: 0;
}
#searchBox input.search_text {
	width: 100%;
	margin: 0;
	padding: 5px;
	font-size: 15px;
	line-height: 15px;
	border: solid 1px #e1e1e1;
	box-shadow: none;
	outline: none;
}
#searchBox input#searchBtn {
	float: right;
	width: 17%;
	height: 30px;
	margin: 0;
	padding: 0;
	border: none;
	background: #1c1f87;
	color: #ffffff;
	cursor: pointer;
	outline: none;
}
@media (max-width: 520px) {
	#searchBox {
		width: 93%;
	}
}

/* ------------------------------------
 * Paging
 * ------------------------------------ */
.paging {
	padding: 15px 0;
}

/* ------------------------------------
 * Paging Number
 * ------------------------------------ */
.pagingNumber {
	padding: 15px 0 0;
}
.pagingNumber ul {
	clear: both;
	overflow: hidden;
	zoom: 1;
	text-align: center;
}
.pagingNumber li {
	display: inline-block;
	margin: 0;
	padding: 0;
}
.pagingNumber li a,
.pagingNumber li span {
	display: inline-block;
	line-height: 1;
	padding: 10px 8px;
	font-family: 'Luckiest Guy', cursive;
	font-size: 13px;
	text-align: center;
	letter-spacing: .1em;
	text-decoration: none;
}
.pagingNumber li span {
	color: #1c1f87;
}
.pagingNumber li:first-child { float:left; }
.pagingNumber li:last-child { float:right; }
.pagingNumber li:first-child {
	position: relative;
	z-index: 2;
}
.pagingNumber li:first-child a,.pagingNumber li:first-child span {
	padding-left: 24px;
}
.pagingNumber li:last-child a,.pagingNumber li:last-child span {
	padding-right: 24px;
}
.pagingNumber li:last-child {
	position: relative;
}
.pagingNumber li:first-child a,
.pagingNumber li:first-child span,
.pagingNumber li:last-child a,
.pagingNumber li:last-child span {
	position: relative;
}
.pagingNumber li:first-child a::before,
.pagingNumber li:first-child a::after,
.pagingNumber li:first-child span::before,
.pagingNumber li:first-child span::after,
.pagingNumber li:last-child a::before,
.pagingNumber li:last-child a::after,
.pagingNumber li:last-child span::before,
.pagingNumber li:last-child span::after {
	display: block;
	position: absolute;
	content: "";
}
.pagingNumber li:first-child a::before,
.pagingNumber li:first-child span::before,
.pagingNumber li:last-child a::before,
.pagingNumber li:last-child span::before {
	top: 7px;
	width: 18px;
	height: 18px;
	border-radius: 50%;
	background: #1c1f87;
}
.pagingNumber li:first-child a::before,
.pagingNumber li:first-child span::before {
	left: 0;
}
.pagingNumber li:last-child a::before,
.pagingNumber li:last-child span::before {
	right: 0;
}
.pagingNumber li:first-child a::after,
.pagingNumber li:first-child span::after,
.pagingNumber li:last-child a::after,
.pagingNumber li:last-child span::after {
	top: 13px;
	width: 6px;
	height: 6px;
	border-top: solid 2px #ffffff;
	border-right: solid 2px #ffffff;
}
.pagingNumber li:first-child a::after,
.pagingNumber li:first-child span::after {
	left: 7px;
	-webkit-transform: rotate(225deg);
	transform: rotate(225deg);
}
.pagingNumber li:last-child a::after,
.pagingNumber li:last-child span::after {
	right: 7px;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
}
.pagingNumber li:first-child span::before,
.pagingNumber li:last-child span::before {
	background: #e1e1e1;
}

#story .pagingNumber li:nth-child(2) a  {
	width: 90px;
	background-position: center center;
	border: none;
}
#story #commentList .pagingNumber li:nth-child(2)  {
	margin: 0 1px 3px;
	padding: 0;
}
#story #commentList .pagingNumber li:nth-child(2) a {
	width: auto;
	height: auto;
	padding: 10px 8px;
	text-indent: 0;
	background: none;
}

#story #commentList .pagingNumber li:first-child a,
#story #commentList .pagingNumber li:first-child span,
#story #commentList .pagingNumber li:last-child a,
#story #commentList .pagingNumber li:last-child span {
	font-size: 12px;
}
@media (max-width: 767px) {
	.pagingNumber li {
		margin: 0 1px 3px;
	}
	.pagingNumber li a,
	.pagingNumber li span {
		padding: 10px 5px;
		font-size: 14px;
	}
	.pagingNumber li:first-child a,
	.pagingNumber li:last-child a,
	.pagingNumber li:first-child span,
	.pagingNumber li:last-child span {
		text-indent: -9999px;
	}
	.pagingNumber li:first-child { float: none; }
	.pagingNumber li:last-child { float: none; }
	.pagingNumber li:first-child {
		position: relative;
		z-index: 2;
	}
	#story .pagingNumber li:nth-child(2) a  {
		width: 60px;
		height: 30px;
	}
	#story #commentList .pagingNumber li:nth-child(2) a {
		width: auto;
		height: auto;
		padding: 10px 3px;
		background: none;
	}
}

/* ------------------------------------
 * Go To TOP
 * ------------------------------------ */
#toTop {
	position: fixed;
	bottom: 2%;
	right: 1%;
	z-index: 2;
}
#toTop a {
	overflow: hidden;
	text-indent: 100%;
	white-space: nowrap;
	display: block;
	width: 60px;
	height: 0;
	padding-top: 100%;
	background: url(../img/parts/btn_totop.png) no-repeat left top;
	background-size: contain;
	line-height: 0;
	opacity: .9;
}
@media (min-width: 768px) and (max-width: 999px) {
	#toTop {
		bottom: 1.5%;
		right: 1.2%;
		z-index: 2;
	}
	#toTop a {
		width: 54px;
	}
}
@media (max-width: 767px) {
	#toTop {
		position: fixed;
		bottom: 1%;
		right: 1%;
		z-index: 100;
	}
	#toTop a {
		width: 44px;
	}
}

/* ------------------------------------
 * BannerArea Bottom
 * ------------------------------------ */
#bnrArea_bottom {
	width: 100%;
	padding: 30px 0 0;
	background: #569ed2 url(/shared/img/common/bg_3.png) repeat center top;
}
#bnrArea_bottom ul {
	width: 1000px;
	margin: 0 auto;
	padding: 10px 0 0 20px;
	zoom: 1;
	overflow: hidden;
}
#bnrArea_bottom ul li {
	float: left;
	width: 190px;
	margin-bottom: 10px;
	text-align: center;
}
#bnrArea_bottom ul li a {
	display: block;
}
#bnrArea_bottom ul li img {
	max-width: 100%;
	width: auto !important;
	width: 100%;
	border: solid 1px #e1e1e1;
}
@media (max-width: 1000px) {
	#bnrArea_bottom { padding: 3% 2% 0;}
	#bnrArea_bottom ul { width: 100%; padding: 0;}
	#bnrArea_bottom ul li { width: 33%; text-align: center;}
	#bnrArea_bottom ul li a { display: block; margin: 0 auto; width: 96%;}
}
@media (max-width: 767px) {
	#bnrArea_bottom { padding: 4% 3% 0;}
	#bnrArea_bottom ul li { width: 33%; text-align: center;}
}
@media (max-width: 590px) {
	#bnrArea_bottom ul li { width: 50%; text-align: center;}
}

/* ------------------------------------
 * Footer
 * ------------------------------------ */
footer {
	color: #333333;
}
footer nav {
	padding: 38px 0 40px;
	background: #569ed2 url(/shared/img/common/bg_3.png) repeat center top;
}
footer nav ul {
	max-width: 960px;
	margin: 0 auto;
	overflow: hidden;
	text-align: center;
	font-size: 0;
}
footer nav ul li {
	position: relative;
	display: inline-block;
	font-size: 12px;
}
footer nav ul li::after {
	display: inline-block;
	content: "";
	background-color: #ffffff;
	width: 10px;
	height: 1px;
	vertical-align: middle;
}
footer nav ul li:last-of-type::after {
	display: none;
}
footer nav ul li a {
	display: inline-block;
	height: 20px;
	line-height: 20px;
	padding: 0 10px;
	color: #ffffff;
	text-align: center;
	text-decoration: none;
	vertical-align: middle;
	font-size: 93%;
}
footer nav ul li a:hover {
	text-decoration: none;
}
footer small {
	display: block;
	padding: 2%;
	color: #333333;
	font-size: 85%;
}
@media (max-width: 768px) {
	footer nav {
		padding: 3% 0 4%;
	}
	footer nav ul { width:100%; padding:0;}
	footer nav ul li {
		display: inline;
	}
	footer nav ul li:nth-child(3n)::after {
		display: none;
	}
	footer nav ul li:nth-child(4)::before {
		display: block;
		content: " ";
		width: 0;
		height: 0;
	}
	footer nav ul li a {
		height: 28px;
		line-height: 28px;
		margin: 0 auto !important;
	}
}

/* ------------------------------------
 * jquery.dwImageProtector.js：Copy guard
 * ------------------------------------ */
.guard {
	position: relative;
	width: 100%;
	height: auto;
	margin: 0 auto;
}

/* ------------------------------------
 * clearfix
 * ------------------------------------ */
header nav:after,
header nav #memberNav:after,
#cbp-hrmenu > ul:after,
#menu ul:after,
#topicPath ul:after,
section .box:after,
form dl:after,
.sub .localNav:after,
footer nav ul:after {
    clear: both;
    display: block;
    height: 0;
    line-height: 0;
    content: ".";
    visibility: hidden;
}