﻿@charset "UTF-8";

/* campaign style
-------------------------------------*/
#campaign.detail #contents h1.title {
	font-size: 28px;
	font-weight: bold;
	line-height: 1.4;
	margin-bottom: 10px;
	}

#main {	
	background: #fff url(/-/Media/coco/common/image/campaign_bg.png) repeat scroll left top;
	overflow: hidden;
	padding-bottom: 50px;
	width: 100%;
	}
	#main_inner {
	    width: 100%;
	    max-width: 1000px;
	    margin: 0 auto;
	    overflow: hidden;
	    position: relative;
	    background: none;
		}
		
#contents{
	width: 70%;
	float: left;
	}
	#contents_inner {
		width: 100%;
		background-color: #fff;
		padding: 35px;
		}
	#contents .read {
	    font-size: 16px;
	    line-height: 1.8;
	    margin-bottom: 30px;
		}	
	

/* mainVisual	 */
.mainVisual_area {
	width: 100%;
	background-color: #fff;
	overflow: hidden;
	margin: 0 auto;
	}
	#mainVisual {
		width: 100%;
		margin: 0 auto 80px;
		position: relative;
		}
		#mainVisual .slider {padding-left: 0;}
		#mainVisual .slider img {
		width: 100%;
		text-align: center;
		}
		#mainVisual a.bx-prev,
		#mainVisual a.bx-next {
			display: block;
			width: 30px;
			height: 30px;
			position: absolute;
			z-index: 100;
			top: 50%;
			margin-top: -15px;
			text-indent: -9999px;
			outline: none;
			}
			#mainVisual .bx-pager {
				float: left;
				position: relative;
				top: 20px;
				left: 50%;
				}
				#mainVisual .bx-pager-item {
					float: left;
					position: relative;
					left: -50%;
					width: 15px;
					height: 15px;
					margin-right: 20px;
					text-indent: -9999px;
					}
					#mainVisual .bx-pager-item a {
						display: block;
						background: url("/-/Media/coco/contents/campaign/detail/image/slider_page01.png") no-repeat left top;
						outline: none;
						background-size: 15px 15px;
						}
					#mainVisual .bx-pager-item a.active {
						background: url("/-/Media/coco/contents/campaign/detail/image/slider_page02.png") no-repeat left top;
						background-size: 15px 15px;
						}
	
/* icon_area */	
#campaign ul.icon_area {
	margin-bottom: 20px;
	overflow: hidden;
	}
	#campaign ul.icon_area li {
		float: left;
		margin: 0 10px 10px 0;
		}
		#campaign ul.icon_area li:last-child {margin-bottom: 0;}
		#campaign ul.icon_area li .category,
		#campaign ul.icon_area li .member {
			padding: 3px 10px;
			border: 1px solid #ccc;
			text-align: center;
			font-size: 14px;
			display: inline-block;
			}
		#campaign ul.icon_area li .member {
			background-color:#005AAC;
			color: #fff;
			}
		
		
/* h3 title */
#campaign.detail #contents h3 {
	font-size: 20px;
	font-weight: bold;
	margin-bottom: 20px;
	padding:5px 0;
	text-indent:0.2em;
	border-top: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
	}
	#campaign.detail #contents h3:before {
		content: url(/-/Media/coco/contents/campaign/detail/image/h3_icon.png) ;
		padding-right: 15px;
		}
		
		
		
/* event report */
#contents .s_midashi {
	font-size: 16px;
	font-weight: bold;
	margin-bottom: 10px;
	padding-left:1em;
	text-indent:-1em;
	}
	#contents .s_midashi:before { 
		content: "■";
		color: #005aac;
		}

#contents .event_read {
	border-top: 1px dashed #cccccc;
	border-bottom: 1px dashed #cccccc;
	margin: 20px auto 30px;
	padding: 20px 0;
	font-size: 16px;
	line-height: 1.8;
	}

#contents .event_cat {
	overflow: hidden;
	margin-bottom: 60px;
	}
