@charset "UTF-8";

/*================================================
 *  CSSリセット
 ================================================*/
html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,abbr,address,cite,code,del,dfn,em,img,ins,kbd,q,samp,small,strong,/*sub,sup,*/var,b,i,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent;font-weight:normal;}body{line-height:1}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:none}a{margin:0;padding:0;font-size:100%;vertical-align:baseline;background:transparent}del{text-decoration:line-through}abbr[title],dfn[title]{border-bottom:1px dotted;cursor:help}table{border-collapse:collapse;border-spacing:0}hr{display:block;height:1px;border:0;border-top:1px solid #ccc;margin:1em 0;padding:0}input,select{vertical-align:middle}

/*================================================
 *  一般・共通設定
 ================================================*/
* {
	box-sizing:border-box;
}
html {
	margin:0;
	padding:0;
	overflow:auto;
	width:100%;
}

body {
	background:#FFF;
	width:100%;
	margin:0;
	padding:0;
	font-size:14px;
	-webkit-text-size-adjust: 100%;
	color:#333;
	font-family:"メイリオ",Meiryo,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro",Osaka,"ＭＳ Ｐゴシック","MS PGothic",sans-serif;
	line-height:26px;
}

a {
	color:#000;
}
a:hover {
	color:#C70000;
}

h1 {
	font-size:14px;
	line-height:1.2;
}
h1 a {
	color:#C70000;
	text-decoration:none;
}
h1 a:hover {
	color:#780b0b;
	text-decoration:underline;
}

h2{
	font-size:15px;
	position:absolute;
	top:24%;
	left: 50%;
	margin-left:-480px;
	line-height:1.3;
	text-shadow: 1px 1px 1px #FFF;
}
h2 span{
	letter-spacing:4px;
	font-size:56px;
	font-family:'Verdana', 'Open Sans', sans-serif;
	font-weight:500;
	font-style:italic;
	-webkit-transform: scale(0.7,1);
	transform: scale(0.7,1);
	-webkit-transform-origin: center top;
	transform-origin: center top;
	display:block;
	margin-left:-20%;
} 

h2 {
	font-size:14px;
}

h3 {
	font-size:48px;
	text-align:center;
	margin:80px 0 60px 0;
	line-height:1.2;
}
h3 span {
	display:block;
	font-size:16px;
}

h4 {
	background:#000;
	font-size:16px;
	color:#FFF;
	letter-spacing:1px;
	padding:5px 10px;
	margin-bottom:20px;
}

h5 {
	margin-bottom:20px;
	padding:2px;
	font-size:14px;
	font-weight:bold;
	border-bottom:1px solid #666;
}

h6 {
	margin-bottom:0.25em;
	color:#006eb0;
	font-size:14px;
	font-weight:bold;
}

p {
	margin:0;
}

img {
	vertical-align:top;
	max-width:100%;
}

em {
	font-weight:bold;
}

strong {
	font-weight:bold;
	color:#f19500;
}

pre {
	margin:1em 0;
	padding:1em;
}

dt {
	font-weight:bold;
}
dd {
	margin-bottom:20px;
}

blockquote {
	margin-bottom:1em;
	padding:1em;
	border:1px dotted #ddd;
	border-left:5px solid #ddd;
}

table {
	width:100%;
	border-collapse:collapse;
	border:1px solid #666;
	margin-bottom:1em;
}
th, td {
	padding:10px;
	border:1px solid #666;
	/*font-size:12px;*/
	vertical-align:middle;
}
th {
	font-weight:normal;
	background:#EEE;
}
td.category, th.category {
	text-align:left;
	background:#333;
	color:#FFF;
	font-weight:bold;
}
.center td {
	text-align:center;
}
table.block {
}
@media screen and (max-width:640px) {
	table.block th, table.block td {
		width:100%;
		display:block;
	}
}

ol {
	list-style:decimal-leading-zero;
	margin-left:28px;
}
ol ul {
	margin:10px 0 20px 0;
}
ol li {
	margin-bottom:5px;
}
ol li ul {
	list-style:disc;
	margin:0 0 10px 23px;
}

hr.line {
	background:#FFf url(../images/bg_line.png) center left repeat-x;
	border:0px;
	height:6px;
	margin:50px 0;
}


@media screen and (max-width:979px) {
	body {
		box-sizing:border-box;
		width:100%;
		padding:0;
		overflow:auto;
	}
	h2{
		left:0;
		top:24%;
		margin:0 5%;
		width:90%;
	}
}
@media screen and (max-width:800px) {
	h2{
		top:24%;
		left:3%;
	}
	h2 span {
		font-size:40px;
	}
}
@media screen and (max-width:640px) {
	body {
		line-height:1.8;
	}
	h2{
		top:24%;
		left:3%;
		font-size:14px;
	}
	h2 span{
		font-size:30px;
	}
	h3 {
		font-size:30px;
		margin:20px 0 60px 0;
	}
	h3 span {
		font-size:12px;
	}
	td.category, th.category {
		font-size:14px !important;
		font-weight:normal;
	}
}

/*================================================
 *  ヘッダー
 ================================================*/
header {
	background:#e60012 url(../images/header.png) top center no-repeat;
	background-size:cover;
}

header h1 {
	width:960px;
	margin:0 auto;
}
header h1 span {
	float:right;
	font-size:12px;
	color:#FFF;
	padding:20px 0 0 0;
}
.header_img img {
	width:100%;
	max-width:100%;
	height:auto;
}
/* スライド画像 */
.bxslider img {
	width:100%;
	max-width:100%;
}
/* トップ画像 */
#top_img {
	width:100%;
}
#top_img img {
	width:100%;
	max-width:100%;
}

