@charset "utf-8";

/* ======================================================================
 * ======================================================================
 *
 *
 * ベース
 *
 *
 * ======================================================================
 * ====================================================================== */

body {
	color:						#444;
	font-family:				"メイリオ", Meiryo, "游ゴシック", YuGothic, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic ProN", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	background:					#FFDB66 url(../img/bg_dot.png) repeat 0 0;
	line-height:				175%;
	letter-spacing:				0.05em;
}


a {
	color:						#00CC00;
	text-decoration:			none;
}

a:hover {
	color:						#FF9900;
	text-decoration:			underline;
}

a:hover img {
	-ms-filter:					"alpha( opacity=75 )";
	filter:						alpha( opacity=75 );
	opacity:					0.75;
}

#transferhost a *,
.article a * {
	box-sizing:				border-box;
}

#transferhost a[href^="mailto:"]:after,
.article a[href^="mailto:"]:after {
	content: '\f0e0';
	display: inline-block;
	font: normal normal normal 14px/1 ForkAwesome;
	text-rendering: auto;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	margin-right: 0.5em;
	margin-left: 0.25em;
}




sup,
sub {
	line-height:				100%;
}


.clearfix:after,
div#header_wrap div#header_area > ul:after,
body#classroom div#keyVisual_wrap div#keyVisual_area ul.nav:after,
div.article div.section#experience_wrap div#experience_area:after,
div.article div.section#workshop_step > ul li:after,
div.article div.section#report div#report_area > ul:after,
div.article div.section#report div#report_area > ul > li:first-child > ul:after,
div.article div.section.next_workshop ul:after,
div.article div.section.next_workshop div.information_area > div:after,
div.article div.section#pyonkee > div:after,
div.article div.section#pyonkee > div > div > dl:after,
div#footer_wrap div#footer:after,
div.article div.section#message_wrap > div:after,
div.article div.section#facilitator_wrap div#facilitator div.block_facilitator:after {
	content: "."; 
	display: block;
	clear: both;
	height: 0;
	visibility: hidden;
	font-size:0;
}

.clearfix,
div#header_wrap div#header_area > ul,
body#classroom div#keyVisual_wrap div#keyVisual_area ul.nav,
div.article div.section#experience_wrap div#experience_area,
div.article div.section#workshop_step > ul li,
div.article div.section#report div#report_area > ul,
div.article div.section#report div#report_area > ul > li:first-child > ul,
div.article div.section.next_workshop ul,
div.article div.section.next_workshop div.information_area > div dl,
div.article div.section#pyonkee > div,
div.article div.section#pyonkee > div > div > dl,
div#footer_wrap div#footer,
div.article div.section#message_wrap > div,
div.article div.section#facilitator_wrap div#facilitator div.block_facilitator {
	min-height: 1px;
}

* html .clearfix,
* html div#header_wrap div#header_area > ul,
* html body#classroom div#keyVisual_wrap div#keyVisual_area ul.nav,
* html div.article div.section#experience_wrap div#experience_area,
* html div.article div.section#workshop_step > ul li,
* html div.article div.section#report div#report_area > ul,
* html div.article div.section#report div#report_area > ul > li:first-child > ul,
* html div.article div.section.next_workshop ul,
* html div.article div.section.next_workshop div.information_area > div dl,
* html div.article div.section#pyonkee > div,
* html div.article div.section#pyonkee > div > div > dl,
* html div#footer_wrap div#footer,
* html div.article div.section#message_wrap > div,
* html div.article div.section#facilitator_wrap div#facilitator div.block_facilitator {
	height: 1px;
	/*¥*//*/
	height: auto;
	overflow: hidden;
	/**/
}

.clear{
	clear:both;
}


div#header_wrap,
div#keyVisual_wrap,
body#classroom div#introduction_wrap,
div#footer_wrap {
	width:						100%;
}


div#header_wrap div#header_area {
	width:						980px;
	margin:						0 auto;
}


div#header_wrap div#header_area > p a,
div#header_wrap div#header_area > ul li a,
div#header_wrap div#header_area > ul li a:before,
body#classroom div#introduction_wrap > div,
div.article div.section#experience_wrap > h3,
div.article div.section#experience_wrap > h3:after,
div.article div.section#experience_wrap div#experience_area > div > h4:before,
div.article h2,
div.article div.section#report h3,
div.article div.section#report div#report_area h4,
div.article div.section#report div#report_area:after,
div.article div.section#report div#report_area > ul li > dl > dt,
div.article div.section#blue_polo_shirt_wrap,
div.article div.section#btn_go_next_page a,
div.article div.section#btn_go_next_page a:before,
div.article div.section.next_workshop > h3,
div.article div.section.next_workshop > h3:before,
div.article div.section.next_workshop div.information_area > h4:before,
div.article div.section.next_workshop div.information_area > div dl > dd a:before,
div.article div.section#pyonkee h4:before,
div.article div.section#pyonkee > div > div > dl dd a:before,
div#pagetop,
div#footer_wrap div#footer > a,
div.article div.section#message_wrap > h3,
div.article div.section#message_wrap > div:before,
div.article div.section#facilitator_wrap div#facilitator h3:before,
div.article div.section#report div#report_area ul li dl + a:before,
div.article div.section.next_workshop div.information_area > div dl > dd a.pdf:before,
div.article div.section#report div#report_area ul li dl + a.pdf:before {
	background:					url(../img/sprite.png) no-repeat 0 0;
}