#contents .event_cat.arrow_no {margin-bottom: 0;}
	
	#contents .event_cat:after {
	    content: url(/-/Media/coco/contents/campaign/detail/image/event01/section_arrow.png);
	    display: block;
	    position: relative;
	    text-align: center;
		}	
	#contents .event_cat.arrow_no:after {
	    content: "";
	    display: block;
	    position: relative;
	    text-align: center;
		}	
	#contents .time_title {
		background: url(/-/Media/coco/contents/campaign/detail/image/event01/border.png) no-repeat scroll left bottom;
		padding-bottom: 30px;
		margin-bottom: 20px;
		}
		#contents .time_title .time_title_icn {
			display: inline-block;
			vertical-align: middle;
			width: 12%;
			margin: 0 2% 0 0;
			}
		#contents .time_title .time_title_txt {
			display: inline-block;
			vertical-align: middle;
			font-size: 22px;
			font-weight: bold;
			line-height: 1.4;
			width: 85%;
			}

#contents .time_title02 {
	background: url(/-/Media/coco/contents/campaign/detail/image/fr_601/border_y.png) no-repeat scroll left bottom;
	padding-bottom: 25px;
	margin-bottom: 20px;
	font-size: 22px;
	font-weight: bold;
	line-height: 1.4;
	}
#contents .time_title03 {
	background: url(/-/Media/coco/contents/campaign/detail/image/fr_630/boder_p.png) no-repeat scroll left bottom;
	padding-bottom: 25px;
	margin-bottom: 20px;
	font-size: 22px;
	font-weight: bold;
	line-height: 1.4;
	}
#contents .time_title04 {
	background: url(/-/Media/coco/contents/campaign/detail/image/fr_1264/boder_p.png) no-repeat scroll left bottom;
	padding-bottom: 25px;
	margin-bottom: 20px;
	font-size: 22px;
	font-weight: bold;
	line-height: 1.4;
	}

	#contents .txt_box {margin-bottom: 40px;}
	#contents .txt_box02 {
		margin-bottom: 40px;
		padding: 30px;
		background: #fafadb;
		overflow: hidden;
		border-radius:10px;
		}
		#contents .event_img {
			float: left;
			width: 38%;
			margin: 0 4% 0 0;
			}
		#contents .event_img_read {
			float: left;
			margin: 10px 0 0 0;
			font-size: 12px;
			}
			
		#contents .event_txt_box {
			float: left;
			width: 58%;
			}
		#contents .event_txt {
			font-size: 14px;
			width: 100%;
			line-height: 1.8;
			overflow: hidden;
			}
			#contents .event_menu {
				background: #fbf9e7;
				padding: 15px;
				overflow: hidden;
				margin: 20px auto;
				}
				#contents .event_menu > dt {
					font-size: 14px;
					font-weight: bold;
					margin-bottom: 5px;
					}
				#contents .event_menu > dd {
					font-size: 14px;
					margin-bottom: 10px;
					line-height: 1.8;
					padding-left:1em;
					text-indent:-1em;
					}
				#contents .event_menu > dd:before { 
					content: "●";
					color: #ef3551;
					}
					
#contents .event_voice {
	padding: 4%;
	background: #fafadb;
	overflow: hidden;
	clear: both;
	margin: 0 auto 20px;
	}
	#contents .event_voice .event_voice_title {
		color: #ef3551;
		font-size: 28px;
		font-weight: bold;
		text-align: center;
		margin: 0 auto 10px;
		}
	#contents .event_voice .event_voice_title:before {
		content: url(/-/Media/coco/contents/campaign/detail/image/event01/voice_icon.png);
		margin-right: 10px;
		}
	#contents .event_voice .event_voice_txt {
		float: left;
		width: 50%;
		margin-right: 4%;
		font-size: 14px;
		}
	#contents .event_voice .event_voice_img {
		width: 46%;
		float: left;
		}
	#contents .impressions_title {
		font-size: 22px;
		font-weight: bold;
		color: #ef3551;
		text-align: center;
		margin-bottom: 20px;
		}
	#contents .impressions_txt {
		font-size: 16px;
		text-align: center;
		margin-bottom: 30px;
		}
	#contents .event_btn {
		text-align: center;
		}
	#contents .event_btn02 {
		text-align: center;
		margin: 0 auto 30px;
		}
	#contents .marker_lime {
		background: linear-gradient(transparent 60%, #fef668 60%);
		}