#top {
	width:100%;
	padding:0;
	margin:0;
	position:relative;
}

@media screen and (max-width:979px) {
	header {
		width:100%;
	}
	header h1 span {
		display:none;
	}
}
@media screen and (max-width:767px) {
	header {
		background:#e60012;
		border-bottom:4px solid #000;
	}
	header h1 {
		width:100%;
		text-align:center;
	}
}


/*================================================
 *  パンくず
 ================================================*/
#brdcrmb {
	background:#EEE;
}
#brdcrmb .inner {
	width:960px;
	margin:0 auto;
	padding:5px 0;
}
#brdcrmb ul {
	margin:0;
	padding:0;
}
#brdcrmb li {
	list-style:none;
	display:inline;
	font-size:12px;
}
#brdcrmb li a {
	text-decoration:none;
}
#brdcrmb li::after {
	content:"　>　";
}
#brdcrmb li:last-child::after {
	content:"";
}
@media screen and (max-width:979px) {
	#brdcrmb .inner {
		width:94%;
		margin:0 auto;
	}
}


/*================================================
 *  コンテンツ
 ================================================*/
#contents {
	width:100%;
	margin:0;
	clear:both;
}
/* 中 */
.inner {
	width:960px;
	margin:50px auto;
}
@media screen and (max-width:979px) {
	#contents {
		width:100%;
		display:block;
	}
	.inner {
		width:100%;
		margin:auto;
		padding:50px 20px;
	}
}

/*================================================
 *  フッターメニュー
 ================================================*/
.footmenu {
	width:100%;
	background:#EEE;
}
.footmenu dl {
	width:960px;
	margin:0 auto;
	padding:30px 0;
	font-size:12px;
}
.footmenu dl:after {
	content:"";
	display:block;
	clear:both;
}
.footmenu dt {
	padding-bottom:5px;
	margin-bottom:5px;
	border-bottom:1px dotted #CCC;
	font-weight:normal;
	clear:both;
}
.footmenu dt:hover {
	cursor:pointer;
}
.footmenu dd {
	margin-bottom:20px;
}
.footmenu li {
	float:left;
	list-style:none;
	margin:0 30px 10px 0;
	text-align:center;
}
.footmenu a {
	color:#000;
	text-decoration:none;
}
.footmenu a:hover {
	color:#EB0E11;
}
@media screen and (max-width:979px) {
	.footmenu dl {
		width:96%;
	}
}
@media screen and (max-width:767px) {
	.footmenu dl {
		padding:0;
	}
	.footmenu dt {
		padding:10px;
		margin:0;
		cursor:pointer;
		text-align:center;
	}
	.footmenu dd {
		display:none;
	}
	.footmenu li {
		width:33%;
		margin:0;
		text-align:center;
	}
	.footmenu li a {
		display:block;
		padding:8px 0;
	}
	.footmenu li a:hover {
		background:#CCC;
	}
}


