@charset "utf-8";

/* ======================================================================
 * ======================================================================
 *
 *
 * ベース2 
 *
 *2018/05、改修に際し追加
 *2020/02、「遊べる物語」の主催移管に際し、加筆修正
 * ======================================================================
 * ====================================================================== */

#keyVisual_area  > div > #nav_classroom a,
#keyVisual_area .nav li a,
div.article div.section#newsandpickup_wrap > h3,
div.article div.section#newsandpickup_wrap > h3:after,
div.article div.section#newsandpickup_wrap > ul li a:before,
ul#pagelink li a:before{
	background:url(../img/sprite.png) no-repeat 0 0;
}

.mt20{
	margin-top:20px;
}

/* ======================================================================
 *
 * TOP用　グローバルナビ
 *
 * ====================================================================== */
body#classroom div#keyVisual_wrap div#keyVisual_area > div{
	width:980px;
	height:507px;
	position:relative;
}
body#classroom div#keyVisual_wrap div#keyVisual_area > div > img{
	width:980px;
	height:507px;
	position:absolute;
	top:0;
	left:0;
	z-index:100;
}

#keyVisual_area > div > #nav_classroom{
	position:absolute;
	top:410px;
	right:20px;
	width:255px;
	height:110px;
/*	background-color:#ffcc99;*/
	z-index:101;
}
#keyVisual_area > div > #nav_classroom a{
	display:block;
	width:255px;
	height:110px;
	background-position:-304px -1234px;
}
#keyVisual_area > div > #nav_classroom a:hover{
	background-position:-559px -1234px;
}
#keyVisual_area .nav{
	width:850px;
	height:115px;
	overflow:hidden;
/*	background-color:#99ffcc;*/
	margin-left:auto;
	margin-right:auto;
	margin-top:30px;
}
#keyVisual_area .nav li{
	width:420px;
	height:115px;
	display:block;
	margin:0 auto;
}
#keyVisual_area .nav li a{
	display:block;
	width:420px;
	height:115px;
}
#keyVisual_area .nav li a{background-position:-420px -1468px;}
#keyVisual_area .nav li a:hover{background-position:-420px -1585px;}

/* =============================================================================================== */
div.article div.section#newsandpickup_wrap > h3{
	width:						801px;
	height:						39px;
	background-position:0 -538px;
	color:						#005CCA;
	font-size:					24px;
	font-weight:				bold;
	padding:					17px 0 0 79px;
}
div.article div.section#newsandpickup_wrap > ul{
	margin-top:23px;
}

div.article div.section#newsandpickup_wrap > ul li{
	display:block;
	margin-bottom:15px;
	padding-bottom:15px;
	border-bottom:dotted 1px #666666;
}
div.article div.section#newsandpickup_wrap > ul li a{
	font-family:			"Meiryo UI";
	display:					block;
	padding:					0 0 0 30px;
	font-size:					16px;
	font-weight:				bold;
	position:					relative;
}
div.article div.section#newsandpickup_wrap > ul li a:before{
	position:					absolute;
	content:					"";
	width:						18px;
	height:						18px;
	background-position:		-960px -250px	!important;
	top:						7px;
	left:						0;
}

div.article div.section#newsandpickup_wrap > ul li a:hover:before{
	background-position:		-960px	-500px	!important;
}

div#experience_area > div > ul{
	list-style-type:disc;
	list-style-position:inside;
}


/* =============================================================================================== */
body#workshop01 > div.article > h1,
body#workshop02 > div.article > h1{
	width:900px;
	height:250px;
	margin:20px auto 0 auto;
}

body#workshop01 > div.article > h1{
	background:url('../img/ws-h1-001.png') no-repeat 0 0;
}
body#workshop02 > div.article > h1{
	background:url('../img/ws-h1-002.png') no-repeat 0 0;
}

ul#pagelink{
	margin-top:40px;
	padding:5px;
	width:860px;
	background-color:#ffffff;
	border-radius:8px;
	box-shadow:2px 2px 0 0 rgba(0,0,0,0.2)
}
ul#pagelink li{
	display:inline-block;
}
ul#pagelink li a{
	font-family:			"Meiryo UI";
	display:					block;
	padding:					0 0 0 30px;
	font-size:					16px;
	font-weight:				bold;
	position:					relative;
}
ul#pagelink li a:before{
	position:					absolute;
	content:					"";
	width:						18px;
	height:						18px;
	background-position:		-960px -850px	!important;
	top:						7px;
	left:						10px;
}
ul#pagelink li a:hover:before{
	background-position:		-960px	-750px	!important;
}
p.read{
	margin-top:40px;
	margin-bottom:40px;
}