/* ======================================================================
 * ======================================================================
 *
 *
 * ヘッダ
 *
 *
 * ======================================================================
 * ====================================================================== */

div#header_wrap {
	height:						135px;
	background:					url(../img/bg_line_header.png) repeat-x 0 0;
	background-color:rgba(0,255,0,0.5);
}

div#header_wrap div#header_area {
	position:					relative;
	height:135px;
}


/* サイトタイトル ------------------------------------------------------ */
div#header_wrap div#header_area > p,
div#header_wrap div#header_area > p a {
	width:						462px;
	height:						112px;
}

div#header_wrap div#header_area > p {
	z-index:					100;
	position:					absolute;
	top:						0;
	left:						-9px;
}

div#header_wrap div#header_area > p a {
	display:					block;
	background-position:		0 -976px;
}

div#header_wrap div#header_area > p a:hover {
	background-position:		-462px -976px;
}


/* グローバルナビゲーション -------------------------------------------- */
div#header_wrap div#header_area > ul {
	z-index:					200;
	position:					absolute;
/*	top:						62px;*/
	top:						52px;
	left:						194px;
}

div#header_wrap div#header_area > ul li {
	float:						left;
	width:						255px;
	height:						50px;
	margin-left:				10px;
	line-height:				100%;
/*	background-color:#ffff00;*/
	border-radius:8px;
}

div#header_wrap div#header_area > ul li:first-child {
	margin-left:				0;
}

div#header_wrap div#header_area > ul li a {
	font-family:			"Meiryo UI";
	display:					block;
	width:						165px;
	height:						50px;
	padding:					10px 0 0 90px;
	font-size:					16px;
	font-weight:				bold;
	position:					relative;
/*	background-color:#6600ff;*/
}
div#header_wrap div#header_area > ul li a span{
	display:					block;
	font-size:					12px;
	font-weight:				bold;
}

div#header_wrap div#header_area > ul li a:before{
	position:					absolute;
	content:					"";
	width:						18px;
	height:						18px;
	background-position:		-960px -250px	!important;
	top:						16px;
	left:						60px;
}
div#header_wrap div#header_area > ul li:first-child a:before{
	left:						85px;
}
div#header_wrap div#header_area > ul li a:hover:before{
	background-position:		-960px	-500px	!important;
}



div#header_wrap div#header_area > ul li#nav_classroom a							{	background-position:		0	-1348px;	width:	145px;	padding-left:	110px;}
div#header_wrap div#header_area > ul li#nav_classroom a:hover,
body#classroom div#header_wrap div#header_area > ul li#nav_classroom a			{	background-position:		0	-1408px;}


div#header_wrap div#header_area > ul li#nav_workshop01 a							{	background-position:	-255px	-1348px;	width:	185px;	padding-left:	70px;}
div#header_wrap div#header_area > ul li#nav_workshop01 a:before					{	left:					44px;}
div#header_wrap div#header_area > ul li#nav_workshop01 a:hover,
body#workshop01 div#header_wrap div#header_area > ul li#nav_workshop01 a			{	background-position:	-255px	-1408px;}


div#header_wrap div#header_area > ul li#nav_workshop02 a						{	background-position:	-510px	-1348px;	height:						56px;	padding:					4px 0 0 85px; width:260px;
}
div#header_wrap div#header_area > ul li#nav_workshop02 a:hover,
body#workshop02 div#header_wrap div#header_area > ul li#nav_workshop02 a	{	background-position:	-510px	-1408px;}


body#classroom div#header_wrap div#header_area > ul li#nav_classroom a,
body#workshop01 div#header_wrap div#header_area > ul li#nav_workshop01 a,
body#workshop02 div#header_wrap div#header_area > ul li#nav_workshop02 a,
body#classroom div#header_wrap div#header_area > ul li#nav_classroom a:hover,
body#workshop01 div#header_wrap div#header_area > ul li#nav_workshop01 a:hover,
body#workshop02 div#header_wrap div#header_area > ul li#nav_workshop02 a:hover {	color:	#FF9900;		text-decoration:	none;}