/*================================================
 *  フッター
 ================================================*/
footer {
	clear:both;
	background:#e60012 url(../images/footer.png) bottom center no-repeat;
	background-size:cover;
	text-align:left;
	font-size:11px;
	text-align:left;
	color:#EEE;
}
.footer {
	clear:both;
	width:960px;
	height:60px;
	margin:0 auto;
}
.footer img {
	float:right;
	margin-top:5px;
}
.footer span {
	float:left;
	margin:20px 0 0 0;
}
@media screen and (max-width:979px) {
	.footer {
		width:100%;
	}
}
@media screen and (max-width:767px) {
	footer {
		background:#e60012;
		border-top:4px solid #000;
	}
	.footer {
		width:100%;
	}
	.footer img {
		display:none;
	}
	.footer span {
		display:block;
		width:100%;
		text-align:center;
	}
}



/*================================================
 *  ページトップへの戻り
 ================================================*/
.totop {
	position:fixed;
	bottom:15px;
	right:15px;
}
.totop a {
	display:block;
	text-decoration:none;
}
.totop img {
	background:#e83929;
	opacity:0.7;
}
.totop img:hover {
	background:#e2041b;
}


/*================================================
 *  ニュース
 ================================================*/
.news {
	width:100%;
	max-width:760px;
	margin:0 auto;
}
.news dt {
	float:left;
	border-bottom:0px;
	font-weight:normal;
}
.news dd {
	margin:0 0 10px 100px;
}
.news a{
	color:#000;
	text-decoration:none;
}
.news a:hover {
	text-decoration:underline;
}

.btn{
	display: block;
	margin:0 auto;
	width:130px;
	height:45px;
	font-size:15px;
	text-align:center;
	line-height:43px;
	font-family:Century Gothic;
	border:2px solid #000;
	border-radius:45px;
	color:#000;
	text-decoration: none;
	outline: none;
}
.btn::before,
.btn::after {
	position: absolute;
	z-index: -1;
	display: block;
	content: '';
}
.btn,
.btn::before,
.btn::after {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	-webkit-transition: all .3s;
	transition: all .3s;
}
.btn:hover {
	background: #000;
	color:#fff !important;
}
@media screen and (max-width:640px) {
	.news {
		width:100%;
	}
	.news dt, .news dd {
		float:none;
		display:block;
		width:100%;
		margin-left:0;
	}
}

/*================================================
 *  ニュースページ
 ================================================*/
.newspage dl {
	display:table;
	width:100%;
	margin:10px 0;
	padding-bottom:10px;
	border-bottom:1px solid #CCC;
}
.newspage dt {
	display:table-cell;
	width:100px;
	vertical-align:middle;
	border-left:3px solid #C70000;
	padding:10px 10px 10px 20px;
}
.newspage dd {
	display:table-cell;
	padding:10px;
	/*line-height:2;*/
}
.newspage dd a:visited {
	color:#666;
}
.newspage dd a:hover {
	text-decoration:underline;
	color:#780b0b;
}

@media screen and (max-width: 640px) {
	.newspage dt {
		display:block;
		width:100%;
		border:none;
		padding:0 0 10px 0;
		color:#CC0000;
		font-weight:bold;
		border-bottom:1px solid #CCC;
	}
	.newspage dd {
		display:block;
		padding:10px 0;
		line-height:1.7;
	}
	.newspage dd br {
		display:none;
	}
	.newspage dd a {
		display:block;
		padding:5px 0;
	}
	.newspage dd a:visited {
		color:#666;
	}
	.newspage dd a:hover {
		text-decoration:underline;
		color:#780b0b;
	}
}
/*================================================
 *  ショップリンク
 ================================================*/

/* 2カラム 50:50 */
.left55 {float:left; width:48%; box-sizing:border-box; }
.right55 {float:right; width:48%; box-sizing:border-box; }

/* リンクボタン */
a.linkbtn {
	display:block;
	background:#EEE;
	border:1px solid #333;
	padding:20px;
	color:#000;
	text-decoration:none;
	box-sizing:border-box;
}
a.linkbtn:hover {
	filter:alpha(opacity=80);
	-moz-opacity: 0.8;
	opacity: 0.8;
}
a.linkbtn img {
	width:100%;
	border:1px solid #999;
}