div#appearance_movie{
	width:640px;
	height:360px;
	margin:0 auto 60px auto;
	border-radius:40px;
	border:solid 8px #2090e6;
	overflow:hidden;
}
div#appearance_movie iframe{
	width:640px;
	height:360px;
}

/* ================================================================ */
#whatiteng h3{
	display:inline-block;
	padding:6px 12px 4px 12px;
	border:solid 3px #2090e6;
	border-radius:12px;
	font-size:20px;
	font-weight:bold;
	color:#2090e6;
	background-color:#ffffff;
	margin-top:30px;
	margin-bottom:20px;
}
#whatiteng ol{
	list-style-type: decimal;
	margin-left:30px;
}


body#workshop02 > div.article div.section#report h3 {
	background-position:		0 -1710px;
}
body#workshop02 > div.article div.section#report > div#report_area > ul:first-child{
	padding:0;
}
body#workshop02 > div.article div.section#report > div#report_area > ul:first-child:before{
	background:none;
}


/* ======================================================================
 *
 * ワークショップれぽーとをもっと見る・戻る
 *
 * ====================================================================== */

div.article div.section#btn_go_next_page {
	width:						495px;
	margin:						10px auto 0;
}
/* ワークショップれぽーとをもっと見る・戻る */
div.article div.section#btn_go_next_page a {
	display:					block;
	background-position:		-420px -2200px;
	font-size:					20px;
	font-weight:				bold;
	letter-spacing:				0.15em;
	position:					relative;
	width:						317px;
}
body#workshop01 > div.article div.section#btn_go_next_page a{
	height:80px;
	padding:30px 0 0 178px;
}
body#workshop02 > div.article div.section#btn_go_next_page a{
	height:70px;
	padding:40px 0 0 178px;
}

div.article div.section#btn_go_next_page a:before {
	position:					absolute;
	content:					"";
	width:						18px;
	height:						18px;
	display:					block;
	background-position:		-960px -250px;
	top:						44px;
	left:						150px;
}
div.article div.section#btn_go_next_page a:hover {
/*	background-position:		0 -2143px;*/
	opacity:0.8;
}
div.article div.section#btn_go_next_page a:hover:before {
	background-position:		-960px -500px;
}

/* ======================================================================
/* ワークショップに申し込む */

body#workshop01 div.article div.section#btn_go_enter a {
	width:						307px;
	padding-left:				188px;
	letter-spacing:				0.05em;
	background-position:		0 -1670px;
}

body#workshop01 div.article div.section#btn_go_enter a:hover {
	background-position:		0 -1780px;
}

body#workshop01 div.article div.section#btn_go_enter a:before {
	width:						13px;
	height:						14px;
	top:						47px;
	left:						162px;
	background-position:		-960px -1000px;
}

body#workshop01 div.article div.section#btn_go_enter a:hover:before {
	background-position:		-960px -1250px;
}

/* 募集締め切り時の告知 */
body#workshop01 div.article div.section ul.closed {
	width:						400px;
	margin:						20px auto 50px;
	background-color:			#ECECEC;
	padding:					15px;
}
/* ======================================================================*/

body#classroom > div#transferhost{
	width:600px;
	margin:40px auto;
	padding:30px;
	background-color:#ffffff;
	border-radius:16px;
}
body#classroom > div#transferhost > h2{
	font-size:20px;
	font-weight:bold;
	line-height:1.75em;
	padding:4px 12px;
	color:#ffffff;
	background-color:#005cca;
	border-radius:8px;
	margin-bottom:20px;
}
body#classroom > div#transferhost > p{
	font-size:16px;
	font-weight:bold;
	color:#4e4e4e;
	line-height:1.75em;
	margin-bottom:20px;
}
body#classroom > div#transferhost > p:last-child{
	margin-bottom:0;
}
body#classroom > div#transferhost > p > a{
	font-weight:bold;
}

div.transferhost02{
	width:800px;
	margin:20px auto 40px auto;
	padding:10px 20px 10px 40px;
	background-color:#ffffff;
	border-radius:12px;
	border:solid 5px #005cca;
	text-indent:-20px;
}
div.transferhost02 > p{
	font-size:18px;
	font-weight:bold;
	color:#4e4e4e;
	line-height:1.75em;
	color:#000000;
}
div.transferhost02 > p > a{
	font-weight:bold;
}