/* キャンペーン終了 */	
.campaign_end {
    border: 4px solid #ff0000;
    text-align: center;
    padding: 20px;
    color: #ff0000;
    font-size: 20px;
    font-weight: bold;
    width: 100%;
    max-width: 1000px;
    margin: 0 auto 40px;
    line-height: 1.4;
    background: #fff;
}




/*
#campaign.detail #contents .link {
	font-size: 20px;
	overflow: hidden;
	}	
#campaign.detail #contents .link:after {
	content: "";
	background: url(/-/Media/coco/contents/campaign/detail/image/arrow.png) no-repeat right center;
	background-size: 10px;
	padding-right: 25px;
	}
	#campaign.detail #contents .link a {text-decoration: underline;}
	#campaign.detail #contents .link a:hover {text-decoration: none;}
#contents div.btn {
    clear: both;
    margin: 40px auto;
    width: 300px;
	}	
#contents div.btn img{width: 100%;}
#contents .txtarea {
	padding: 20px;
	font-size: 16px;
	line-height: 1.8;
	}
*/



/* ▼▼▼ 768px
=====================================*/
@media screen and (max-width: 768px) {

/* campaign style
-------------------------------------*/
#campaign.detail #contents h1.title {
	font-size: 5vw;
	font-weight: bold;
	line-height: 1.6;
	}

#main {	
	overflow: hidden;
	padding-bottom: 0;
	width: 100%;
	}	
	#main_inner {
		width: 100%;
		margin: 0 auto;
		overflow: hidden;
		}

#contents {
	width: 100%;
	float: none;
	margin: 20px auto 0;
	overflow: hidden;
	}
	#contents_inner {
		width: 90.6vw;
		background-color: #fff;
		padding: 20px 15px;
		margin: 0 auto;
		}
	#contents .read {
	    font-size: 4.37vw;
	    margin-bottom: 20px;
		}


/* icon_area */	
#campaign ul.icon_area li .category,
#campaign ul.icon_area li .member {
	font-size: 4.06vw;
	}

/* h3 title */
#campaign.detail #contents h3 {
	font-size: 4.37vw;
	margin-bottom: 20px;
	padding:5px 0;
	text-indent:0.2em;
	}
	#campaign.detail #contents h3:before {
		content: url(/-/Media/coco/contents/campaign/detail/image/h3_icon.png) ;
		padding-right: 15px;
		}


/* mainVisual	 */
.mainVisual_area {
	width: 100%;
	background-color: #fff;
	overflow: hidden;
	}
#mainVisual {
	width: 100%;
	max-width: 100%;
	margin: 0 auto 80px;
	position: relative;
	}
	#mainVisual .slider {padding-left: 0;}
	#mainVisual a.bx-prev,
	#mainVisual a.bx-next {
		display: block;
		width: 30px;
		height: 30px;
		position: absolute;
		z-index: 100;
		top: 50%;
		margin-top: -15px;
		text-indent: -9999px;
		outline: none;
		}
		#mainVisual .bx-pager {
			float: left;
			position: relative;
			top: 20px;
			left: 50%;
			}
			#mainVisual .bx-pager-item {
				float: left;
				position: relative;
				left: -50%;
				width: 10px;
				height: 10px;
				margin-right: 20px;
				text-indent: -9999px;
				}
				#mainVisual .bx-pager-item a {
					display: block;
					background: url("/-/Media/coco/contents/campaign/detail/image/slider_page01.png") no-repeat left top;
					outline: none;
					background-size: 10px 10px;
					}
				#mainVisual .bx-pager-item a.active {
					background: url("/-/Media/coco/contents/campaign/detail/image/slider_page02.png") no-repeat left top;
					background-size: 10px 10px;
					}





/* event report */
#contents .s_midashi {
	font-size: 4.06vw;
	font-weight: bold;
	margin-bottom: 10px;
	}