body#classroom div#header_wrap div#header_area > ul li#nav_classroom a:before,
body#workshop01 div#header_wrap div#header_area > ul li#nav_workshop01 a:before,
body#workshop02 div#header_wrap div#header_area > ul li#nav_workshop02 a:before {	background-position:		-960px -500px	!important;}


/* ======================================================================
 *
 * TOP用　ヘッダ
 *
 * ====================================================================== */

body#classroom div#header_wrap {
	height:						37px;
	background:					url(../img/bg_line_header_top.png) repeat-x 0 0;
}



body#classroom div#keyVisual_wrap div#keyVisual_area ul.nav li a:hover:before {
	background-position:		-960px -500px;
}

body#classroom div#keyVisual_wrap div#keyVisual_area ul.nav li#nav_classroom a:before,
body#classroom div#keyVisual_wrap div#keyVisual_area ul.nav li#nav_classroom a:hover:before {
	background-position:		-960px -750px;
}

body#classroom div#keyVisual_wrap div#keyVisual_area ul.nav li#nav_classroom a:before		{	left:	130px;}
body#classroom div#keyVisual_wrap div#keyVisual_area ul.nav li#nav_workshop01 a:before		{	left:	69px;}
body#classroom div#keyVisual_wrap div#keyVisual_area ul.nav li#nav_workshop02 a:before	{	left:	131px;}





/* ======================================================================
 * ======================================================================
 *
 *
 * キービジュアル
 *
 *
 * ======================================================================
 * ====================================================================== */

body#classroom div#keyVisual_wrap {
	background-color:			#FFDB66;
	width:						100%;
}

body#classroom div#keyVisual_wrap div#keyVisual_area {
	width:980px;
	margin:						0 auto;
	padding-bottom:				50px;
}


/* ======================================================================
 * ======================================================================
 *
 *
 * イントロ
 *
 *
 * ======================================================================
 * ====================================================================== */

body#classroom div#introduction_wrap {
	background:					url(../img/classroom/bg_introduction.png) repeat 0 0;
	padding:					39px 0;
}

body#classroom div#introduction_wrap > div {
	width:						980px;
	height:						168px;
	margin:						0 auto;
}

body#classroom div#introduction_wrap > div > p {
	padding:					28px 28px 28px 285px;
	font-size:					18px;
	font-weight:				bold;
	line-height:				165%;
}



/* ======================================================================
 * ======================================================================
 *
 *
 * コンテンツ
 *
 *
 * ======================================================================
 * ====================================================================== */

div.article {
/*	width:						980px;*/
	width:						880px;
	background:					url(../img/bg_page.png) repeat 0 bottom;
	margin:						50px auto 0;
	padding:					20px 40px 50px 60px;
}



/* ======================================================================
 *
 * h2タイトル
 *
 * ====================================================================== */

div.article h2 {
	height:						94px;
	color:						#005CCA;
	font-size:					32px;
	font-weight:				bold;
	letter-spacing:				0.1em;
	padding:					50px 0 0 142px;
}

body#classroom div.article h2 {
	height:						42px;
	padding-left:				180px;
	background-position:		0 -169px;
}

body#workshop01 div.article h2 {
	height:						42px;
	padding-left:				142px;
	background-position:		0 -270px;
}

body#workshop02 div.article h2 {
	height:						50px;
	padding-left:				142px;
	background-position:		0 -372px;
}


/* ======================================================================
 *
 * 〔TOP〕
 * タブレットでプログラミングを体験
 *
 * ====================================================================== */

div.article div.section#experience_wrap {
	margin-top:					53px;
}

div.article div.section#experience_wrap > h3,
div.article div.section#message_wrap > h3 {
/*
	width:						880px;
	height:						66px;
*/
	width:						801px;
	height:						45px;
	background-position:		0 -472px;
	color:						#005CCA;
	font-size:					24px;
	font-weight:				bold;
	padding:					21px 0 0 79px;
	position:					relative;
}

/*
div.article div.section#experience_wrap > h3:after {
	position:					absolute;
	content:					"無料";
	color:						#FFF;
	font-size:					20px;
	font-weight:				bold;
	line-height:				100%;
	width:						53px;
	height:						38px;
	padding:					14px 0 0 14px;
	top:						-32px;
	left:						380px;
	background-position:		-300px -1100px;
}
*/

div.article div.section#experience_wrap div#experience_area {
	margin-top:					23px;
}

div.article div.section#experience_wrap div#experience_area > div {
	float:						left;
	width:						613px;
}

div.article div.section#experience_wrap div#experience_area > div:first-child {
	width:						229px;
	margin-top:					23px;
	margin-right:				38px;
}

div.article div.section#experience_wrap div#experience_area > div > h4 {
	width:						543px	!important;
	padding-left:				70px	!important;
	background-position:		-930px -1850px;
}

div.article div.section#experience_wrap div#experience_area > div > p {
	margin-top:					28px;
	letter-spacing:				0.04em;
}