@media screen and (max-width:640px) {
	.left55, .right55 {
		float:none;
		display:block;
		width:100%;
	}
}

/*================================================
 *  表の横スクロール
 ================================================*/
 
.scroll {}
@media screen and (max-width:767px) {
	.scroll{overflow: auto;	white-space: nowrap;}
	.scroll::-webkit-scrollbar{ height: 5px;}
	.scroll::-webkit-scrollbar-track{ background: #F1F1F1;}
	.scroll::-webkit-scrollbar-thumb { background: #BCBCBC;}
	.scroll::before {
		content:"この表は横にスクロールします";
		font-size:10px;
		font-weight:bold;
		color:#c53d43;
	}
}


/*================================================
 *  2段組み
 ================================================*/
/* 40:60のカラム */
.left46 {float:left; width:41.75%; }
.right46 {float:right; width:55%; }
/* 60:40のカラム */
.left64 {float:left; width:55%; }
.right64 {float:right; width:41.75%; }
/* 50:50のカラム */
.left55 {float:left; width:48%; }
.right55 {float:right; width:48%; }
/* 30:70のカラム */
.left37 {float:left; width:31.4%; }
.right37 {float:right; width:64.6%; }
/* 70:30のカラム */
.left73 {float:left; width:64.6%; }
.right73 {float:right; width:31.4%; }
/* 20:80のカラム */
.left28 {float:left; width:20.85%; }
.right28 {float:right; width:76.1%; }
/* 80:20のカラム */
.left82 {float:left; width:76.1%; }
.right82 {float:right; width:20.85%; }
/* 50:50のカラムでスマホでも2カラムの場合 */
.left55sp {float:left; width:48%; }
.right55sp {float:right; width:48%; }

@media screen and (max-width: 640px) {
	.left46, .right46,
	.left64, .right64,
	.left55, .right55,
	.left37, .right37,
	.left73, .right73,
	.left28, .right28,
	.left82, .right82,
	.left442, .right442,
	.fleft, .fright {
		float:none;
		width:100%;
	}
}



/*================================================
 *  段組み
 ================================================*/

/* 2カラム */
.column21 li{
		float:left;
		width:48%;
		margin:0 4% 20px 0;
}
.column21 li:nth-child(2n){margin-right:0;}
.column21 li:nth-child(2n+1){clear:both;}

@media screen and (max-width: 640px) {
	.column21 li{
		float:none;
		width:100%;
		margin:0 0 15px 0;
	}
}
/* 2カラム(SP 2カラム) */
.column22 li{
		float:left;
		width:48%;
		margin:0 4% 20px 0;
}
.column22 li:nth-child(2n){margin-right:0;}
.column22 li:nth-child(2n+1){clear:both;}




/* 3カラム */
.column321 li, .column32 li {
	float:left;
	width:31.5%;
	margin:0 2.5% 20px 0;
}
.column321 li:nth-child(3n), .column32 li:nth-child(3n) {margin-right:0; }
.column321 li:nth-child(3n+1), .column32 li:nth-child(3n+1) {clear:both; }
@media screen and (max-width: 640px) {
	.column321 li, .column32 li {
		float:left;
		width:48%;
		margin:0 4% 10px 0;
	}
	.column321 li:nth-child(3n), .column32 li:nth-child(3n) {margin-right:4%;}
	.column321 li:nth-child(3n+1), .column32 li:nth-child(3n+1) {clear:none;}
	.column321 li:nth-child(2n), .column32 li:nth-child(2n) {margin-right:0;}
	.column321 li:nth-child(2n+1), .column32 li:nth-child(2n+1) {clear:both;}
}
@media screen and (max-width: 480px) {
	.column321 li {
		float:none;
		width:100%;
		margin:0 0 15px 0;
	}
	.column321 li img {
		width:100%;
	}
}


/* 4カラム　→　2カラム */
.column42 li {
	float:left;
	width:23.5%;
	margin:0 2% 20px 0;
}
.column42 li:nth-child(4n) {margin-right:0;}
.column42 li:nth-child(4n+1){clear:both;}

@media screen and (max-width: 640px) {
	.column42 li {
		float:left;
		width:49%;
		margin:0 2% 10px 0;
	}
	.column42 li:nth-child(4n) {margin-right:2%;}
	.column42 li:nth-child(4n+1) {clear:none;}
	.column42 li:nth-child(2n) {margin-right:0;}
	.column42 li:nth-child(2n+1){clear:both;}
}



/* 5カラム */
.column532 li {
	float:left;
	width:18.4%;
	margin:0 2% 20px 0;
}
.column532 li:nth-child(5n) {margin-right:0;}
.column532 li:nth-child(5n+1) {clear:both;}

@media screen and (max-width: 768px) {
	.column532 li {
		float:left;
		width:23.5%;
		margin:0 2% 10px 0;
		list-style:none;
	}
	.column532 li img {width:100%;}
	.column532 li:nth-child(5n) {margin-right:2%;}
	.column532 li:nth-child(5n+1) {clear:none;}
	.column532 li:nth-child(3n) {margin-right:0;}
	.column532 li:nth-child(3n+1) {clear:both;}
}
@media screen and (max-width: 480px) {
	.column532 li {
		float:left;
		width:49%;
		margin:0 2% 10px 0;
	}
	.column532 li:nth-child(3n) {margin-right:2%;}
	.column532 li:nth-child(3n+1) {clear:none;}
	.column532 li:nth-child(2n) {margin-right:0;}
	.column532 li:nth-child(2n+1) {clear:both;}
}


/* 6カラム */
.column642 li {
	float:left;
	width:15%;
	margin:0 2% 10px 0;
}
.column642 li img {width:100%;}
.column642 li:nth-child(6n) {margin-right:0;}
.column642 li:nth-child(6n+1) {clear:both;}

@media screen and (max-width: 768px) {
	.column642 li {
		float:left;
		width:23.5%;
		margin:0 2% 10px 0;
	}
	.column642 li:nth-child(6n) {margin-right:2%;}
	.column642 li:nth-child(6n+1) {clear:none;}
	.column642 li:nth-child(4n) {margin-right:0;}
	.column642 li:nth-child(4n+1) {clear:both;}
}
@media screen and (max-width: 480px) {
	.column642 li {
		float:left;
		width:49%;
		margin:0 2% 10px 0;
	}
	.column642 li:nth-child(4n) {margin-right:2%;}
	.column642 li:nth-child(4n+1) {clear:none;}
	.column642 li:nth-child(2n) {margin-right:0;}
	.column642 li:nth-child(2n+1) {clear:both;}
}


.column_no li {
	float:none;
	width:100%;
	margin-bottom:0;
}
 
/*================================================
 *  クラス
 ================================================*/
 
.clearfix {
	box-sizing:border-box;
}
.clearfix:after {
    content:"";
    display:block;
    clear:both;
}
/* 余白 */
.mb05 {margin-bottom:5px; }
.mb10 {margin-bottom:10px; }
.mb15 {margin-bottom:15px; }
.mb20 {margin-bottom:20px; }
.mb25 {margin-bottom:25px; }
.mb30 {margin-bottom:30px; }
.mb40 {margin-bottom:40px; }
.mb50 {margin-bottom:50px; }
.mb80 {margin-bottom:80px; }
.mb100 {margin-bottom:100px; }

.mr05 {margin-right:5px; }
.mr10 {margin-right:10px; }
.mr15 {margin-right:15px; }
.mr20 {margin-right:20px; }
.mr25 {margin-right:25px; }
.mr30 {margin-right:30px; }

.ml05 {margin-left:5px; }
.ml10 {margin-left:10px; }
.ml15 {margin-left:15px; }
.ml20 {margin-left:20px; }
.ml25 {margin-left:25px; }
.ml30 {margin-left:30px; }

.mt05 {margin-top:5px; }
.mt10 {margin-top:10px; }
.mt15 {margin-top:15px; }
.mt20 {margin-top:20px; }
.mt25 {margin-top:25px; }
.mt30 {margin-top:30px; }
.mt40 {margin-top:40px; }
.mt50 {margin-top:50px; }
.mt80 {margin-top:80px; }
.mt100 {margin-top:100px; }

.bld {font-weight:bold; }
.txt_l {text-align:left; }
.txt_c {text-align:center; }
.txt_r {text-align:right; }
.txt_u {text-decoration: underline; }

.red {
	color:#C70000;
}
.img {
	width:100%;
	height:auto;
}

/* 枠 */
.border {border:1px solid #999; }

/* フォントサイズ */
.fnt12 {font-size:12px; }
.fnt14 {font-size:14px; }
.fnt16 {font-size:16px; }
.fnt18 {font-size:18px; }
.fnt24 {font-size:24px; }
.fnt28 {font-size:28px; }

/* ボタン */
.button {
	display:block;
	width:80%;
	margin:auto;
  position: relative;
  background-color: #f7d034;
  border-radius: 4px;
  color: #000;
	font-size:16px;
	text-decoration:none;
	padding:20px;
  -webkit-transition: none;
  transition: none;
  box-shadow: 0 3px 0 #f7ba59;
}
.button:hover {
  top: -4px;
  box-shadow: 0 7px 0 #f7ba59;
	color:#000;
}
.button:active {
  top: 3px;
  box-shadow: none;
}

@media screen and (max-width:640px) {
	.button {
		padding:10px;
		font-size:14px;
		width:100%;
	}
}

/* Google Map */
.ggmap {
position: relative;
padding-bottom: 56.25%;
padding-top: 30px;
height: 0;
overflow: hidden;
}
 
.ggmap iframe,
.ggmap object,
.ggmap embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}

/*================================================
 *  戻るボタン
 ================================================*/

.back {
	margin:50px 0 30px 0;
}
.back a {
	display:block;
	width:300px;
	text-align:center;
	margin:auto;
	padding:10px;
	color:#fff;
	text-decoration:none;
	border-radius:5px;
	background:#1b1b1b url('../images/bg_arrow_white.png') 20px 50% no-repeat;
	transition:all 0.2s ease 0s;
}
.back a:hover {
	background:#2e2e2e url('../images/bg_arrow_white.png') 20px 50% no-repeat;
	transition:all 0.2s ease 0s;
}
@media screen and (max-width:640px) {
	.back a {
		width:100%;
	}
}


/*================================================
 *  動画
 ================================================*/

.movie-wrap {
     position: relative;
     padding-bottom: 56.25%; /*アスペクト比 16:9の場合の縦幅*/
     height: 0;
     overflow: hidden;
}
.movie-wrap iframe {
     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%;
}
@media screen and (max-width: 600px) {
	.movie_width {
		width:100%;
	}
}



/*================================================
 *  PC　⇔　SP 表示切り替え
 ================================================*/

.switch {}

/* PC非表示 */
.pc_no {display:none; }
.sp_no {}
.txt_cl {text-align:center; }

@media screen and (max-width:640px) {
	.pc_no {display:block; }
	.sp_no {display:none; }
	.txt_cl {text-align:left; }
}


/* エラーページ */
.error {font-size:50px; text-align:center; margin:100px 0 80px 0; line-height:1.25; }
.error span {font-size:24px; display:block; }
.link {display:block; border:2px solid #CCC; background:url(../images/arrow.png) 5px center no-repeat; padding:10px 20px 10px 25px; text-decoration:none; }
.link:hover {background:#EEEEEE url(../images/arrow.png) 5px center no-repeat;; }
@media screen and (max-width:640px) {
	.error {font-size:30px; }
	.error span {font-size:14px; }
}


/*================================================
 *  HTML表示非表示
 ================================================*/
.hidden_box {
	width: 100%;
	margin: 10px 0;
	padding: 0;
	text-align: center;
}

.hidden_box label {
	display: block;
	background: #CC0000;
	color: #FFF;
	cursor: pointer;
	font-size: 18px;
	font-weight: bold;
	margin: 0;
	padding: 15px;
	min-width: 50%;
}

.hidden_box label:hover {
 background: #990000;
}

/* 閉じている状態のときにラベルの後ろに続く文字 */
.hidden_box label:after {
	content: "　▼";
}

.hidden_box input {
 display: none;
}

.hidden_box .hidden_show {
 height: 0;
 overflow: hidden;
 opacity: 0;
 padding: 0;
 text-align: left;
 transition: all 1.5s;
}

/* 開いている状態のときにラベルの後ろに続く文字 */
.hidden_box input:checked + label:after {
	content: "　▲";
}

.hidden_box input:checked ~ .hidden_show {
 height: auto;
 opacity: 1;
 padding: 10px 0;
}

.hidden_show {
	margin-top: 20px;
}