

/* === MEDIA QUERIES - FULL SCREEN */
@media only screen and (min-width: 1000px) {



	/* SLICK FULL SCREEN SLIDES */
	.fs-slides-ratio {height: 0; padding-bottom: 38.45%; width: 100%; margin-bottom: 1%;}
	.fs-top-ratio {padding-bottom: 1%; width: 100%; background-position: center top; background-repeat: no-repeat; background-size: contain;}
	
	.fs-top-inner {max-width: 80%; margin: 0 auto; position: relative; padding: 0 0px 36%;}
	.fs-top-copy {position: absolute; bottom: 0; left 0; max-width: 450px;}
	.fs-top-cap {font-size: 300%;  margin-bottom: 20px;}
		.fs-slider .slick-prev:before, .fs-slider .slick-next:before {color: #000;}
		.fs-slider .slick-slide {transition: all ease-in-out .3s; opacity: .2;}
		.fs-slider .slick-active {opacity: .5;}
		.fs-slider .slick-current {opacity: 1;}
			
			.fs-slider .slick-prev, .fs-slider .slick-next {font-size: 0; line-height: 0; position: absolute; top: 50%; display: block; width: 44px !important; height: 40px !important; padding: 4px; -webkit-transform: translate(0, -50%);  -ms-transform: translate(0, -50%); transform: translate(0, -50%); cursor: pointer; color: transparent; border: none; outline: none; background: transparent; }
			
			.fs-slider .slick-prev:hover, .fs-slider .slick-prev:focus, .fs-slider .slick-next:hover, .fs-slider .slick-next:focus {color: transparent; outline: none; background: transparent; overflow: visible !important;}
			
			.fs-slider .slick-prev:hover:before, .fs-slider .slick-prev:focus:before, .fs-slider .slick-next:hover:before, .fs-top-ratio .slick-next:focus:before{opacity: 1;}
			
			.fs-slider .slick-prev.slick-disabled:before, .fs-slider .slick-next.slick-disabled:before {opacity: .25;}
			
			.fs-slider .slick-prev:before, .fs-slider .slick-next:before {font-family: 'slick'; font-size: 40px !important; line-height: 1; opacity: .75; color: white; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-shadow:0 0 5px #000, 0 0 2px #000;}
			
			.fs-slider .slick-prev {left: 25px !important; z-index: 10 !important;}
				.fs-slider [dir='rtl'] .slick-prev {right: 25px !important; left: auto !important;}
			.fs-slider .slick-next {right: 28px  !important;}
				.fs-slider [dir='rtl'] .slick-next {right: auto !important; left: 28px !important;}				
		
		.fs-top-inner {color: #fff; text-shadow:0 0 10px #000, 0px 0px 3px #000;;}
		
		.fs-top-inner button {background-color: #666; border: 2px solid #666; color: #fff; padding: 10px 24px; text-align: center; text-decoration: none; display: inline-block; font-size: 18px; margin: 4px 2px 20px; cursor: pointer; text-shadow:0 0 10px #000; box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,0.19);}
		
		.fs-top-inner button:hover {background-color: #ce0e2d; border: 2px solid #ce0e2d; color: #fff; text-shadow: none;}
	
}

/* === MEDIA QUERIES - TABLET */
@media only screen and (min-width: 510px) and (max-width: 999px) {

	/* SLICK FULL SCREEN SLIDES */
	.fs-slides-ratio {height: 0; padding-bottom: 38.45%; width: 100%; margin-bottom: 1%;}
	.fs-top-ratio {padding-bottom: 1%; width: 100%; background-position: center top; background-repeat: no-repeat; background-size: contain;}
	.fs-top-inner {max-width: 100%; margin: 0 auto; position: relative; padding: 0 10px 36%;}
	.fs-top-copy {position: absolute; bottom: -20px; left 0; max-width: 54.7%;}
	.fs-top-cap {font-size: 190%; margin-bottom: 20px;}
		.fs-slider .slick-prev:before, .fs-slider .slick-next:before {color: #000;}
		.fs-slider .slick-slide {transition: all ease-in-out .3s; opacity: .2;}
		.fs-slider .slick-active {opacity: .5;}
		.fs-slider .slick-current {opacity: 1;}
			.fs-slider .slick-prev, .fs-slider .slick-next {display: none !important;}
		.fs-top-inner {color: #fff; text-shadow: 0px 0px 5px #000, 0px 0px 1px #000, 0px 0px 1px #000;}
		.fs-top-inner button {background-color: #ce0e2d; border: 1px solid #fff; color: #fff; padding: 0 8px; text-align: center; text-decoration: none; display: inline-block; font-size: 18px; margin: 4px 2px 20px; cursor: pointer; text-shadow:0 0 10px #000; box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,0.19);}
		.fs-top-inner button:hover {background-color: #666; border: 1px solid #fff; color: #fff; text-shadow: none;}
		
}


/* === MEDIA QUERIES - HANDHELD */
@media only screen and (max-width: 509px) {

	/* SLICK FULL SCREEN SLIDES */
	.fs-slides-ratio {height: 0; padding-bottom: 38.45%; width: 100%; margin-bottom: 1%;}
	.fs-top-ratio {padding-bottom: 1%; width: 100%; background-position: center top; background-repeat: no-repeat; background-size: contain;}
	.fs-top-inner {max-width: 100%; margin: 0 auto; position: relative; padding: 0 10px 36%;}
	.fs-top-copy {position: absolute; bottom: -20px; left 0; max-width: 55%;}
	.fs-top-cap {font-size: 100%;  margin-bottom: 10px;}
		.fs-slider .slick-prev:before, .fs-slider .slick-next:before {color: #000;}
		.fs-slider .slick-slide {transition: all ease-in-out .3s; opacity: .2;}
		.fs-slider .slick-active {opacity: .5;}
		.fs-slider .slick-current {opacity: 1;}
			.fs-slider .slick-prev, .fs-slider .slick-next {display: none !important;}
		.fs-top-inner {color: #fff; text-shadow: 0px 0px 5px #000, 0px 0px 1px #000, 0px 0px 2px #000;}
		.fs-top-inner button {background-color: #ce0e2d; border: 1px solid #fff; color: #fff; padding: 5px 7px 5px 12px; text-align: center; text-decoration: none; display: inline-block; font-size: 14px; margin: 4px 2px 20px; cursor: pointer; text-shadow:0 0 10px #000; box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,0.19);}
		.fs-top-inner button:hover {background-color: #666; border: 1px solid #fff; color: #fff; text-shadow: none;}
			.fs-top-copy button .fa {display: none;}

}







/* === MEDIA QUERIES - PRINT */
@media print {


	.notice-banner {max-width: 100%;}
	.notice-container {max-width: 800px; margin: 0 auto; padding: 5px 5px;}
	.notice-container div {vertical-align: middle;}
		.nb-default, .nb-snow, .nb-rain {background: #fff;}
		.nb-color {padding:10px 20px 10px 10px; color: #000;}


	/* HIDE */
	.fs-slides-ratio, .fs-slider, .mid-layer-v, #news-l {display: none !important;}
		
	#mid-full {width: 100%; margin: 0; padding: 0; background: #fff; position: relative;}
	
	#left-nav-off {}
		.left-nav-off #left-nav {display: none !important;}
		.left-nav-off #mid-fixer {max-width: 100%; margin: 0 auto; padding: 0;}
		.left-nav-off #mid-wrap-full {width: 100%; margin: 0; padding: 0; clear: both;}
	#left-nav-on {}
		.left-nav-on #left-nav {width: 22%; float: left; padding: 41px 0 0 1%; background: #ccc; position: relative;}
		.left-nav-on #mid-fixer {max-width: 975px; margin: 0 auto; padding: 0;}
		.left-nav-on #mid-fixer {width: 100%;}
		.left-nav-on #mid-wrap-full {width: 77%; float: right; margin-bottom: 0px; position: relative; min-height: 400px;}

	.feat-icons-inner {max-width: 975px; margin: 5px auto 0;}
	.feat-icons-sp span {font-size: 240%;}
		.feat-icons-sp a	{text-decoration: none; color: #000; display: block;}	
		.feat-icons-sp {float: left; width: 20%; text-align: center;}

	.mid-layer-head {text-align: center; font-size: 160%; font-weight: bold; margin: 0 0 35px;}
	
	.mid-layer {width: 100%; margin: 0; padding: 25px 0; position: relative;}

	.mid-layer button {background-color: #666; border: 2px solid #666; color: #fff; padding: 8px 12px; text-align: center; text-decoration: none; display: inline-block; font-size: 18px; margin: 15px 2px 0; cursor: pointer; text-shadow:0 0 10px #000; box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,0.19);}
	.mid-layer button:hover {background-color: #ce0e2d; border: 2px solid #ce0e2d; color: #fff; text-shadow: none;}
	
	.mid-layer-icon-box {width: 33.3%; float: left; text-align: center;}
	.mid-layer-icon-box img {width: 180px; height: auto;}
	.mid-layer-icons {width: 100%; margin: 0; padding: 25px 0; position: relative;}
	
	#footer-full {max-width: 100%; margin: 0; clear: both;}
	#footer-inner {width: 100%; text-align: center;}
	#footer-inner hr {display: none !important;}
		#footer-box {max-width: 975px; margin: 0 auto;}
		#footer-box b {font-size: 120%;}
		#footer-box a {color: #000; text-decoration: none;}
	#footer-inner .child-1 {line-height: 24px; color: #000; margin: 5px 0 0;}
	#footer-inner .child-2 {line-height: 24px; color: #000; margin: 0 auto; }

	#footer-gray-stripe {display: none !important;}

	.sm-square {width: 100%; color: #000; margin: 0 0 20px; text-align: left; clear: both; background-image: none !important;}
	.sm-icon {display: none !important;}

}








	
	