div.article > p.addition {
	font-size:					12px;
	color:						#666;
	margin-top:					20px;
	margin-left:				12px;
	text-indent:				-12px;
	line-height:				150%;
}



/* ======================================================================
 *
 * 〔TOP〕
 * 応援団メッセージ
 *
 * ====================================================================== */

div.article div.section#message_wrap {
	margin-top:					60px;
}

div.article div.section#message_wrap > h3 {
/*	height:						64px;*/
	height:						49px;
	background-position:		0 -1800px;
	padding-top:				15px;
}

div.article div.section#message_wrap > div {
	width:						820px;
	position:					relative;
	background:					url(../img/classroom/img_message_bg.png) no-repeat 0 bottom;
	margin-top:					40px;
	padding:					30px;
}

div.article div.section#message_wrap > h3 + div {
	margin-top:					30px;
}

div.article div.section#message_wrap > div:before {
	position:					absolute;
	content:					"";
	width:						875px;
	height:						30px;
	background-position:		0 -1900px;
	top:						0;
	left:						0;
}

div.article div.section#message_wrap > div.photo_right:before {
	background-position:		0 -1950px;
}

div.article div.section#message_wrap > div > div {
	float:						right;
	width:						648px;
}

div.article div.section#message_wrap > div.photo_right > div {
	float:						left;
}

div.article div.section#message_wrap > div > div.photo {
	position:					absolute;
	width:						172px;
	height:						206px;
	z-index:					100;
	top:						30px;
	left:						30px;
	background:					none;
	float:						none;
}

div.article div.section#message_wrap > div.photo_right > div.photo {
	left:						inherit;
	right:						30px;
}

div.article div.section#message_wrap > div > div > h4 {
	margin-bottom:				15px;
	padding-bottom:				10px;
	padding-left:				20px;
	border-bottom:				solid 2px #005CCA;
	font-size:					1.25em;
	font-weight:				bold;
	color:						#005CCA;
}

div.article div.section#message_wrap > div > div > h4 >span {
	font-size:					0.65em;
	font-weight:				normal;
}

div.article div.section#message_wrap > div > div > p {
	padding-left:				20px;
	margin-top:					0.88em;
}

div.article div.section#message_wrap > div > div > h4 + p {
	margin-top:					0;
}

div.article div.section#message_wrap > div.photo_right > div > h4,
div.article div.section#message_wrap > div.photo_right > div > p {
	padding-left:				0;
}

div.article div.section#message_wrap > div.photo_right > div > p {
	width:						628px;
}

/* ======================================================================
 *
 * 〔TOP〕
 * 青いポロシャツを着たスタッフ
 *
 * ====================================================================== */

div.article div.section#blue_polo_shirt_wrap {
	width:						880px;
	height:						179px;
	margin-top:					50px;
	background-position:		0 -797px;
}

div.article div.section#blue_polo_shirt_wrap > p {
	color:						#0099FF;
	font-size:					24px;
	font-weight:				bold;
	line-height:				150%;
	padding:					57px 0 0 332px;
}


/* ======================================================================
 *
 * 〔ワークショップ紹介〕
 * ワークショップの流れ
 *
 * ====================================================================== */

div.article div.section#workshop_step {
	margin-top:					22px;
}

div.article div.section#workshop_step > ul {
	margin-top:					-46px;
	background:					url(../img/workshop/bg_workshop_footprint.png) no-repeat 74px 46px;
	z-index:					10;
}

div.article div.section#workshop_step > ul li {
	position:					relative;
}

div.article div.section#workshop_step > ul li > img {
	display:					block;
	position:					absolute;
	z-index:					10;
	top:						0;
	left:						0;
}

div.article div.section#workshop_step > ul li > div.explanation {
	position:					absolute;
	z-index:					5;
}

div.article div.section#workshop_step > ul li > div.explanation h4 {
	font-size:					21px;
	font-weight:				bold;
	color:						#0075C2;
	border-bottom:				solid 2px #0075C2;
	padding-bottom:				9px;
}

div.article div.section#workshop_step > ul li > div.explanation > div {
	position:					relative;
}

div.article div.section#workshop_step > ul li > div.explanation > div > p > a,
div.article div.section#report div#report_area ul li > dl > dd > p > a {
	text-decoration:			underline;
	font-weight:				bold;
}

div.article div.section#workshop_step > ul li > div.explanation > div > p > a > sup,
div.article div.section#report div#report_area ul li > dl > dd > p > a > sup {
	text-decoration:			none;
	display:					inline-block;
}


/* ステップ1 -------------------------------------------- */

div.article div.section#workshop_step > ul li.step_1 {
	height:						306px;
}

div.article div.section#workshop_step > ul li.step_1 > img {
	width:						399px;
	height:						306px;
	left:						0;
}

