/* Y'S GEAR : top.css */


/*======================================================================*
 *  [ mainSlider | メインスライダー ] 
 *======================================================================*/

/* [ aboutPhoto | フォトコン説明 ] */
.aboutPhoto {
	position: relative;
	padding: 56.64335664% 0 0 0;
	background: url(../../img/img_main.jpg);
	background-size: contain;
	text-align: center;
}

.aboutPhoto p {
	position: absolute;
	width: 100%;
	box-sizing: border-box;
}
.aboutPhoto .title {
	top: 20%;
	padding: 0 15.26806527%;
}
.aboutPhoto .text {
	top: 57%;
	padding: 0 20px;
	font-size: 14px;
	font-size: 1.4rem;
	line-height: 2;
}


/* [ imageNav | スライドサムネイル ] */
.imageNav li span {
	padding: 66.11111111% 0 0 0;
}

/* [ スライドサムネイル個別画像指定 ] */
.imageNav li.main 		{ display: none; }
.imageNav li.p14th 		{ background-image: url(../../img/thumb_14th.jpg); }
.imageNav li.p13th 		{ background-image: url(../../img/thumb_13th.jpg); }
.imageNav li.p12th 		{ background-image: url(../../img/thumb_12th.jpg); }
.imageNav li.p11th 		{ background-image: url(../../img/thumb_11th.jpg); }
.imageNav li.p10th 		{ background-image: url(../../img/thumb_10th.jpg); }
.imageNav li.p09th 		{ background-image: url(../../img/thumb_09th.jpg); }
.imageNav li.p14th span { background-image: url(../../img/txt_14th.png); }
.imageNav li.p13th span { background-image: url(../../img/txt_13th.png); }
.imageNav li.p12th span { background-image: url(../../img/txt_12th.png); }
.imageNav li.p11th span { background-image: url(../../img/txt_11th.png); }
.imageNav li.p10th span { background-image: url(../../img/txt_10th.png); }
.imageNav li.p09th span { background-image: url(../../img/txt_09th.png); }


/*======================================================================*
 *  [ currentContest | 現在のコンテスト ] 
 *======================================================================*/

.currentContest h2 {
	margin: 0 0 30px 0;
	padding: 10px 10px;
	background: url(../../img/bg_title.png);
	background-size: 3px 3px;
	color: #464646;
	font-size: 16px;
	font-size: 1.6rem;
	font-weight: bold;
	text-align: center;
}
.currentContest h2 span {
	display: inline-block;
	margin: 0 5px 0 0;
	padding: 5px 10px;
	background: #464646;
	color: #fff;
}
.currentContest h2 br {
	display: none;
}

.currentContest h3 {
	color: #464646;
	font-size: 18px;
	font-size: 1.8rem;
}

/* [ ボタン共通CSS ] */
.addButton, 
.listButton {
	display: block;
	margin: 0 auto;
	border-radius: 5px;
	box-sizing: border-box;
	color: #fff !important ;
	font-weight: bold;
	text-align: center;
}
a.addButton:hover, 
a.listButton:hover {
	color: #fff !important;
}


/*======================================================================*
 *  [ outlineBox / detailBox | 募集中 ] 
 *======================================================================*/

/* [ outlineBox | コンテスト概要 ] */
.outlineBox {
	max-width: 880px;
	margin: 0 auto;
}
.outlineBox section {
	display: table;
	width: 100%;
	margin: 0 0 20px 0;
}
.outlineBox h3, 
.outlineBox p {
	display: table-cell;
	padding: 10px 20px;
	box-sizing: border-box;
	vertical-align: middle;
}
.outlineBox h3 {
	width: 25%;
	border-right: 1px solid #000;
	text-align: right;
}

/* [ theme | テーマ ] */
.outlineBox .theme p {
	font-size: 20px;
	font-size: 2rem;
	font-weight: bold;
}
.outlineBox .theme p span {
	color: #464646;
	font-size: 14px;
	font-size: 1.4rem;
	font-weight: normal;
}

/* [ period | 募集期間 ] */
.outlineBox .period p {
	font-size: 18px;
	font-size: 1.8rem;
}
.outlineBox .period p br {
	display: none;
}

/* [ detailBox | コンテスト詳細 ] */
.detailBox {
	max-width: 880px;
	margin: 0 auto 40px auto;
	border-top: 1px dotted #ccc;
	color: #464646;
}
.detailBox section {
	position: relative;
	padding: 20px 20px 20px 22%;
	border-bottom: 1px dotted #ccc;
}
.detailBox h3 {
	position: absolute;
	top: 20px;
	left: 0;
	width: 22%;
	padding: 0 20px;
	box-sizing: border-box;
	text-align: center;
}

