@import "reset.css";

@charset "UTF-8";
/* ////////////////////////// */

body,input,select,textarea { font-family:"メイリオ","ＭＳ Ｐゴシック",sans-serif; font-size:18px; }
input:focus, select:focus, textarea:focus { outline:none; }

body {
	-webkit-text-size-adjust:none;
	line-height:1.8;
	word-wrap:break-word;
	color:#131841;
	background-color:#FFF;
}
section { width:1080px; margin:0 auto; }

a:active, a:hover, a:link, a:visited {
	color:#0926ff;
	text-decoration:underline;
	outline-width:0;
	outline:none;
}
a:active, a:hover { color:#209eff; }
a:hover { opacity:.4; } /* SH */

span { font-weight:inherit; }

/* ////////////////////////// */

#header h1 a, .pagetop a, .visual p {
	line-height:0;
	text-indent:-9999px;
	font-size:0;
}
#header h1 a img,
.block .blockHead *, /* SH */
.contents .information h2,
.navTop h1, .visual dl {
	width:0; height:0;
	margin:0; padding:0;
	line-height:0;
	text-indent:-9999px;
	font-size:0;
	border:none;
}

/* SH */
.block        { padding:2em 0; opacity:0; }
.block.fadeIn { animation:image 400ms ease-out 200ms 1 both; }
.blockHead {
	width:100%; height:440px;
	background:no-repeat center top; border-radius:2em;
}

.accordion_btn a, .accordion_btn02 a,
.contents h2, .navTop ul li a {
	text-align:center;
	vertical-align:middle;
	display:flex;
	flex-direction:column;
	justify-content:center;
	align-items:center;
}

/* ////////////////////////// */


.alert p {
	padding:10px 0;
	min-width:100%;
	color:#FFF;
	font-size:20px;
	font-weight:600;
	text-align:center;
	background:#ff008a;
	position:fixed;
	z-index:99999;
}


.pagetop {
	transition:all 300ms ease-in-out;
	position:fixed;
	right:50px; bottom:50px;
	z-index:100;
	opacity:0;
	visibility:hidden;
}
.pagetop.show {
	opacity:1;
	visibility:visible;
}
.pagetop a {
	transition:all 300ms ease-in-out;
	margin:0 auto;
	width:80px; height:80px;
	background-color:#333848;
	background-image:url(../img/pagetop.png);
	background-repeat:no-repeat;
	background-position:center top;
	display:block;
	position:relative;
	box-sizing:border-box;
	border-radius:50%;
	cursor:pointer;
}
.pagetop a:hover { background-color:#CAEAFB; }


#container {
	margin:0 auto;
	min-width:1080px;
	overflow:hidden;
	position:relative;
}


.visual {
	padding:0;
	height:950px;
	background-color:#caeafb;
	position:relative;
	overflow:hidden;
	z-index:50;
}
.visual::before {
	content:"";
	margin-left:-1000px;
	width:2000px; height:800px;
	background-image:url(../img/header_pattern.png);
	background-repeat:repeat;
	background-position:center top;
	display:block;
	position:absolute;
	top:80px; left:50%;
	z-index:100;
	animation:bg 50s infinite linear;
}
.visual::after {
	content:"";
	width:100%; height:880px;
	background-image:url(../img/header_background2.png);
	background-repeat:no-repeat;
	background-position:center bottom;
	display:block;
	position:absolute;
	top:80px; left:0;
	z-index:150;
}
.visual p {
	width:100%; height:780px;
	background-image:url(../img/header_text.png);
	background-repeat:no-repeat;
	background-position:center top;
	display:block;
	position:absolute; top:80px; left:0;
	z-index:200;
	animation:catch 400ms ease-out 200ms 1 both;
}


/* btn */
.btn { width:100%; padding:0 0 5px; font-size:24px; }
.btn a {
	display:flex; justify-content:space-between; align-items:center;
	width:800px; margin:1em auto; padding:.5em .7em;
	font-weight:bold; text-align:center; text-decoration:none; line-height:1.2; color:#FFF;
	background:#2b2bbb; border-radius:40px; box-sizing:border-box;
}
.btn a:before,
.btn a:after  { content:""; display:inline-block; width:1.7em; height:1.7em; }
.btn a:before { background:url(../img/btn/blue.png); background-size:cover; }