div.article div.section#workshop_step > ul li.step_1 > div.explanation {
	width:						530px;
	top:						25px;
	left:						348px;
}

div.article div.section#workshop_step > ul li.step_1 > div.explanation h4 {
	padding-left:				62px;
}

div.article div.section#workshop_step > ul li.step_1 > div.explanation> div {
	margin-top:					25px;
	margin-left:				62px;
}

div.article div.section#workshop_step > ul li.step_1 > div.explanation > div >div.logo_pyonkee,
div.article div.section#workshop_step > ul li.step_1 > div.explanation > div >div.logo_pyonkee + p {
	position:					absolute;
}

div.article div.section#workshop_step > ul li.step_1 > div.explanation > div >div.logo_pyonkee {
	top:						60px;
	right:						0;
}

div.article div.section#workshop_step > ul li.step_1 > div.explanation > div >div.logo_pyonkee + p {
	right:						137px;
/*	bottom:						-5.25em;*/
	bottom:						-63px;
	text-align:					right;
	font-size:					12px;
	line-height:				150%;
	color:						#666;
}

div.article div.section#workshop_step > ul li.step_1 > div.explanation > div >div.logo_pyonkee + p a,
div.article div.section#workshop_step > ul li.step_1 > div.explanation > div >div.logo_pyonkee + p a:hover {
	color:						#666;
}

div.article div.section#workshop_step > ul li.step_1 > div.explanation > div >div.logo_pyonkee + p a {
	text-decoration:			none;
	font-size:					12px;
	font-weight:				normal;
}

div.article div.section#workshop_step > ul li.step_1 > div.explanation > div >div.logo_pyonkee + p a:hover {
	text-decoration:			underline;
}


/* ステップ2 -------------------------------------------- */

div.article div.section#workshop_step > ul li.step_2 {
	height:						252px;
	margin-top:					56px;
}

div.article div.section#workshop_step > ul li.step_2 > img {
	width:						411px;
	height:						252px;
	left:						50px;
}

div.article div.section#workshop_step > ul li.step_2 > div.explanation {
	width:						438px;
	top:						42px;
	left:						416px;
}

div.article div.section#workshop_step > ul li.step_2 > div.explanation h4 {
	padding-left:				62px;
}

div.article div.section#workshop_step > ul li.step_2 > div.explanation> div {
	margin-top:					25px;
	margin-left:				62px;
}


/* ステップ3 -------------------------------------------- */

div.article div.section#workshop_step > ul li.step_3 {
	height:						264px;
	margin-top:					25px;
}

div.article div.section#workshop_step > ul li.step_3 > img {
	width:						411px;
	height:						264px;
	left:						0;
}

div.article div.section#workshop_step > ul li.step_3 > div.explanation {
	width:						532px;
	top:						23px;
	left:						348px;
}

div.article div.section#workshop_step > ul li.step_3 > div.explanation h4 {
	padding-left:				62px;
}

div.article div.section#workshop_step > ul li.step_3 > div.explanation> div {
	margin-top:					25px;
	margin-left:				62px;
}


/* ステップ4 -------------------------------------------- */

div.article div.section#workshop_step > ul li.step_4 {
	height:						251px;
	margin-top:					27px;
}

div.article div.section#workshop_step > ul li.step_4 > img {
	width:						413px;
	height:						251px;
	left:						50px;
}

div.article div.section#workshop_step > ul li.step_4 > div.explanation {
	width:						482px;
	top:						42px;
	left:						398px;
}

div.article div.section#workshop_step > ul li.step_4 > div.explanation h4 {
	padding-left:				82px;
}

div.article div.section#workshop_step > ul li.step_4 > div.explanation> div {
	margin-top:					25px;
	margin-left:				82px;
}


/* ゴール -------------------------------------------- */

div.article div.section#workshop_step > ul + p {
	margin-top:					-50px;
}



/* ======================================================================
 *
 * 〔ワークショップ紹介〕
 * みんなの作品紹介
 *
 * ====================================================================== */

div.article div.section#work_exhibition {
	margin-top:					60px;
}



/* ======================================================================
 *
 * 〔ワークショップ紹介〕
 * ワークショップれぽーと
 *
 * ====================================================================== */

div.article div.section#report {
	margin-top:					28px;
}

body#workshop01 > div.article div.section#report h3 {
	background-position:		0 -710px;
}

div.article div.section#report div#report_area {
	background:					url(../img/workshop/bg_workshop_report_frame.png) repeat-y 0 0;
	padding:					15px 45px 45px;
	position:					relative;
}

div.article div.section#report div#report_area:after {
	position:					absolute;
	content:					"";
	width:						878px;
	height:						5px;
	left:						0;
	bottom:						0;
	background-position:		0 -792px;
}

