@charset "UTF-8";

@import "../../css/drive_porter.css";

/*/==========================================================
/ 
/ フォトコンテスト
/
==========================================================/*/

html {
	scroll-padding-top: 171px;
	scroll-behavior: smooth;
	/* ついでにスムーススクロールも有効にする場合 */
}

.l-cont-body {
	padding-bottom: 1em;
}

#top_ttl {
	display: block;
	overflow: hidden;
	text-align: center;
}

#top_ttl img {
	width: min(100%, 950px);
	height: auto;
}


#u-main h1 {
	display: block;
	overflow: hidden;
	text-align: center;
}

#u-main h1 img {
	max-width: 100%;
	height: auto;
}





div#header_photocon ul li a {
	transition: none;
	-webkit-transition: none;
}

.ttlModh01 {
	color: #333;
	background-color: #fff;
	border: solid 2px #aaa;
	margin: 0 0 1em;
}

.ttlModh01 .bgG {
	padding: 10px 10px 10px 5px;
	border: 2px solid #fff;
	background-color: #efefef;
}

.ttlModh01 .fxy {
	font-size: 2.0rem;
	font-weight: 600;
	margin-left: 5px;
	padding-left: 5px;
	border-left: solid 5px #34995F;
}

.ttlMod02 {
	border-bottom: 2px #34995F solid;
	margin-bottom: 10px;
}

.ttlMod02 h3.ttl {
	font-size: 1.8rem;
	font-weight: 600;
}

.section .lower {
	padding: 10px 0;
	padding-left: 10px;
	padding-right: 10px;
}

main .section table {
	min-width: unset;
}

main .section table th {
	text-align: center;
}

main .section table td {
	padding: 1em;
}

main .section table th,
main .section table td {
	border: none;
}

#page_outline table {
	border: solid 1px #5AB386;
	border-collapse: separate;
	border-spacing: 0;
	border-spacing: 0;
}

#page_outline table tr th {
	padding: 5px;
	color: #fff;
	font-weight: bold;
	border-top: solid 1px #fff;
	white-space: nowrap;
}

#page_outline table tr td {
	padding: .5em;
	border-top: solid 1px #5AB386;
}

#page_outline table table tr td {
	padding: 5px;
	border-top: solid 1px #5AB386;
}

.thbg01 {
	background-color: #5AB386;
}

.thbg02 {
	background-color: #30B26F;
}

.thbg03 {
	background-color: #4C9670;
}

.idtKome {
	margin-left: 1em;
	text-indent: -1em;
}

.liDot01 li {
	padding-left: 12px;
	padding-bottom: 12px;
	background: url("../img/icn_dot_01.gif") no-repeat 4px 0.6em;
}

#page_faq .section {
	margin-bottom: 30px;
}

#page_faq .section>.lower {
	background-color: #F5F5F5;
	border-radius: 5px;
	padding: 1em 2em;
}

.l-cont-body #page_faq p {
	margin: 0;
}

p.mgl15 {
	margin-bottom: .5em;
}

#pmenu_apply a::after,
a#apply_form::after {
	display: none;
}

a#apply_form {
	display: block;
	width: 950px;
	height: 75px;
	background: url("../img/btn_form.gif") top left no-repeat;
	z-index: 100;
	left: 0px;
	transition: none;
}

a#apply_form:hover {
	background-position: bottom left;
}

/* PCのみに適用したいスタイル */
@media screen and (min-width: 769px) {
	div#top_space {
		position: relative;
		width: 950px;
		margin: 0 auto;
	}

	#page_outline,
	#page_policy {
		width: 950px;
		margin: 0 auto;
	}

	#page_faq {
		width: 1000px;
		margin: 0 auto;
	}

	div#header_photocon {
		width: 950px;
		height: 80px;
		margin: 0 auto 0;
		padding: 0;
		position:
			relative;
	}

	div#header_photocon ul li#pmenu_outline {
		display: block;
		width: 950px;
		position: absolute;
		top: 0px;
		left: 0px;
	}

	div#header_photocon ul li#pmenu_outline a {
		width: 230px;
		height: 60px;
		background: url("../img/menu_01outline.gif") top left no-repeat;
		display: block;
	}

	div#header_photocon ul li#pmenu_policy a {
		width: 230px;
		height: 60px;
		background: url("../img/menu_02policy.gif") top left no-repeat;
		display: block;
	}

	div#header_photocon ul li#pmenu_faq a {
		width: 230px;
		height: 60px;
		background: url("../img/menu_03faq.gif") top left no-repeat;
		display: block;
	}

	div#header_photocon ul li#pmenu_apply a {
		width: 230px;
		height: 60px;
		background: url("../img/menu_04apply.gif") top left no-repeat;
		display: block;
	}

	div#header_photocon ul li.on a {
		background-position: bottom left !important;
		height: 80px !important;
	}

	div#header_photocon ul li#pmenu_policy {
		display: block;
		position: absolute;
		top: 0px;
		left: 240px;
	}

	div#header_photocon ul li#pmenu_faq {
		display: block;
		position: absolute;
		top: 0px;
		left: 480px;
	}

	div#header_photocon ul li#pmenu_apply {
		display: block;
		position: absolute;
		top: 0px;
		left: 720px;
	}

	div#header_photocon ul li#pmenu_outline a span,
	div#header_photocon ul li#pmenu_policy span,
	div#header_photocon ul li#pmenu_faq a span,
	div#header_photocon ul li#pmenu_apply a span,
	a#apply_form span {
		display: none;
	}

	div#header_photocon ul li#pmenu_outline a:hover,
	div#header_photocon ul li#pmenu_policy a:hover,
	div#header_photocon ul li#pmenu_faq a:hover,
	div#header_photocon ul li#pmenu_apply a:hover {
		background-position: bottom left;
		height: 80px;
	}
}

