@charset "UTF-8";

.localNavigation .menuWrapper{
	background-color:rgb(211,109,198);
}

@media screen and (min-width: 769px) {
	#globalNavi .buttons a:nth-child(7),
	#globalNavi .buttons a:hover:nth-child(7){
		/*background-image:url(../images/gnb_07_active.png);*/
		background-image:url(../images/gnb_08_active.png);
	}
	body.year2023 .localNavigation .menuWrapper ul li:nth-child(1) a,
	body.year2022 .localNavigation .menuWrapper ul li:nth-child(2) a,
	body.year2021 .localNavigation .menuWrapper ul li:nth-child(3) a,
	body.year2020 .localNavigation .menuWrapper ul li:nth-child(4) a,
	body.year2019 .localNavigation .menuWrapper ul li:nth-child(5) a,
	body.year2018 .localNavigation .menuWrapper ul li:nth-child(6) a,
	body.year2017 .localNavigation .menuWrapper ul li:nth-child(7) a,
	body.year2016 .localNavigation .menuWrapper ul li:nth-child(8) a,
	body.year2015 .localNavigation .menuWrapper ul li:nth-child(9) a,
	body.year2014 .localNavigation .menuWrapper ul li:nth-child(10) a{
		background-color:rgba(0,0,0,0.1);
		pointer-events:none;
	}

}

.awardHeader{
	background-image:url(https://www.sgh-ecokaiga.jp/images/award/headerLine.png);
	background-repeat:repeat-x;
	background-position:bottom;
	padding-bottom:3vw;
	font-weight:800;
	color:rgb(52,60,76);
	margin:4.5vw 0;
	text-align:center;
}

h2.awardHeader span{
	font-size:5vw;
	margin:0 auto;
}

h2.awardHeader img{
	display:inline;
	width:9.5vw;
	height:auto;
	margin-right:1vw;
}

h2.awardHeader img.kingCrown{
	width:8vw;
}

h2.awardHeader img.pinkCrown{
	width:6vw;
}

h3.theme{
	font-weight:800;
	text-align:center;
}

h3.theme p{
	margin:4.5vw 0;
	font-size:3.8vw;
	line-height:5.5vw;
	text-align:left;
}

h3.theme .theme_logo{
	margin-right: 1vw;
	float: left;
	width: 12%;
	height: auto;
}

h3.theme .theme_topic{
	margin-left: 1vw;
	margin-bottom: 3vw;
	float: left;
	width: 80%;
	height: auto;
}

.pastelBodyAward{
	padding:3vw;
	background-color:rgb(255,255,255);
	border-radius:0 0 1.5vw 1.5vw;
	overflow:hidden;
}

.nostreamText{
	color:rgb(255,0,0);
}

.nostreamText p.nsheader{
	font-weight:800;
}

div.listWrapper{
	margin-top:10vw;
	box-sizing:border-box;
	text-align:center;
}

div.menuWrapper div.subMenuWrapper{
	background:rgb(164, 214, 172);
}

div.menuWrapper div.subMenuWrapper.current{
	background:#eba4c3;
}

div.menuWrapper ul.subMenu,
div.menuWrapper ul.subMenu li a,
div.menuWrapper ul.subMenu li a:hover{
	color:rgb(46, 68, 137);
}

#movieModal .wrapper{
	position:relative;
}

.movieIntroduction h4.introHeader{
	margin-bottom:0.5vw;
}

.movieIntroduction .wrapper{
	float:left;
}

.movieIntroduction h4.introHeader span{
	font-size:4.5vw;
	color:rgb(59,73,159);
	margin-left:5.2vw;
}

.movieIntroduction h4.introHeader img{
	display:inline;
	width:6vw;
	height:auto;
	margin-right:1vw;
}

.movieIntroduction .movieLinkButton{
	background-color:rgb(210,108,197);
	border-radius:1vw;
	width:40vw;
	padding:1.5vw 0;
	margin:3vw 0 1.5vw 5.5vw;
	float:left;
}

.movieIntroduction .movieLinkButton img{
	margin:0 auto;
	width:25vw;
}

.movieIntroduction img.nostreamImage,
.movieIntroduction .youtubeThumbnail{
	width:31vw;
	height:17vw;
	float:left;
}

.movieIntroduction.pastelLine,
.movieIntroduction .pastelHeader{
	background-color:rgb(210,108,197);
	position:relative;
	width:100%;
}

.judgesBlock{
	position:relative;
	padding: 3vw;
	background-color: rgb(255, 251, 208);
	border-radius: 4vw;
	margin:7vw 0 3vw;
}

.judgesBlock div{
	margin-top:15px;
}