div.article div.section#report div#report_area h4 {
	color:						#FFF;
	font-size:					28px;
	font-weight:				bold;
	background-position:		0 -594px;
/*
	width:						788px;
	height:						116px;
*/
	width:						663px;
	height:						67px;
	padding:					49px 0 0 125px;
}


/* 日程ごとのレポート -------------------------------------------- */
div.article div.section#report div#report_area > ul {
	margin-top:					40px;
	padding-top:				50px;
	position:					relative;
}

div.article div.section#report div#report_area > h4 + ul {
	margin-top:					25px;
	padding-top:				0;
}

div.article div.section#report div#report_area > ul:before {
	position:					absolute;
	content:					"";
	width:						790px;
	height:						2px;
	background:					url(../img/workshop/hr_workshop_report.gif) repeat-x 0 0;
	top:						0;
	left:						0;
}

div.article div.section#report div#report_area > h4 + ul:before {
	display:					none;
}

div.article div.section#report div#report_area > ul > li {
	float:						left;
	width:						393px;
}

div.article div.section#report div#report_area ul li dl + a {
	font-weight:				bold;
}


/* 写真エリア */
div.article div.section#report div#report_area > ul > li:first-child {
	width:						366px;
	margin-right:				29px;
}

div.article div.section#report div#report_area > ul > li:first-child > ul {
	margin-top:					30px;
}

div.article div.section#report div#report_area > ul > li:first-child > ul li {
	float:						left;
	width:						116px;
	height:						90px;
	margin-left:				9px;
}

div.article div.section#report div#report_area > ul > li:first-child > ul li:first-child {
	margin-left:				0;
}


/* 見出し・テキストエリア */
div.article div.section#report div#report_area > ul li > dl > dt {
	color:						#FFF154;
	font-weight:				bold;
	background-color:			#33CCFF;
	background-position:		-940px -1500px;
/*
	width:						393px;
	height:						36px;
*/
	width:						337px;
	height:						30px;
	padding:					6px 0 0 56px;
	letter-spacing:				0.1em;
}

div.article div.section#report div#report_area > ul li > dl > dd > p,
div.article div.section#report div#report_area ul li dl + a {
	margin-top:					20px;
}



/* ======================================================================
 *
 * 〔開催案内〕
 * 次回のワークショップ情報
 *
 * ====================================================================== */

div.article div.section.next_workshop {
	margin-top:					30px;
}

/* 見出し・テキストエリア */
div.article div.section.next_workshop h3 {
	color:						#005CCA;
	font-size:					24px;
	font-weight:				bold;
	background-position:		0 -2396px;
/*
	width:						470px;
	height:						56px;
*/
	width:						789px;
	height:						38px;
	padding:					18px 0 0 91px;
	position:					relative;
}

div.article div.section.next_workshop h3:before {
	position:					absolute;
	content:					"";
	width:						54px;
	height:						56px;
	background-position:		-926px -2200px;
	top:						1px;
	left:						18px;
}

div.article div.section.next_workshop div.information_area {
	width:						820px;
	margin:						20px 30px 0;
}

div.article div.section.next_workshop div.information_area > h4,
div.article div.section#pyonkee h4,
div.article div.section#experience_wrap div#experience_area > div > h4,
div.article div.section#facilitator_wrap div#facilitator h4 {
	color:						#005CCA;
	font-weight:				bold;
	border-bottom:				solid 2px #005CCA;
	padding:					9px 0 2px 60px;
	position:					relative;
}

div.article div.section#pyonkee h4 {
	padding-left:				70px;
}

div.article div.section.next_workshop div.information_area > h4:before,
div.article div.section#pyonkee h4:before,
div.article div.section#experience_wrap div#experience_area > div > h4:before {
	position:					absolute;
	content:					"";
	width:						35px;
	height:						39px;
	background-position:		-940px -1700px;
	top:						7px;
	left:						11px;
}

div.article div.section.next_workshop div.information_area > h5 {
	margin-top:					30px;
	font-weight:				bold;
}

div.article div.section.next_workshop div.information_area > div {
}

div.article div.section.next_workshop div.information_area > div dl {
	width:						395px;
	float:						left;
}

div.article div.section.next_workshop div.information_area > div dl:first-child {
	margin-right:				30px;
}

div.article div.section.next_workshop div.information_area > div dl dt,
div.article div.section.next_workshop div.information_area > div dl dd {
	float:						left;
	margin-top:					35px;
	display:					block;
	padding-bottom:				1px;
}

div.article div.section.next_workshop div.information_area > div dl dt {
	width:						68px;
/*	height:						24px;*/
	margin-right:				15px;
	text-align:					center;
	color:						#FFF154;
	font-weight:				bold;
	background-color:			#33CCFF;
	line-height:				1.35em;
	padding-top:				0.3em;
	padding-bottom:				0.125em;
}