#puyopuyo .btn a,
.btn.orange a { background:#ff9600; }
#puyopuyo .btn a:before,
.btn.orange a:before { background-image:url(../img/btn/yellow.png); }

#cg .btn a        { background:#ef0935; }
#cg .btn a:before { background-image:url(../img/btn/red_lite.png); }

/* SH / reportBox */
.reportBox.btn a { font-size:80%; }


/* ////////////////////////////////// */

main { overflow:hidden; }

.contents {
	width:100%;
	margin:0 auto;
}
.contentsInner {
	width:820px;
	margin:0 auto; padding:0 0 55px;
}
.headerSub {
	padding:0 0 60px;
	animation:fadeIn 800ms ease-out 400ms 1 both;
}
/* headerSubText */
.headerSubText {
	width:820px;
	margin:20px auto 60px;
	padding:20px;
	border:5px solid #ed1e79;
	border-radius:1em;
	background: #CEF center center;
}
main .headerSubText p {
	margin:0 1em;
	font-size:22px;
	font-weight:600;
	text-align:center;
	color:#2b2bbb;
}

/* newsinfo SH */
.newsinfo {
	box-sizing:border-box;
	margin:20px auto 60px; padding:20px;
	border:5px solid #ed1e79; border-radius:1em;
	background: #CEF center center;
}
.newsinfo .contentsInner { padding:0; }
main .newsinfo h2 { width:auto; padding:0; background:#ed1e79; line-height:1.3em; color:#FFF; }
.newsinfo .contentsInner > p { font-size:120%; font-weight:600; color:#2b2bbb; }
main .newsinfo .image > dt::before { top:18px; }


/* SH */
.endMessage { text-align:center; }

#archive {}
.headerSubMovie            { width:1080px; margin:0 auto; display:flex; justify-content:space-between; }
.headerSubMovie figure     { width:48%; margin:0 0 2em; }
.headerSubMovie iframe     { width:100%; height:300px; background:#ed1e79; border:4px solid #ed1e79; border-radius:20px; }
.headerSubMovie figcaption { font-size:24px; font-weight:bold; line-height:1.5em; color:#ed1e79; }

.headerSubMovie1            { justify-content:center; }
.headerSubMovie1 figcaption { text-align:center; }
/**/


.contents .enterprise {
	padding:0 0 50px;
	border-top:10px solid #dbe0ed;
}
.contents .enterprise h3 {
	color:#131841;
}
.contents .enterpriseList {
	width:840px;
	margin:0 auto; padding:10px 0;
	text-align:center;
	font-size:0;
}
.contents .enterpriseList li {
	margin:10px 20px;
	width:170px; height:68px;
	vertical-align:top;
	display:inline-block;
}
.contents .enterpriseList li a {
	width:100%; height:100%;
}
.contents .enterprise dl {
	margin:20px 0 0;
	text-align:center;
}
.contents .enterprise dl dt {
	margin:0 0 10px;
	font-size:18px;
	font-weight:600;
}
.contents .enterprise dl img {
	height:50px;
}
.contents .information {
	margin:20px auto; padding:20px;
	width:800px;
	color:#ed1e79;
	border:2px solid #ed1e79;
	border-radius:10px;
	box-sizing:border-box;
}
.contents .information p { margin:0; }


/* SH ============ */

/* gamejam */
#gamejam .blockHead { height:480px; background-image:url(../img/sec/bg01-1-2.jpg);  }
.contents #gamejam h3 { color:#3311b3; }
.contents #gamejam .image > dt::before { background-color:#3311b3; }

/* puyopuyo */
#puyopuyo .blockHead { height:580px; background-image:url(../img/sec/bg02-1-4.jpg);  }
.contents #puyopuyo h3 { color:#ff6600; }
.contents #puyopuyo .image > dt::before { background-color:#ff6600; }

/* CG */
#cg .blockHead { height:440px; background-image:url(../img/sec/bg03-1-3.jpg);  }
.contents #cg h3 { color:#e30040; }

/* talksession */
#talksession .blockHead { height:440px; background-image:url(../img/sec/bg04-1-2.jpg);  }
.contents #talksession h3 { color:#005712; }
.contents #talksession .image > dt::before { background-color:#005712; }
#talksession .timeline h4 { color:#060; }
#talksession .timeline h4 span { margin:0 .5em; padding:2px 5px; border-radius:5px; background:#060; color:#FFF; }
#talksession .timeline p { margin-left:1em; }


/* SH */
.gmap { width:100%; height:250px; margin:25px 0; }
#access iframe,
.access iframe { width:100%;  height:100%; border-radius:10px; }
/**/
.access        { display:flex; justify-content:space-between; }
.access dl     { width:390px; }
.access strong { font-size:24px; }
.access dl ul  { font-size:80%; }
.sp { display:none; }
/* 20240704  */
.month { display:block; padding:.1em; background:#FEE; line-height:1em; }
.access.accessMap    { display:block; }
.access.accessMap dl { display:flex; justify-content:space-between; width:auto; margin:1em 0 2em; }
.access.accessMap dd { width:49%; }
.access dd p { line-height:1.5em; margin:.5em 0; }

/* ============ */


.contents #attention ul { margin:0; }


/* accordion */
.accordion_box { display:none; }
.accordion_btn,.accordion_btn02 {
	padding:0 0 10px;
	width:100%;
}
.accordion_btn a,.accordion_btn02 a {
	margin:0 auto;
	padding:0 16px 0 60px;
	width:374px; height:72px;
	font-size:24px;
	color:#131841;
	font-weight:600;
	text-decoration:none;
	line-height:normal;
	box-sizing:border-box;
	position:relative;
	z-index:0;
}
.accordion_btn a::before,.accordion_btn02 a::before {
	content:"";
	transition:all 300ms ease-in-out;
	width:auto; height:auto;
	border:4px solid #131841;
	border-radius:30px;
	display:block;
	position:absolute;
	top:6px; bottom:6px;
	right:6px; left:6px;
	z-index:-1;
	box-sizing:border-box;
}
.accordion_btn a::after,.accordion_btn02 a::after {
	content:"";
	width:100%; height:100%;
	background-color:#FFF;
	background-image:url(../img/btn_open.png);
	background-repeat:no-repeat;
	background-position:left top;
	border-radius:36px;
	display:block;
	position:absolute;
	top:0; left:0;
	z-index:-2;
}
.accordion_btn a:hover::before,.accordion_btn02 a:hover::before {
	border:4px solid #9095b5;
}
.accordion_btn.close a::after,.accordion_btn02.close a::after {
	background-image:url(../img/btn_close.png);
	background-position:left top;
}
.accordion_btn { margin-top:-36px; }
.accordion_btn02 { padding-top:10px; }
/* SH */
.accordion_btn a:hover,.accordion_btn02 a:hover { opacity:1; }


@keyframes catch {
	0% {
		transform:translate(0,50px);
		opacity:0;
	}
	to {
		transform:translate(0,0);
		opacity:1;
	}
}
@keyframes fadeIn {
 	0% {
 		opacity:0;
 	}
	to {
		opacity:1;
	}
}
@keyframes image {
 	0% {
 		transform:translate(0,100px);
 		opacity:0;
 	}
	to {
		transform:translate(0,0);
		opacity:1;
	}	
}
@keyframes bg {
	0% {
		background-position:0 0;
 	}
	to {
		background-position:-864px -647px;
	}
}
#header {
	margin:0 auto;
	width:100%; height:80px;
	min-width:1080px;
	background-color:#333848;
	position:fixed;
	top:0; left:0;
	z-index:900;
}
#header h1 {
	margin:0 auto;
	width:100%;
	max-width:1500px;
	position:relative;
}
#header h1 a {
	width:144px; height:80px;
	background-image:url(../img/logo_sapporogamecamp.png);
	background-repeat:no-repeat;
	background-position:center center;
	background-size:auto 52px;
	display:block;
	position:absolute;
	top:0; left:0;
	z-index:950;
}

#navTopWrap { margin:0 auto; }
.navTop {
	margin:0 auto;
	position:relative;
}
.navTop ul {
	margin:10px 0 0;
	height:30px;
	font-size:0;
	text-align:center; /**/
	/*text-align:right;*/
}
.navTop ul li {
	display:inline-block;
	border-left:2px solid #545b74;
	vertical-align:middle;
}
.navTop ul li a {
	transition:all 300ms ease-in-out;
	padding:0 20px 0;
	width:100%; height:60px;
	color:#ffff0c;
	font-size:16px;
	font-weight:600;
	text-decoration:none;
	line-height:normal;
	box-sizing:border-box;
}
.navTop ul li:last-child {
	border-right:2px solid #545b74;
}
.navTop ul li a:hover { color:#fff; }
.navTop ul br { display:none; }
.navTop ul br:last-child {
	display:inherit;
}
.navBtnTop:hover { cursor:pointer; }


/* footer */
footer {
	background-color:#d9e5ec;
	position:relative;
	z-index:0;
}

.logoSet {
	padding:20px 0 0; margin:0 0 20px;
	font-size:0;
	text-align:center;
}
.logoSet li {
	margin:0 14px;
	display:inline-block;
	vertical-align:middle;
}
.logoSet img { height:70px; }

.attention,.copyright {
	margin:0 auto; padding:25px 0;
	width:1080px;
	font-size:12px;
	line-height:1.8;
	color:#737690;
	border-top:2px solid #b9bcd3;
}

/* copyright */
.copyright ul { margin:20px 0 0; display:flex; flex-wrap:wrap; justify-content:center; }
.copyright ul:first-child { margin:0; }
.copyright li { margin:0 .5em; }
/**/

footer small {
	padding:0 0 30px;
	text-align:center;
	color:#737690;
	font-size:12px;
	display:block;
	font-family:"メイリオ","ＭＳ Ｐゴシック",Verdana,sans-serif;
}
footer li { font-family:"メイリオ","ＭＳ Ｐゴシック",Verdana,sans-serif; }

/* 20240704 */
footer nav    { margin:20px 0; }
footer nav ul { display:flex; justify-content:center; font-size:90%; }
footer nav li { margin:0 .5em; }
footer nav a:active,
footer nav a:hover,
footer nav a:link,
footer nav a:visited { color:#ed1e79; text-decoration:none; font-weight:bold; }
footer nav a:hover   { text-decoration:underline; opacity:.5; }

/* footer */


body > iframe { display:none; }
.main > h1 {
	padding:60px 0;
	font-size:40px;
	text-align:center;
	line-height:48px;
}
.contents {}
.contents h2 {
	margin:0 auto 40px;
	padding:6px 0 0;
	width:1080px; height:90px;
	font-size:30px;
	line-height:normal;
	color:#131841;
	font-weight:600;
	background-image:url(../img/h2.png);
	background-repeat:no-repeat;
	background-position:center center;
	box-sizing:border-box;
}
.contents h3 {
	margin:45px auto 20px;
	padding:0 0 5px;
	width:820px;
	font-size:24px;
	line-height:normal;
	color:#131841;
	font-weight:600;
	border-bottom:1px solid #131841;
	text-align:center;
}
.contents h4 {
	/* padding:0 0 5px; */ margin:25px 0 10px;
	font-size:18px;
	line-height:normal;
	color:#131841;
	font-weight:600;
}
.contents ol, .contents p, .contents ul {
	margin-bottom:25px;
}
.contents ol ol, .contents ol ul, .contents p ol,
.contents p ul, .contents ul ol, .contents ul ul {
	margin:10px 0;
}
.contents ol dt, .contents p dt, .contents ul dt {
	margin-top:10px;
}
.contents ol dd, .contents p dd, .contents ul dd {
	margin-bottom:10px;
}
.contents ol p, .contents p p, .contents ul p {
	margin-bottom:5px;
}
.contents li { margin-bottom:10px; }
.contents strong {
	font-weight:600;
	color:#ed1e79;
	font-size:120%;
}
.contents img {
	max-width:100%;
	height:auto;
}
.contents hr {
	height:1px;
	margin:40px 0 60px;
	background:#c1defc;
	display:block;
	border:none;
}
.contents .m-top0     { margin-top:0px!important; }
.contents .m-top10    { margin-top:10px!important; }
.contents .m-top20    { margin-top:20px!important; }
.contents .m-top30    { margin-top:30px!important; }
.contents .m-top40    { margin-top:40px!important; }
.contents .m-top50    { margin-top:50px!important; }
.contents .m-top60    { margin-top:60px!important; }
.contents .m-top70    { margin-top:70px!important; }
.contents .m-top80    { margin-top:80px!important; }
.contents .m-top90    { margin-top:90px!important; }
.contents .m-left0    { margin-left:0px!important; }
.contents .m-left10   { margin-left:10px!important; }
.contents .m-left20   { margin-left:20px!important; }
.contents .m-left30   { margin-left:30px!important; }
.contents .m-left40   { margin-left:40px!important; }
.contents .m-left50   { margin-left:50px!important; }
.contents .m-left60   { margin-left:60px!important; }
.contents .m-left70   { margin-left:70px!important; }
.contents .m-left80   { margin-left:80px!important; }
.contents .m-left90   { margin-left:90px!important; }
.contents .m-right0   { margin-right:0px!important; }
.contents .m-right10  { margin-right:10px!important; }
.contents .m-right20  { margin-right:20px!important; }
.contents .m-right30  { margin-right:30px!important; }
.contents .m-right40  { margin-right:40px!important; }
.contents .m-right50  { margin-right:50px!important; }
.contents .m-right60  { margin-right:60px!important; }
.contents .m-right70  { margin-right:70px!important; }
.contents .m-right80  { margin-right:80px!important; }
.contents .m-right90  { margin-right:90px!important; }
.contents .m-bottom0  { margin-bottom:0px!important; }
.contents .m-bottom10 { margin-bottom:10px!important; }
.contents .m-bottom20 { margin-bottom:20px!important; }
.contents .m-bottom30 { margin-bottom:30px!important; }
.contents .m-bottom40 { margin-bottom:40px!important; }
.contents .m-bottom50 {	margin-bottom:50px!important; }
.contents .m-bottom60 {	margin-bottom:60px!important; }
.contents .m-bottom70 { margin-bottom:70px!important; }
.contents .m-bottom80 { margin-bottom:80px!important; }
.contents .m-bottom90 {	margin-bottom:90px!important;}
.contents .right { float:right; }
.contents .textCenter { text-align:center; }
.contents .textRight  { text-align:right; }
.contents .textLeft   { text-align:left; }
.contents p.attentionMarkBlack {
	padding-left:1em; text-indent:-1em;
}
.contents .attentionMark li,.contents p.attentionMark {
	padding-left:1em; text-indent:-1em;
	color:#ed1e79;
	display:block;
}
.contents span.attentionMark {
	color:#ed1e79;
}
.contents .attentionMark li .image li {
	padding-left:1em; text-indent:-1em;
}
.contents .attentionMark li .image li::before {
	content:"・";
	display:inline;
	width:auto; height:auto;
	background:transparent;
	position:static;
}

.contents .image > dt {
	padding-left:23px;
	margin-bottom:5px;
	text-indent:0;
	font-size:24px;
	font-weight:600;
	position:relative;
}
.contents .image > dt::before {
	content:"";
	display:block;
	width:16px; height:16px;
	background-color:#ed1e79;
	position:absolute;
	top:11px; left:0;
	border-radius:50%;
}
.contents .image > dd {	margin-bottom:25px; }

.contents .image ul { margin-top:0; }
.contents .disc > li {
	padding-left:18px;
	margin-bottom:0;
	text-indent:0;
	position:relative;
}
.contents .disc > li::before {
	content:"";
	display:block;
	width:3px; height:3px;
	background-color:#131841;
	position:absolute;
	top:11px; left:6px;
	border-radius:50%;
}

.contents .decimal > li {
	margin-left:1.5em;
	margin-bottom:0;
	padding:0;
	text-indent:0;
	list-style:decimal;
}
.contents .linkList > li { margin-bottom:0; }
.contents .linkList a { text-decoration:underline; }
.contents .bnr, .contents .img { text-align:center; }
.contents .bnr img, .contents .img img { width:auto; }