/* [ prize | 賞品 ] */
.detailBox .prize ol {
	padding: 0 0 0 35px;
	background: url(../../img/icon_medal.png) no-repeat;
}
.detailBox .prize li {
	float: left;
	width: 50%;
	padding: 0 0 0 20px;
	box-sizing: border-box;
}
.detailBox .prize p {
	margin: 0 0 10px 0;
	color: #000;
	font-size: 14px;
	font-size: 1.4rem;
}
.detailBox .prize p strong {
	font-size: 16px;
	font-size: 1.6rem;
}
.detailBox .prize .grand strong   { color: #cc9900; }
.detailBox .prize .winning strong { color: #7a7a7a; }
.detailBox .prize a {
	display: block;
	border: 1px solid #ccc;
	float: left;
}
.detailBox .prize img {
	display: block;
	width: 100%;
}

/* [ method | 応募方法 ] */
.detailBox .method h3 + p {
	margin: 0 0 5px 0;
	font-size: 18px;
	font-size: 1.8rem;
}
.detailBox .method p + p {
	margin: 0 0 15px 0;
	font-size: 14px;
	font-size: 1.4rem;
}
.detailBox .method .scrollBox {
	height: 200px;
	padding: 0 20px;
	background: #f8f7f7;
	border: 1px solid #e6e6e6;
	box-sizing: border-box;
	overflow: auto;
}
.detailBox .method .scrollBox dl {
	padding: 20px 0;
}
.detailBox .method .scrollBox dt {
	font-size: 13px;
	font-size: 1.3rem;
	font-weight: bold;
}
.detailBox .method .scrollBox dd + dt {
	margin: 15px 0 0 0;
}
.detailBox .method .scrollBox dd, 
.detailBox .method .scrollBox li {
	margin: 5px 0 0 0;
	padding: 0 0 0 1em;
	text-indent: -1em;
}
.detailBox .method .scrollBox dd:before, 
.detailBox .method .scrollBox li:before  {
	content: "・";
}

/* [ result | 結果発表 ] */
.detailBox .result p {
	font-size: 13px;
	font-size: 1.3rem;
}
.detailBox .result h3 + p {
	margin: 0 0 5px 0;
	color: #000;
	font-size: 18px;
	font-size: 1.8rem;
	font-weight: bold;
}
.detailBox .result p span {
	display: inline-block;
	padding: 0 0 0 1em;
	font-size: 12px;
	font-size: 1.2rem;
	text-indent: -1em;
}

/* [ addButton | 投稿ボタン ] */
.addButton {
	max-width: 380px;
	margin: 0 auto 40px auto;
	padding: 20px;
	background: rgb(55,55,55); /* Old browsers */
	background: -moz-linear-gradient(top,  rgba(55,55,55,1) 0%, rgba(1,1,1,1) 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(55,55,55,1)), color-stop(100%,rgba(1,1,1,1))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  rgba(55,55,55,1) 0%,rgba(1,1,1,1) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  rgba(55,55,55,1) 0%,rgba(1,1,1,1) 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  rgba(55,55,55,1) 0%,rgba(1,1,1,1) 100%); /* IE10+ */
	background: linear-gradient(to bottom,  rgba(55,55,55,1) 0%,rgba(1,1,1,1) 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#373737', endColorstr='#010101',GradientType=0 ); /* IE6-9 */
	font-size: 22px;
	font-size: 2.2rem;
}
a.addButton:hover {
	background: rgb(1,1,1); /* Old browsers */
	background: -moz-linear-gradient(top,  rgba(1,1,1,1) 0%, rgba(55,55,55,1) 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(1,1,1,1)), color-stop(100%,rgba(55,55,55,1))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  rgba(1,1,1,1) 0%,rgba(55,55,55,1) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  rgba(1,1,1,1) 0%,rgba(55,55,55,1) 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  rgba(1,1,1,1) 0%,rgba(55,55,55,1) 100%); /* IE10+ */
	background: linear-gradient(to bottom,  rgba(1,1,1,1) 0%,rgba(55,55,55,1) 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#010101', endColorstr='#373737',GradientType=0 ); /* IE6-9 */

}
.addButton:before {
	display: inline-block;
	margin: 0 20px 0 0;
	vertical-align: middle;
	content: url(../svg/icon_camera.svg);
}


/*======================================================================*
 *  [ resultBox | 結果発表 ] 
 *======================================================================*/

.resultBox {
	margin: 0 0 40px 0;
}


/*======================================================================*
 *  [ latestBox | 最新の投稿 ] 
 *======================================================================*/

.latestBox {
	max-width: 850px;
	margin: 0 auto 75px auto;
	padding: 60px 0 0 0;
	background: url(../../img/bg_latest.png) center top no-repeat;
	background-size: 100% auto;
	text-align: center;
}
.latestBox h3 {
	color: #363a90;
	font-size: 26px;
	font-size: 2.6rem;
	font-weight: normal;
}
.latestBox h3:after {
	display: inline-block;
	margin: 0 0 0 10px;
	color: #464646;
	font-size: 14px;
	font-size: 1.4rem;
	font-family: 'Lato', sans-serif;
	content: "NEW PHOTO";
}
.latestBox p {
	color: #464646;
	margin: 0 0 20px 0;
}

.latestBox ul {
	margin: 0 0 20px 0;
	padding: 0 17px;
}
.latestBox li {
	float: left;
	width: 20%;
	padding: 3px;
	box-sizing: border-box;
}
.latestBox li img {
	display: block;
}

/* [ listButton | 全ての作品を見るボタン ] */
.listButton {
	max-width: 240px;
	padding: 10px 20px;
	background: rgb(77,80,156); /* Old browsers */
	background: -moz-linear-gradient(top,  rgba(77,80,156,1) 0%, rgba(54,58,144,1) 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(77,80,156,1)), color-stop(100%,rgba(54,58,144,1))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  rgba(77,80,156,1) 0%,rgba(54,58,144,1) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  rgba(77,80,156,1) 0%,rgba(54,58,144,1) 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  rgba(77,80,156,1) 0%,rgba(54,58,144,1) 100%); /* IE10+ */
	background: linear-gradient(to bottom,  rgba(77,80,156,1) 0%,rgba(54,58,144,1) 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4d509c', endColorstr='#363a90',GradientType=0 ); /* IE6-9 */
	font-size: 14px;
	font-size: 1.4rem;
}
a.listButton:hover {
	background: rgb(54,58,144); /* Old browsers */
	background: -moz-linear-gradient(top,  rgba(54,58,144,1) 0%, rgba(77,80,156,1) 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(54,58,144,1)), color-stop(100%,rgba(77,80,156,1))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  rgba(54,58,144,1) 0%,rgba(77,80,156,1) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  rgba(54,58,144,1) 0%,rgba(77,80,156,1) 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  rgba(54,58,144,1) 0%,rgba(77,80,156,1) 100%); /* IE10+ */
	background: linear-gradient(to bottom,  rgba(54,58,144,1) 0%,rgba(77,80,156,1) 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#363a90', endColorstr='#4d509c',GradientType=0 ); /* IE6-9 */
}
.listButton:before {
	display: inline-block;
	margin: 0 10px 0 0;
	vertical-align: middle;
	content: url(../svg/icon_list.svg);
}


/*======================================================================*
 *  [ pastContent | 過去のコンテスト ] 
 *======================================================================*/

.pastContent {
	margin: 0 0 40px 0;
}
.pastContent h2 {
	margin: 0 0 15px 0;
	padding: 12px 0 0 0;
	background: url(../img/bg_h2.png) repeat-x;
	background-size: 3px 6px;
	color: #464646;
	font-size: 26px;
	font-size: 2.6rem;
	font-weight: normal;
}
.pastContent h2:after {
	display: inline-block;
	margin: 0 0 0 10px;
	color: #464646;
	font-size: 14px;
	font-size: 1.4rem;
	font-family: 'Lato', sans-serif;
	content: "BACK NUMBER";
}

.pastContent ul {
	border-top: 1px solid #bfc0c0;
	border-left: 1px solid #bfc0c0;
}
.pastContent li {
	float: left;
	width: 33.33333333%;
	border-right: 1px solid #bfc0c0;
	border-bottom: 1px solid #bfc0c0;
	box-sizing: border-box;
}
.pastContent li a {
	display: block;
	position: relative;
	min-height: 64px;
	padding: 10px 20px 10px 84px;
	border: 3px solid #fff;
	background: #f8f8f8;
}
.pastContent li a:hover {
	border-color: #fff !important;
	background: #fff;
}
.pastContent li a:hover img {
	filter:alpha(opacity=100);
	-moz-opacity: 1;
	opacity: 1;
}
.pastContent li a:after {
	display: block;
	position: absolute;
	top: 50%;
	right: 10px;
	width: 5px;
	height: 5px;
	margin: -4px 0 0 0;
	border-top: 3px solid #323232;
	border-right: 3px solid #323232;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
	content: "";
}
.pastContent li img {
	position: absolute;
	top: 50%;
	left: 10px;
	margin: -32px 0 0 0;
}
.pastContent .title {
	margin: 0 0 5px 0;
	font-size: 14px;
	font-size: 1.4rem;
	font-weight: bold;
}
.pastContent .title span {
	font-size: 16px;
	font-size: 1.6rem;
}
.pastContent .period {
	color: #999;
	font-size: 11px;
	font-size: 1.1rem;
}


/*======================================================================*
 *  [ Media Queries 980 ] 
 *======================================================================*/

@media screen and (max-width: 980px) {
	
	/*==================================================================*
	 *  [ pastContent | 過去のコンテスト ] 
	 *==================================================================*/
	
	.pastContent h2 {
		padding: 12px 20px 0 20px;
	}
	
}


/*======================================================================*
 *  [ Media Queries 768 ] 
 *======================================================================*/

@media screen and (max-width: 768px) {
	
	/*==================================================================*
	 *  [ mainSlider | メインスライダー ] 
	 *==================================================================*/
	
	/* [ aboutPhoto | フォトコン説明 ] */
	.aboutPhoto .text br {
		display: none;
	}
	
	
	/*==================================================================*
	 *  [ pastContent | 過去のコンテスト ] 
	 *==================================================================*/
	
	.pastContent li {
		width: 50%;
	}
	
}

/*======================================================================*
 *  [ Media Queries 568 ] 
 *======================================================================*/

@media screen and (max-width: 568px) {
	
	/*==================================================================*
	 *  [ mainSlider | メインスライド ] 
	 *==================================================================*/
	
	/* [ aboutPhoto | フォトコン説明 ] */
	.aboutPhoto .title {
		top: 20px;
		padding: 0 10px;
	}
	.aboutPhoto .text {
		top: 50%;
		padding: 0 10px;
		font-size: 13px;
		font-size: 1.3rem;
	}
	.aboutPhoto .text span {
		display: none;
	}
	
	/* [ imageNav | スライドサムネイル ] */
	.imageNav li {
		width: 33.33333333%;
	}
	
	
	/*==================================================================*
	 *  [ currentContest | 現在のコンテスト ] 
	 *==================================================================*/
	
	.currentContest h2 span {
		margin: 0 0 10px 0;
	}
	.currentContest h2 br {
		display: block;
	}

	/* [ ボタン共通CSS ] */
	.addButton, 
	.listButton {
		max-width: 300px;
	}

	/* [ outlineBox | コンテスト概要 ] */
	.outlineBox section {
		display: block;
		padding: 0 10px;
		box-sizing: border-box;
	}
	.outlineBox h3, 
	.outlineBox p {
		display: block;
		text-align: center;
	}
	.outlineBox h3 {
		width: 100%;
		border-right: none;
		border-bottom: 1px solid #000;
	}
	
	/* [ period | 募集期間 ] */
	.outlineBox .period p {
		font-size: 16px;
		font-size: 1.6rem;
	}
	.outlineBox .period p br {
		display: block;
	}

	/* [ detailBox | コンテスト詳細 ] */
	.detailBox {
		max-width: 880px;
		margin: 0 auto 40px auto;
		border-top: 1px dotted #ccc;
		color: #464646;
	}
	.detailBox section {
		padding: 20px 10px;
	}
	.detailBox h3 {
		position: static;
		top: auto;
		left: auto;
		width: 100%;
		margin: 0 0 15px 0;
		padding: 0;
	}
	
	/* [ prize | 賞品 ] */
	.detailBox .prize p {
		font-size: 12px;
		font-size: 1.2rem;
	}
	
	/* [ latestBox | 最新の投稿 ] */
	.latestBox h3, 
	.latestBox p {
		padding: 0 10px;
	}
	.latestBox h3:after {
		display: none;
	}
	.latestBox ul {
		padding: 0 7px;
	}
	.latestBox li {
		width: 33.33333333%;
	}
	
	
	/*==================================================================*
	 *  [ pastContent | 過去のコンテスト ] 
	 *==================================================================*/
	
	.pastContent h2 {
		padding: 12px 10px 0 10px;
	}
	.pastContent h2:after {
		display: none;
	}
	.pastContent li {
		width: 100%;
	}
	
}


/*======================================================================*
 *  [ Media Queries 375 ] 
 *======================================================================*/

@media screen and (max-width: 375px) {
	
	/*==================================================================*
	 *  [ mainSlider | メインスライド ] 
	 *==================================================================*/
	
	/* [ aboutPhoto | フォトコン説明 ] */
	.aboutPhoto .text {
		font-size: 11px;
		font-size: 1.1rem;
	}
	
}