div.article div.section.next_workshop div.information_area > div dl dd {
	width:						312px;
}

div.article div.section.next_workshop div.information_area > div dl > dd > p {
	margin-top:					20px;
}

div.article div.section.next_workshop div.information_area > div dl > dd > p.attention {
	margin-top:					0;
	text-align:					left;
	padding-left:				1.9em;
	text-indent:				-0.9em;
	line-height:				150%;
}

div.article div.section.next_workshop div.information_area > div dl > dd a,
div.article div.section#report div#report_area ul li dl + a {
	display:					block;
	word-wrap:					break-word;
	position:					relative;
	padding-left:				21px;
}

div.article div.section.next_workshop div.information_area > div dl > dd a:before,
div.article div.section#report div#report_area ul li dl + a:before {
	position:					absolute;
	content:					"";
	background-position:		-960px -250px;
	width:						18px;
	height:						18px;
	display:					inline-block;
	top:						4px;
	left:						0;
}

div.article div.section.next_workshop div.information_area > div dl > dd a:hover:before {
	background-position:		-960px -500px;
}

div.article div.section.next_workshop div.information_area > div dl > dd a[target="_blank"]:before,
div.article div.section#report div#report_area ul li dl + a[target="_blank"]:before {
	background-position:		-960px -1000px;
	top:						7px;
}

div.article div.section.next_workshop div.information_area > div dl > dd a[target="_blank"]:hover:before,
div.article div.section#report div#report_area ul li dl + a[target="_blank"]:hover:before {
	background-position:		-960px -1250px;
}

div.article div.section.next_workshop div.information_area > div dl > dd a.pdf:before,
div.article div.section#report div#report_area ul li dl + a.pdf:before,
div.article div.section.next_workshop div.information_area > div dl > dd a.pdf:hover:before,
div.article div.section#report div#report_area ul li dl + a.pdf:hover:before {
	background-position:		-964px -2899px;
}

div.article div.section.next_workshop div.information_area > div dl > dd a.pdf[target="_blank"]:before,
div.article div.section#report div#report_area ul li dl + a.pdf[target="_blank"]:before,
div.article div.section.next_workshop div.information_area > div dl > dd a.pdf[target="_blank"]:hover:before,
div.article div.section#report div#report_area ul li dl + a.pdf[target="_blank"]:hover:before {
	background-position:		-964px -1400 px;
	top:						5px;
	
}


div.article div.section.next_workshop div.information_area div.information_area .closed {
	margin-top:					30px;
}

div.article div.section.next_workshop div.information_area .closed li,
div.article div.section.next_workshop div.information_area .closed li {
	margin-top:					0.75em;
}

div.article div.section.next_workshop div.information_area .closed li:first-child,
div.article div.section.next_workshop div.information_area .closed li:first-child {
	margin-top:					0;
}


div.article div.section.next_workshop div.information_area .closed li.attention:before {
	content:					"※";
	padding-right:				0.25em;
}

div.article div.section.next_workshop div.information_area .closed li.attention {
	padding-left:				1.25em;
	text-indent:				-1.25em;
}

div.article div.section p.attention {
	font-size:					14px;
	color:						#666;
	margin-top:					5px;
	text-align:					center;
}

div.article div.section p.attention:before {
	content:					"※";
	display:					inline-block;
	padding-right:				10px;
}



/* ======================================================================
 *
 * 未来のCTCのファシリテーター紹介
 *
 * ====================================================================== */

div.article div.section#facilitator_wrap {
	width:						874px;
	padding:					3px;
	background:					url(../img/bg_plaid_pattern.png) repeat 0 0;
	margin-top:					50px;
}

div.article div.section#facilitator_wrap div#facilitator {
/*	width:						874px;*/
	width:						784px;
	padding:					45px;
	background-color:			#EEFCFC;
}

div.article div.section#facilitator_wrap div#facilitator h3 {
	color:						#00AAFF;
	font-size:					1.5em;
	font-weight:				bold;
	position:					relative;
	padding-left:				80px;
}

div.article div.section#facilitator_wrap div#facilitator h3:before {
	content:					"";
	display:					inline-block;
	width:						69px;
	height:						34px;
	background-position:		-911px -2000px;
	position:					absolute;
	top:						-5px;
	left:						0;
}

div.article div.section#facilitator_wrap div#facilitator h4 {
	padding:					9px 0 2px 0;
	font-size:					1.13em;
	margin-top:					20px;
	margin-bottom:				20px;
}

div.article div.section#facilitator_wrap div#facilitator div.block_facilitator {
	width:						784px;
	margin-top:					30px;
}

div.article div.section#facilitator_wrap div#facilitator div.block_facilitator > div.area_photo {
	width:						405px;
	float:						right;
	margin-top:					6px;
	margin-left:				30px;
}