/* for Sp --------------------*/
@media screen and (max-width:768px) {

	div#header_photocon ul li#pmenu_apply {
		display: none;
	}

	div#header_photocon,
	div#top_space,
	#page_outline,
	#page_policy,
	#page_faq {
		width: unset;
		margin-bottom: 1em;
	}

	#top_space p:last-child {
		padding: 2em;
		word-break: unset;
	}

	#top_space p:last-child br {
		display: none;
	}

	#page_outline table {
		table-layout: fixed;
		width: 100%;
	}

	#page_outline table tr th {
		width: 100px;
		white-space: wrap;
	}

	#page_outline table td img {
		max-width: 100%;
	}

	div#header_photocon ul li {
		width: 100%;
		border-top: 1px solid #E7E7E7;
		/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#fcfcfc+0,ededed+100 */
		background: rgb(252, 252, 252);
		/* Old browsers */
		background: -webkit-linear-gradient(top, rgba(252, 252, 252, 1) 0%, rgba(237, 237, 237, 1) 100%);
		/* Chrome10-25,Safari5.1-6 */
	}

	div#header_photocon ul li a {
		display: block;
		padding: 1em;
		color: #666;
		font-weight: bold;
	}

	div#header_photocon ul li a span {
		display: block;
		border-left: 4px solid #5AB386;
		padding: 2px 8px;
	}

	/* 応募フォームボタン */
	a#apply_form span {
		display: none;
	}

	a#apply_form {
		width: 100%;
		height: 30px;
		background-size: 100% auto;
	}
}


/*受賞作紹介フレーム*/
section.award_frame {
	width: min(100%, 930px);
	margin: var(--mgn-l) auto;
}

section.award_frame>h2 {
	display: block;
	overflow: hidden;
}

section.award_frame>h2>img {
	width: 100%;
	height: auto;
}

/* イメージマップ大 */
section#mapWrap {
	width: min(100%, 940px);
	margin: var(--mgn-l) auto;
}


/* for Sp --------------------*/
@media screen and (max-width:768px) {}


/*受賞作データボックス*/
.data_frame {
	display: block;
	overflow: hidden;
	padding: 0 15px;
	margin: 30px 0;
	text-align: center;
}


.data_frame>a {
	display: inline-block;
	overflow: hidden;
	float: left;
	margin-right: 30px;
}

.data_frame>.info_box {
	display: block;
	overflow: hidden;
	text-align: left;
}

.data_frame>.info_box>article>p {
	margin-top: 0.25em;
}


/*写真タイトル*/
.pic_title {
	display: block;
	overflow: hidden;
	padding: 0.25em 0;
	border-top: 1px solid #C9D3E0;
	border-bottom: 1px solid #C9D3E0;
}

.pic_title>span {
	float: right;
}


/*撮影情報*/
dl.data_list {
	display: block;
	overflow: hidden;
	clear: block;
	margin: 1em 0;
}

dl.data_list>dt,
dl.data_list>dd {
	display: block;
	overflow: hidden;
	float: left;
}

dl.data_list>dt {
	width: 5em;
}

dl.data_list>dd {
	width: calc(100% - 5em);
	/*border-left:1px solid #BBBBBB;
	padding-left:0.5em;*/
	margin-bottom: 0.5em;
}


/*ページ切り替えタブ*/
#tab_btns {
	display: block;
	overflow: hidden;
	width: min(100%, 930px);
	margin: var(--mgn-l) auto;
}

#tab_btns>ul {
	display: flex;
	justify-content: space-around;
	width: 100%;
	border-bottom: 1px solid #9ed8ff;
	gap: 5px 0;
}

#tab_btns>ul>li {
	flex: 1;
	padding: 0 5px;
}

#tab_btns>ul>li>a {
	display: block;
	overflow: hidden;
	height: 100%;
	padding: 1em 1em;
	font-size: var(--txt-m);
	font-weight: 600;
	line-height: 125%;
	text-align: center;
	color: var(--colA1);
	border-radius: 4px 4px 0 0;
	border: 1px solid #9ed8ff;
	background: linear-gradient(to bottom, #fdfeff 0%, #9ed8ff 100%);
}

