/* CSS Document */

.phase_w
 {
	width:100%;
	background-color:#666666;
	

	
}

.phase_w2
 {
	width:100%;

}

.message {
	margin-top:20px;
	margin-bottom:20px;
	padding-top: 20px;
	padding-right: 50px;
	padding-bottom: 20px;
	padding-left: 50px;
	text-align:center;
}

.visual_02_pc {
	width:100%;
	height:auto;
	margin-bottom:20px;
}

#contentsArea .visual_02 span {
	text-align:right;
	padding:0.5em 0.5em 0.5em 0;
	display:block;
	font-size:75%;
}



.visual_02_sp {
	display:none;
}


.u_tube{
	width:560px;
	height:auto;
	margin-right: auto;
	margin-left: auto;	
	
}


.video{
	width:560px;
	height:auto;
	margin-right: auto;
	margin-left: auto;	
	
}

.video_text {
	width:560px;
	margin-right:auto;
	margin-left:auto;
	margin-top:1em;
	font-size:0.8em;
}

	
#contentsArea .phase_w .message.white p  {
	color: #FFF;
	line-height:1.8em;
	font-size:1em;
	
}



#contentsArea .phase .clearfix .textarea p {
	line-height:1.8em;
	font-size:1em;
	
}


#contentsArea .phase .textarea p {
	line-height:1.8em;
	font-size:1em;
	
}



.text_bold {
	font-size:1.25em;
	font-weight:bold;
}

.phase_w h3 {
	font-size:100%;
}
.phase_w h3.title {
	color:#09F;
}
.phase_w p {
	font-size:1em;
}
.phase_w .caution {
	font-size:75%;
}

.phase_w ul.column {
	padding:20px 20px 20px 30px;
	background:#e3f9ff;
	margin:0 0 15px;
}
.phase_w li {
	line-height:1.4;
}
.phase_w ul.column + p {
	padding-left:2.5em;
	text-indent:-2.5em;
}
.phase_w .photo span {
	font-size:75%;
	text-align: right;
	display: block;
}



.phase_w.last.bg_gray h4 {
 margin-bottom:2%;
 background-color:#666666;
 color:#FFF;
 text-align:center;
 padding-top:2em;
 padding-bottom:1em;
 line-height:2;
}


.phase_w.last ul {
	padding:0;
	margin:0;
	text-align:center;
}
.phase_w.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_w.last li:hover {
	filter:alpha(opacity=70);
	-moz-opacity: 0.7;
	opacity: 0.7;
}
.phase_w.last li:last-child {
	margin-right:0;
}
.phase_w.last li a {
	color:#FFF;
	text-decoration:none;
	padding:0.8em;
	display:block;
}

.relation {
	width:80%;
	margin-bottom:1em;
	margin-left:10%;
	padding-bottom:1em;


}

.relation .title {
	font-size:1.2em;
}

#contentsArea .relation ul {
	margin-left:1.5em;

}

#contentsArea .relation ul li  {
	font-size: 0.9em;
	margin-bottom:0.5em;
	line-height:1.4;
}

#contentsArea .relation ul li a{
	color:#0099FF;
	text-decoration:none;
}

#contentsArea .relation ul li a{
	color:#0099FF;
	text-decoration:none;
}

#contentsArea .relation ul li a:hover{
	color:#0099FF;
	text-decoration:underline;
}


 @media screen and (max-width: 639px) {
 body {
 margin:0;
 padding:0;
}
 img {
 width:100%;
}
 p, a {
 font-family:"メイリオ", Meiryo,"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro",  Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
 color:#333333;
}
 a {
 display:inline !important;
}
 .pc {
 display:none;
}
 .sp {
 display:block;
}
 #wapper {
 width:auto;
}
 #headerArea {
 padding:4% 0 4% 5%;
}
 #headerArea img {
 width:90%;
}

#mainvisual+h2 {
	width:80vw;
	margin:6vw auto;
}
 .phase_w {
 width:100%;
 /*margin-bottom:7%;*/
}

#contentsArea .phase .textarea h4 span {
	font-size:1.4em!important;
	line-height:2;
}


#contentsArea .phase_w .message {
	margin-top:20px;
	padding-top: 20px;
	padding-right: 20px;
	padding-bottom: 20px;
	padding-left: 20px;
	text-align:center;
}

#contentsArea .phase_w .message p{
	text-align:center;
	line-height:1.8em;
	font-size:1.2em!important;
}


#contentsArea .phase .clearfix .textarea p {
	line-height:1.8em;
	font-size:1.2em!important;
	margin-top:1em;
}

#contentsArea .phase .textarea p {
	line-height:1.8em;
	font-size:1.2em!important;
	text-align:left;
	margin-top:1em;

}


.visual_02 img{
	width:100%;
	height:auto;
}

#mainvisual .credit {
	text-align:right;
	padding:0.5em 1em  0.5em 0;

}

#mainvisual .caption {
	text-align:left;
	padding:0 1em 1em 1em;

}



.visual_02 span {
	text-align:right;
	padding:0.5em 1em  0.5em 0;
}

.video{
  position:relative;
  width:100%;
  padding-top:56.25%;
}
.video iframe{
  position:absolute;
  top:0;
  right:0;
  width:100%;
  height:100%;
}


 .video_text {
	width:100%;;
	margin-right:auto;
	margin-left:auto;
	margin-top:0.5em;
}


.phase_w ul.column {
	padding:4vw 3vw 4vw 6vw;
}
.phase_w ul {
	padding-left:1em;
}

.phase_w li {
 width:95%;
 margin-bottom:3%;
	list-style:outside disc;
}
.phase_w li:last-child {
 margin-bottom:0;
}
.phase_w li a {
 display:block !important;
}
.phase_w.last h4 {
 margin-bottom:2%;
}


#contentsArea .phase_w.last h4 {
	/*line-height:1.8em;*/
	font-size:1.2em!important;
}


.textarea {
	width: 100%;
	float: none;
	padding-right:0px;
	padding-left:0px;
}
.imgbox {
	width: 100%;
	float: none;
}
.exhibit {
	width: 90%;
	margin-bottom: 1.5vw;
}

/*画像切り替え*/

.visual_02_pc {
	display:none;
}
.visual_02_sp {
	display:block;
}

.visual_02_sp img{
	width:100%;
	height:auto;
	margin-bottom:20px;
}

.visual_02 span_sp {
	text-align:right;
	padding:0.5em 0 0.5em 0;
	display:block;
	font-size:75%;
}


.relation {
	width:90%;
	margin-bottom:3em;
	margin-left:5%;


}

#contentsArea .relation .title {
	font-size:1.4em!important;
}


#contentsArea .relation ul {
	line-height:1.8;
	list-style:disc;
	margin-left:1.5em;
}

#contentsArea .relation ul li  {
	font-size: 1.2em;
	
}
#contentsArea .relation ul li a{
	color:#0099FF;
	text-decoration:none;
	
}
#contentsArea .relation ul li a:hover{
	color:#0099FF;
	text-decoration:underline;
}


}


/*汎用*/

.mb_20 {
	margin-bottom:20px;
}

.mb_50 {
	margin-bottom:50px;
}

.mb_60 {
	margin-bottom:60px;
}

.mb_80 {
	margin-bottom:80px;
}


.mt_20 {
	margin-top:20px;
}

.pb_50 {
	padding-bottom:50px;
}