div.article div.section#facilitator_wrap div#facilitator div.block_facilitator > div.area_photo img {
	padding-left:				18px;
	padding-bottom:18px;
}

div.article div.section#facilitator_wrap div#facilitator div.block_facilitator > div.area_photo img:nth-child(odd){
	padding-left:				0;
}


/* ======================================================================
 *
 * 〔開催案内〕
 * 保護者の方へ
 *
 * ====================================================================== */

div.article div.section#pyonkee {
	margin-top:					60px;
}

div.article div.section#pyonkee h4:before,
div.article div.section#experience_wrap div#experience_area > div > h4:before {
	width:						46px;
	height:						33px;
	background-position:		-930px -1850px;
}

div.article div.section#pyonkee > div {
	margin-top:					30px;
}

div.article div.section#pyonkee > div > div {
	float:						left;
	width:						609px;
}


/* ロゴエリア */
div.article div.section#pyonkee > div > div:first-child {
	width:						241px;
	margin-right:				30px;
}

div.article div.section#pyonkee > div > div:first-child > p {
	font-size:					12px;
	line-height:				150%;
	text-align:					center;
	margin-top:					9px;
}

div.article div.section#pyonkee > div > div:first-child > p a,
div.article div.section#pyonkee > div > div:first-child > p a:hover {
	font-size:					12px;
	color:						#666;
}


/* テキストエリア */
div.article div.section#pyonkee > div > div > p,
div.article div.section#pyonkee > div > div > dl {
	margin-top:					24px;
}

div.article div.section#pyonkee > div > div > p:first-child {
	margin-top:					0;
}

div.article div.section#pyonkee > div > div > p.addition {
	margin-left:				16px;
	text-indent:				-16px;
}

div.article div.section#pyonkee > div > div > dl {
}

div.article div.section#pyonkee > div > div > dl dt,
div.article div.section#pyonkee > div > div > dl dd {
	float:						left;
}

div.article div.section#pyonkee > div > div > dl dt {
	width:						150px;
}

div.article div.section#pyonkee > div > div > dl dd {
	width:						459px;
}
div.article div.section#pyonkee > div > div > dl dd a {
	position:					relative;
	padding-left:				20px;
}

div.article div.section#pyonkee > div > div > dl dd a:before {
	position:					absolute;
	content:					"";
	width:						13px;
	height:						14px;
	background-position:		-960px -1000px;
	top:						5px;
	left:						0;
}

div.article div.section#pyonkee > div > div > dl dd a:hover:before {
	background-position:		-960px -1250px;
}



/* ======================================================================
 *
 * 20210521追加
 *
 * ====================================================================== */

/* 中黒リスト */
ul.pointlist{
	margin: 0 0 0 1.45em;
	list-style:disc;
}

/* 特殊見出し */
.ex_headline{
	margin:1em 0 0.5em 0;
	font-size:1em;
	font-weight:bold;
}
.mt2em{
	margin-top:2em;
}

/* ※つき注釈 */
.txt_star_caption{
	display: flex;
	margin:1em 0;
	font-size:14px;
	line-height:1.75;
}
.txt_star_caption:before{
	content: "※";
	padding-right:0.5em;
}

/* 3分割 */
.splitarea3{
	display: flex;
	margin:1em 0;
	justify-content: space-between;
}
.splitarea3 > div{
	width:31%;
	box-sizing: border-box;
}
.splitarea3 > div img{
	width:100%;
}



/* ======================================================================
 * ======================================================================
 *
 *
 * ページの先頭へ戻る
 *
 *
 * ======================================================================
 * ====================================================================== */

div#pagetop {
	right:						-100px;
	display:					none;
	width:						81px;
/*	height:						81px;*/
	height:						36px;
	background-position:		-90px -1100px;
	z-index:					1000;
	color:						#FFF;
	font-size:					12px;
	line-height:				125%;
	text-align:					center;
	padding-top:				44px;
}

#pagetop:hover {
	cursor:						pointer;
	background-position:		-180px -1100px;
}



/* ======================================================================
 * ======================================================================
 *
 *
 * フッタ
 *
 *
 * ======================================================================
 * ====================================================================== */

div#footer_wrap {
	background-color:			#005CCA;
	border-top:					solid 5px #00CC00;
	margin-top:					60px;
}

div#footer_wrap div#footer {
	width:						980px;
	margin:						0 auto;
	padding:					20px 0 18px;
}

div#footer_wrap div#footer > a {
	display:					block;
	width:						101px;
	height:						37px;
	float:						left;
	background-position:		-300px -1163px;
	margin-top:					5px;
	margin-right:				20px;
}

div#footer_wrap div#footer > a:hover {
	background-position:		-410px -1163px;
}

div#footer_wrap div#footer > p {
	float:						left;
	font-size:					12px;
	line-height:				24px;
	color:						#FFF;
}