#contents .event_read {
	border-top: 1px dashed #cccccc;
	border-bottom: 1px dashed #cccccc;
	margin: 20px auto 30px;
	padding: 20px 0;
	font-size: 4.375vw;
	line-height: 1.8;
	}

#contents .event_cat {
	overflow: hidden;
	margin-bottom: 30px;
	}
	#contents .event_cat:after {
	    content: url(/-/Media/coco/contents/campaign/detail/image/event01/section_arrow.png);
	    display: block;
	    position: relative;
	    text-align: center;
		}	
	#contents .time_title {
		background: rgba(0, 0, 0, 0) url(/-/Media/coco/contents/campaign/detail/image/event01/border.png) no-repeat scroll left bottom;
		padding-bottom: 30px;
		margin-bottom: 20px;
		}
		#contents .time_title .time_title_icn {
			display: inline-block;
			vertical-align: middle;
			width: 15%;
			margin: 0 3% 0 0;
			}
		#contents .time_title .time_title_txt {
			display: inline-block;
			vertical-align: middle;
			font-size: 4.37vw;
			font-weight: bold;
			line-height: 1.4;
			width: 80%;
			}
			
#contents .time_title02,
#contents .time_title03,
#contents .time_title04 {
	font-size: 4.37vw;
	line-height: 1.4;
	}


	#contents .txt_box {margin-bottom: 20px;}
	#contents .txt_box02 {
		margin-bottom: 20px;
		padding: 20px;
		border-radius:10px;
		}
		#contents .event_img {
			float: none;
			width: 100%;
			margin: 0 0 10px 0;
			}
		#contents .event_img_read {
			float: none;
			margin: 10px 0 0;
			font-size: 3.75vw;
			display: block;
			}
			
			
			#contents .event_img img {width: 100%;}
			
			
		#contents .event_txt_box {
			float: none;
			width: 100%;
			}
		#contents .event_txt {
			font-size: 4.37vw;
			width: 100%;
			line-height: 1.8;
			overflow: hidden;
			}
			#contents .event_menu {
				background: #fbf9e7;
				padding: 15px;
				overflow: hidden;
				margin: 20px auto;
				}
				#contents .event_menu > dt {
					font-size: 4.06vw;
					font-weight: bold;
					margin-bottom: 5px;
					}
				#contents .event_menu > dd {
					font-size: 4.06vw;
					margin-bottom: 10px;
					line-height: 1.8;
					padding-left:1em;
					text-indent:-1em;
					}
				#contents .event_menu > dd:before { 
					content: "●";
					color: #ef3551;
					}
#contents .event_voice {
	padding: 4%;
	margin: 0 auto 20px;
	}
	#contents .event_voice .event_voice_title {
		font-size: 4.37vw;
		margin: 0 auto 10px;
		}
	#contents .event_voice .event_voice_title:before {
	    content:" ";
	    display:inline-block;
	    width:27px;
	    height:16px;
	    background:url(/-/Media/coco/contents/campaign/detail/image/event01/voice_icon.png)no-repeat scroll left top;    
	    background-size:contain;
	    vertical-align:middle;
		}		
	#contents .event_voice .event_voice_txt {
		float: none;
		width: 100%;
		margin: 0 auto 10px;
		font-size: 4.37vw;
		}
	#contents .event_voice .event_voice_img {
		width: 100%;
		float: none;
		}
	#contents .event_voice .event_voice_img img {width: 100%;}
		
	#contents .impressions_title {
		font-size: 4.06vw;
		font-weight: bold;
		color: #ef3551;
		text-align: center;
		margin-bottom: 10px;
		}
	#contents .impressions_txt {
		font-size: 4.06vw;
		text-align: center;
		margin-bottom: 20px;
		}
	#contents .event_btn {
		text-align: center;
		}
	#contents .event_btn02 {
		text-align: center;
		margin: 0 auto 20px;
		}


/* キャンペーン終了 */	
.campaign_end {
	border: 2px solid #ff0000;
	padding: 15px;
	font-size: 1rem;
	width: 100%;
	margin: 0 auto 20px;
	}	



}			