/* CSS Document */

.pc {
	display:block;
}
.sp {
	display:none;
}

/* heaer */
.pc.pc_header {
	position: relative;
	height: 63px;
}
.pc.pc_header > a {
    position: absolute;
    left: 50%;
    transform: translateX(-490px);
	}
.single_header_tbl {
    background-color: #09F;
}
.single_header_tbl > div {
	width: 980px;
	margin: 0 auto;
}

/* footer */
.pc #footer {
	margin: 0 auto;
}

/* contentsArea */
#contentsArea {
	background-color: #fff;
	width: 980px;
	margin: 0 auto;
}
 @media screen and (max-width: 639px) {
	 #contentsArea {
	 	width: 100%;
	 }
 }

#mainvisual {
	width: 700px;
	margin: 20px auto 0;
}
#mainvisual img {
	width: 100%;
	height: auto;
}
#mainvisual span {
	text-align:right;
	padding:0.5em 0 0 0;
	display:block;
	font-size:75%;
}

#mainvisual+h2 {
	margin:40px 0;
	text-align:center;
	color:#09F;
}
.phase {
	width:700px;
	margin:0 auto 50px;
}
.phase h3 {
	font-size:100%;
}
.phase h3.title {
	color:#09F;
}
.phase p {
	font-size:100%;
	line-height: 1.5;
}
.phase .caution {
	font-size:75%;
}

.phase ul.column {
	padding:20px 20px 20px 30px;
	background:#e3f9ff;
	margin:0 0 15px;
}
.phase li {
	line-height:1.4;
}
.phase ul.column + p {
	padding-left:2.5em;
	text-indent:-2.5em;
}
.phase .photo span {
	font-size:75%;
	display: block;
	margin-top: 4px;
}
.phase .photo span.cr {
	text-align: right;
	font-size:70%;
}

.phase.last ul {
	padding:0;
	margin:0;
	text-align:center;
}
.phase.last li {
	display:inline-block;
	width:220px;
	margin:0 20px 0 0;
	text-align:center;
	font-weight:bold;
	border-radius:4px;
	background:#eba12b;
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffa84c+0,ff7b0d+100;Orange+3D */
	background: #ffa84c; /* Old browsers */
	background: -moz-linear-gradient(top,  #ffa84c 0%, #ff7b0d 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top,  #ffa84c 0%,#ff7b0d 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom,  #ffa84c 0%,#ff7b0d 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffa84c', endColorstr='#ff7b0d',GradientType=0 ); /* IE6-9 */
}
.phase.last li:hover {
	filter:alpha(opacity=70);
	-moz-opacity: 0.7;
	opacity: 0.7;
}
.phase.last li:last-child {
	margin-right:0;
}
.phase.last li a {
	color:#FFF;
	text-decoration:none;
	padding:0.8em;
	display:block;
}


.textarea {
	width: 400px;
	float: left;
}
.imgbox {
	width: 275px;
	float: right;
}
	.imgbox img {
		width: 100%;
		height: auto;
	}

.phase h4 span {
	color: #09F;
}
.exhibit {
	width: 700px;
	margin: 0 auto;
}

 @media screen and (max-width: 639px) {
 body {
 margin:0;
 padding:0;
}
 img {
 width:100%;
}
 .pc {
 display:none;
}
 .sp {
 display:block;
}
 #wapper {
 width:auto;
}
 #headerArea {
 padding:4% 0 4% 5%;
}
 #headerArea img {
 width:60%;
}

#mainvisual {
	width: 100%;
	margin: 0 auto;
}

#mainvisual span {
	padding:0.5em 5% 0 0;
}

#mainvisual+h2 {
	width:80vw;
	margin:6vw auto;
	font-size: 20px;
	line-height: 1.4;
}

.phase h3 {
	margin: 1em 0;
	font-size:16px;
	line-height: 1.4;
}
.phase h4 {
	font-size:16px;
	line-height: 1.4;
}
 .phase {
 width:90%;
 margin-bottom:7%;
}
.phase p {
	font-size:14px !important;
	line-height: 1.5;
}
.phase ul.column {
	padding:4vw 3vw 4vw 6vw;
}
.phase ul {
	padding-left:1em;
}

 .phase li {
 width:100%;
 margin-bottom:3%;
	list-style:outside disc;
}
 .phase li:last-child {
 margin-bottom:0;
}
 .phase li a {
 display:block !important;
}
 .phase.last h4 {
 margin-bottom:2%;
}

.textarea {
	width: 100%;
	float: none;
}
.imgbox {
	width: 100%;
	float: none;
}
.exhibit {
	width: 90%;
	margin-bottom: 1.5vw;
}

.phase .photo span {
	font-size:100%;
}

}

.toiawase {
	text-align:center;
	font-size:14px;
}