.judgesBlock div.judgesTop{
	margin-top:-10px;
}

.headerSmall{
	background-image: url(https://www.sgh-ecokaiga.jp/images/award/headerSmall_PC.png);
	background-size: 100% 100%;
	width: 65vw;
	height: 9vw;
	margin: -7vw auto 8vw auto;
}

.headerSmall img{
	width: 50vw;
	position: absolute;
	top:-3vw;
	left:0;
	right:0;
	margin:auto;
}

.portraitPhoto{
	display:inline-block;
	float:left;
	margin-right: 3vw;
}

.teachComments{
	display:inline-block;
	vertical-align: top;
}

.teachIntroduction{
	font-size: 0.94em;
	color: rgb(0, 106, 178);
}

.teachIntroduction span{
	font-size: 1.25em;
}


.backBody{
	background-color: rgb(230, 246, 253);
	padding:0 1.8vw;
	overflow:hidden;
}

div.worksList{
	overflow:hidden;
}

div.worksList div.cells{
	width:100%;
	margin-bottom:4vw;
	height:auto;
}

div.worksList div.cells a{
	text-decoration:none;
}

div.worksList div.cells p.worksTitle:hover,
div.worksList div.cells p.author:hover{
	text-decoration:underline;
}

div.worksList div.cells p{
	text-align:center;
	font-size:1.0em;
	line-height:1.2em;
	color:rgb(51, 51, 51);
}

div.worksList div.cells p.worksTitle{
	margin:0.5vw 0;
	font-weight:800;
	color:rgb(60, 93, 162);
	padding-top:0.5vw;
}

div.worksList div.cells img.works{
	width:100%;
}

a.eventLink{
	display:block;
	margin-bottom:1em;
}

a.eventLink img{
	width:100%;
}

div.worksList.multiColumn div.cells{
	float:left;
	width:49.5%;
	margin-right:1%;
	padding:1vw;
}

div.worksList.multiColumn div.cells:nth-child(even){
	margin-right:0;
}

div.worksList.multiColumn  div.cells p{
	font-size:0.75em;
	line-height:1.0em;
}

.archivesLinkButton{
    margin: 15vw auto;
    width:100%;
}

#movieModal{
	width:100vw;
	height:100vh;
	background-color:rgba(0,0,0,.6);
	z-index:80;
	position:fixed;
	top:0;left:0;
	display:none;
}

#movieModal .wrapper{
	position:relative;
}

#movieModal.active{
	display:block;
}

#movieModal iframe{
	display:block;
}

#youtubeMovieInstance,
#movieModal.active iframe{
	display:block;
}

#movieModal.active .movieClose{
	display:block;
	position:absolute;
	top:0;right:0;
	z-index:85;
}

/* Intra Youtube display Fix (tedo 19/11/11)*/

.intraFix{
	overflow:hidden;
}

.intraFix .introHeader{
	margin-top:6vw;
}

p.nsheader{
	margin:5vw 0 3vw;
}

/* CSS for PC WIDTH:960PX; */

