@charset "utf-8";
/* このファイルはUTF-8のBOMなし(UTF-8N)で保存しています */

/**
 * CSS Information
 * ===============================================================
 *
 * Site URL:  http://
 * File name: style.css
 * Summary:   テーマ別スタイル
 * Author:    CrEa., Inc.
 *
 * -----------------------------------
 *
 * TOC:
 *     =1    detail
 *     =2
 *
 * ===============================================================
*/


body {
	background:#00afce;
}
#container {
	background:#00afce url(/assets/yorimichisanpo/theme/ev_20160722/bg.png) 0 bottom repeat-x;
	background-size:100% 100%;
}
#footer{
	background:#004077;
}
#contents #main{
	background:#fffde4;
}

#contents article dl dt{
	background:#ed871f;
}

	/* -- >>> styles for narrow layout ----- */
	@media screen and (max-width: 599px) {
		#contents h2{
			padding:3px 3px 3px 30px;
			background:#0da5c1 url(/assets/yorimichisanpo/theme/ev_20160722/h2_icon_sp.png) 4px 50% no-repeat;
			background-size:16px 16px;
		    border-radius: 3px;
		    -webkit-border-radius: 3px;
		    -moz-border-radius: 3px;
			font-weight:bold;
		    font-size:120%;
		    color:#FFF;
		}

		#contents h3{
			background:#ed871f url(../../../src/default/pc/image/common/h3_icon_sp.png) 5px 50% no-repeat;
			background-size:12px 12px;
			margin-bottom: 15px;
		}

	}

	/* -- >>> styles for medium layout ----- */
	@media screen and (min-width: 600px) and (max-width: 959px) {
		#contents h2{
			padding:3px 3px 3px 32px;
			background:#0da5c1 url(/assets/yorimichisanpo/theme/ev_20160722/h2_icon_sp.png) 4px 50% no-repeat;
			background-size:21px 21px;
		    border-radius: 3px;
		    -webkit-border-radius: 3px;
		    -moz-border-radius: 3px;
			font-weight:bold;
		    font-size:125%;
		    color:#FFF;
		}

		#contents h3{
			background:#ed871f url(../../../src/default/pc/image/common/h3_icon_sp.png) 5px 50% no-repeat;
			background-size:15px 15px;
			margin-bottom: 15px;
		}
	}

	/* -- >>> styles for wide layout ----- */
	@media screen and (min-width: 960px) {
		#contents h2{
			padding:12px 0 12px 45px;
			background:url(/assets/yorimichisanpo/theme/ev_20160722/h2_icon.png) 0 50% no-repeat;
		    color:#8ec31f;
		    font-size:120%;
		    color:#FFF;
		}

		#contents h3{
			margin:0 10px 10px 10px;
			background:#ed871f url(../../../src/default/pc/image/common/h3_icon.png) 10px 50% no-repeat;
			margin-bottom: 15px;
		}
	}


/** =1
 * ========================================
 * detail
 * ========================================
 */

#detail #contents #anchor{
	display:none;
}
#detail #contents #main article.mobile{
	display:none;
}
#detail #contents #main .gmap{
	position: relative;
	padding-bottom: 56.25%;
	padding-top: 30px;
	height: 0;
	overflow: hidden;
}

#detail #contents #main .gmap iframe,
#detail #contents #main .gmap object,
#detail #contents #main .gmap embed {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

	/* -- >>> styles for narrow layout ----- */
	@media screen and (max-width: 599px) {
		#main article dl.map dt{
			width:70px;
			text-align:center;
			clear:both;
		}

	}

	/* -- >>> styles for medium layout ----- */
	@media screen and (min-width: 600px) and (max-width: 959px) {
		#main article dl.map dt{
			width:70px;
			float:left;
			text-align:center;
			clear:both;
		}
		#main article dl.map dd{
			padding:4px 0 4px 100px;
		}
	}

	/* -- >>> styles for wide layout ----- */
	@media screen and (min-width: 960px) {
		#detail #contents #anchor{
			display:block;
			position:relative;
			overflow:hidden;
			padding:5px 0;
		}
		#detail #contents #anchor ul{
			position:relative;
			left:50%;
			float:left;
		}
		#detail #contents #anchor ul li{
			position:relative;
			left:-50%;
			float:left;
			width:175px;
			height:60px;
			margin:0 8px;
		}
		#detail #contents #anchor ul li a{
			display:block;
			width:100%;
			height:auto;
			padding:10px 0;
			text-align:center;
			background:#ed871f;
			color:#FFF;
			text-decoration:none;
			font-weight:bold;
			border-radius:4px;
			-webkit-border-radius:4px;
			-moz-border-radius:4px;
			 box-shadow: 0 0 0 2px #FFF, 0 0 0 4px #ed871f;
		}
		#detail #contents #anchor ul li a:hover{
			background:#FFF;
			color:#ed871f;
		}
		#detail #contents #main article.mobile{
			display:block;
		}
		#detail #main article dl.map dt{
			width:90px;
			float:left;
			text-align:center;
			clear:both;
		}
		#detail #main article dl.map dd{
			padding:4px 0 4px 120px;
		}
	}