#tab_btns>ul>li.current a {
	pointer-events: none;
	color: var(--colB1);
	background: linear-gradient(to bottom, #9ed8ff 0%, #fdfeff 100%);
}



/* for Sp --------------------*/
@media screen and (max-width:768px) {

	#award.award_frame,
	#silverPrize.award_frame {
		text-align: center;
	}

	.data_frame>a {
		display: block;
		float: none;
		margin-right: 0;
	}

	.data_frame>.info_box {
		display: block;
		overflow: hidden;
		text-align: left;
	}

	#tab_btns>ul {
		flex-direction: column;
		border-bottom: unset;
	}

}


/*----------------------------------

 最優秀賞

 ----------------------------------*/
#award {
	background-color: #fff9eb;
	background-image: url('../img/gold_bottom.gif'), url('../img/gold_bg.gif');
	background-repeat: no-repeat, repeat-y;
	background-size: auto, auto;
	background-position: bottom center, top center;
}

#award .pic_title {
	border-color: #FFE398;
}

#award .data_frame>a {
	width: min(100%, 420px);
}

#award .data_frame>a img {
	width: 100%;
	height: auto;
}


/*----------------------------------

 優秀賞

 ----------------------------------*/
#silverPrize {
	background-color: #f7f8f9;
	background-image: url('../img/silver_bottom.gif'), url('../img/silver_bg.gif');
	background-repeat: no-repeat, repeat-y;
	background-size: auto, auto;
	background-position: bottom center, top center;
}

#silverPrize .data_frame>a {
	width: min(100%, 330px);
}

#silverPrize .data_frame>a img {
	width: 100%;
	height: auto;
}

#silverPrize .data_frame>a img.vPhoto {
	width: revert-layer;
}

.tcRed01 {
	color: #FF3333;
}

/*----------------------------------

/* ベストシーズン賞

 ----------------------------------*/

#best_season {
	background-color: #f6efea;
	background-image: url('../img/bottom-best_season.png'), url('../img/bg-best_season.png');
	background-repeat: no-repeat, repeat-y;
	background-size: auto, auto;
	background-position: bottom center, top center;
}

#best_season .data_frame>a {
	width: min(100%, 330px);
}

#best_season .data_frame>a img {
	width: 100%;
	height: auto;
}


/*----------------------------------

 入選作品

 ----------------------------------*/
#selectedView {}

#selectedView section {
	margin-top: var(--mgn-ll);
}

ul.pict_album {
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-start;
	gap: 10px 20px;
}

ul.pict_album>li {
	width: calc(25% - 15px);
}

ul.pict_album>li>h5 {
	text-align: center !important;
	margin-bottom: 0.25em;
}

ul.pict_album>li>a {
	display: block;
	overflow: hidden;
}

ul.pict_album>li>a>img {
	width: min(100%, 230px);
	height: auto;
}

ul.pict_album.fmv2>li>a {
	height: 142px;
}

ul.pict_album.fmv2>li>a img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}


/* for Sp --------------------*/
@media screen and (max-width:768px) {

	ul.pict_album {
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		gap: 10px 15px;
	}

	ul.pict_album>li {
		width: calc(50% - 15px);
		font-size: var(--txt-s);
	}

	#selectedView .pic_title>span {
		display: block;
		text-align: right;
		float: none;
	}
}


/*----------------------------------

 過去の入選作品一覧

 ----------------------------------*/
#worke_list.box-frame {
	display: flex;
	flex-wrap: wrap;
	gap: 10px 5px;
}

#worke_list.box-frame>.shadow-box {
	flex: initial;
	width: calc(33.3% - 10px);
}

#worke_list.box-frame>.shadow-box a {
	display: block;
	overflow: hidden;
	background-color: #FFFFFF;
	border-radius: 5px;
	text-decoration: none;
}

#worke_list.box-frame>.shadow-box a>img {
	float: left;
	margin-right: 0.5em;
	margin-bottom: 1em;
}

#worke_list.box-frame>.shadow-box a>span {
	display: block;
	overflow: hidden;
	font-weight: 600;
	white-space: nowrap;
	-webkit-text-overflow: ellipsis;
	text-overflow: ellipsis;
}

#worke_list.box-frame>.shadow-box a>p {
	margin: 0 0;
	font-size: var(--txt-s);
	color: #000000;
}

#worke_list.box-frame>.shadow-box a:hover>span {
	text-decoration: underline;
}



/* for Sp --------------------*/
@media screen and (max-width:768px) {

	#worke_list.box-frame {
		gap: 10px 5px;
		flex-direction: column;
	}

	#worke_list.box-frame>.shadow-box {
		width: 100%;
	}

	#worke_list.box-frame>.shadow-box a>span {
		text-decoration: underline;
	}

}