@media screen and (min-width: 769px) {

	body.lowLevel div.contents{
		width:960px;
	}

	.pastelBodyAward{
		padding:15px;
		border-radius:0 0 10px 10px;
	}

	.nostreamAward{
		margin-top:0;
		height:250px;
	}

	div.listWrapper{
		overflow:hidden;
		margin:60px auto;
	}

	.headerSmall{
		width:311px;
		height:40px;
		padding-top: 15px;
		margin: -40px auto 30px auto;
	}
	.headerSmall img{
		width:25%;
	    top:-13px;
	    left:0;
	    right:0;
	    margin:auto;
	}

	.awardHeader{
		padding-bottom:20px;
		font-size:24px;
		margin-bottom:20px;
		margin-top:0;
		line-height:28px;
		text-align: inherit;
	}

	h2.awardHeader span{
		font-size:30px;
		line-height:28px;
	}

	h2.awardHeader img{
		width:31px;
		height:auto;
		margin-right:10px;
	}

	h2.awardHeader img.kingCrown{
		width:40px;
	}

	h2.awardHeader img.pinkCrown{
		width:31px;
	}

	h3.theme{
		padding:20px 0;
		margin:15px 0;
		font-size:24px;
		line-height:28px;
		text-align: inherit;
	}

	h3.theme p{
		font-size:24px;
		margin: 0 0 15px 0;
		line-height:20px;
	}

	h3.theme .theme_logo{
		width: 66px;
		margin: 0px 0 0 80px;
	}


	h3.theme .theme_topic{
		width: 650px;
		margin:-14px 80px 0px 50px;
	}

	.movieTrigger{
		cursor:pointer;
	}

	.movieIntroduction .wrapper{
		position:relative;
		display:inline-block;
		width:760px;
		height:87px;
	}

	.movieIntroduction.nostream .wrapper{
		height:265px;
	}

	.movieIntroduction h4.introHeader span{
		font-size:28px;
		line-height:300%;
	}

	.movieIntroduction h4.introHeader{
		margin-bottom:10px;
	}

	.movieIntroduction h4.introHeader img{
		width:54px;
		height:auto;
		margin-right:10px;
	}

	.movieIntroduction .movieLinkButton:hover,
	.movieIntroduction .youtubeThumbnail.pcBlock:hover{
		opacity:0.8;
	}

	.movieIntroduction .movieLinkButton{
		position:absolute;
		border-radius:5px;
		width:250px;
		padding:10px 0;
		margin:0;
		top: 18px;
		right: 50px;
	}

	.movieIntroduction .movieLinkButton.nsLinkButton{
		background-color:rgb(175,175,175);
		top:33px;
	}

	.movieIntroduction .movieLinkButton.nsLinkButton img{
		cursor:default;
	}

	.movieIntroduction .movieLinkButton.nsLinkButton:hover{
		opacity:1.0;
	}

	.movieIntroduction .movieLinkButton img{
		width:122px;
		top: 67px;
	}

	.movieIntroduction .movieLinkButton:hover,
	.movieIntroduction .youtubeThumbnail.pcBlock:hover{
		opacity:0.8;
	}

	.movieIntroduction img.nostreamImage,
	.movieIntroduction .youtubeThumbnail{
	    display: inline-block;
		width:154px;
		height:87px;
	}

	.judgesBlock{
		height:850px;
		padding: 20px;
		border-radius: 15px;
		margin:50px 0 10px;
	}

	.judgesAdd{
		height:720px !important;
	}

	.judgesAdd2{
		height:840px !important;
	}

	.portraitPhoto{
		margin-right: 20px;
	}

	.backBody{
		padding:30px;
	}

	.headerAdd img{
		width:45%;
	    top:-15px;
	    left:0;
	    right:0;
	    margin:auto;
	}

	div.worksList div.cells{
		margin-bottom:25px;
		padding:0;
	}

	div.worksList div.cells p.worksTitle{
		margin-top:0rem;
	}

	div.worksList div.awardWrapper{
		width:460px;
		display:inline-block;
		margin: 0 0 25px 0;
		vertical-align: top;
	}

	div.worksList div.awardWrapAdd{
		width:416px;
		margin: 0 15px 25px 15px;
	}

	.awardWrappR{
		float:right;
	}

	div.worksList div.cells img.works{
		width:100%;
	}

	div.worksList div.cells.wide{
		width:880px;
	}

	a.eventLink{
		width:400px;
		margin:1.2em auto 0;
	}

	div.worksList.multiColumn{
		margin:0 auto;
	}

	div.worksList.multiColumn div.cells{
		width:160px;
		padding:0px;
		margin:10px 10px 0;
	}

	div.worksList.multiColumn div.cells:nth-child(even){
		margin:10px 10px 0;
	}

	div.worksList.multiColumn  div.cells p{
		line-height:1.1em;
	}

	.archivesLinkButton{
    	margin: 50px auto 0 auto;
    	width:324px;
	}

	.archivesLinkButton:hover{
		opacity:0.8;
	}

	#movieModal{
		width:100%;
		height:100vh;
	}

	#movieModal .buttonAlign{
		width:800px;
		overflow:hidden;
		margin:60px auto 0;
	}

	#movieModal .closeButton{
		display: inline-block;
		float:right;
		width: 80px;
		height: 80px;
		position: relative;
		cursor: pointer;
	}

	#movieModal .closeButton span::before,
	#movieModal .closeButton span::after {
		display: block;
		content: "";
		position: absolute;
		top: 50%;
		left: 50%;
		width: 84%;
		height: 2px;
		margin: -8% 0 0 -42%;
		background: rgb(255,255,255);
	}

	#movieModal .closeButton span::before {
		transform: rotate(-45deg);
	}

	#movieModal .closeButton span::after {
		transform: rotate(45deg);
	}

/* Intra Youtube display Fix (tedo 19/11/11)*/

	.intraFix .introHeader{
		margin-top:15px;
	}

	p.nsheader{
		margin:15px 0 10px;
	}

	p.nsText{
		line-height:20px;
	}
    h1.headerKing#award{
    	margin: 0 auto;
    }

    p.mini-note{
    	font-size:12px;
		line-height:1.0em;
		margin: 5px 10px 0px 10px;
    }
}