@charset "UTF-8";
/*******************************************************************/
/* PC */
/*******************************************************************/
@media screen and (min-width: 769px) {
	/*<start>==========================================================*/
	/*=================================================================*/
	/*	mainvisual */
	/*=================================================================*/
	.mv_area{
		padding-top: 110px;
	}
	.mv{
		background: #000;
	}
	.mv .slick-slider{
		max-width: 1300px;
		margin: 0 auto;
		width: 100%;
	}
	/*=================================================================*/
	/*	banner */
	/*=================================================================*/
	#banner {
		width: 100%;
		padding: 25px 0;
		background-color: #f3edea;
	}
	#banner ul {
		width: 100%;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-pack: center;
		-ms-flex-pack: center;
		justify-content: center;
	}
	#banner ul li {
		width: 100%;
		max-width: 480px;
		margin-right: 26px;
	}
	#banner ul li a {
		display: block;
	}
	#banner ul li a img {
		width: 100%;
		height: auto;
	}
	#banner ul li:last-child {
		margin-right: 0;
	}
	#banner .pc_banner .fs-pt-carousel__slide{
		width: 95% !important;
		max-width: 480px !important;
		margin:0 1% !important;
		height: auto !important;
	}
	#banner .pc_banner .fs-pt-carousel__slide a img{
		width: 100% !important;
	}

	/*=================================================================*/
	/*	h1 */
	/*=================================================================*/
	h1 {
		font-family: "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", Hiragino Mincho ProN, "メイリオ", Meiryo, "ＭＳ Ｐ明朝", "MS PMincho", serif;
		font-weight: bold;
		font-size: 3.6rem;
		margin: 0 auto 64px;
		text-align: center;
		color: #333;
	}
	h1 span.h1_line {
		display: block;
		width: 32px;
		height: 2px;
		background-color: #333;
		margin: 25px auto;
	}
	h1 span {
		font-family: "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Hiragino Sans, "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
		font-weight: normal;
		font-size: 1.8rem;
	}
	/*=================================================================*/
	/*	recommend */
	/*=================================================================*/
	#recommend {
		padding: 84px 0 134px;
		background: url(../images/top/bg_recommends.jpg) no-repeat 0 358px;
		background-size: cover;
	}
	#recommend .fs-c-productListItem__imageContainer{
		height: 214px;
		overflow: hidden;
		position: relative;
	}
	#recommend .fs-c-productListItem__imageContainer .fs-c-productListItem__image{
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%,-50%);
		width: 100%;
		height: auto;
	}
	.recommends_list{
		width: 100%;
	} 

	/*=================================================================*/
	/*	Recent News */
	/*=================================================================*/
	#news {
		padding: 84px 0 134px;
		background: #f1efe5;
	}
	#news ul.news_list{
		width: 800px;
		margin: 0 auto 10px;
	}
	#news ul.news_list li{
		border: none;
	}
	#news ul.news_list li a{
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		align-items: flex-start;
		width: 100%;
	}
	#news ul.news_list li a time{
		background: none;
    color: #333;
    font-weight: bold;
    width: inherit;
    display: block;
    max-width: 152px;
	}
	/*<end>============================================================*/
}

/*******************************************************************/
/* SP */
/*******************************************************************/
@media screen and (max-width: 768px) {
	/*<start>==========================================================*/
	/*=================================================================*/
	/*	mainvisual */
	/*=================================================================*/
	#mainVisual {
		position: relative;
		width: 100%;
	}
	#mainVisual ul li {
		max-width: 100%;
		max-height: calc(100% - 170px);
		height: calc(100vh - 170px);
		margin: 0 auto;
	}
	#mainVisual ul li.list01 {
		background: url(../images/top/main01.jpg) no-repeat center;
		background-size: cover;
	}
	#mainVisual .mv_text {
		position: absolute;
		display: block;
		top: 50%;
		left: 50%;
		-webkit-transform: translate(-50%, -50%);
		transform: translate(-50%, -50%);
		z-index: 10;
		width: 100%;
	}
	#mainVisual .scroll {
		position: absolute;
		bottom: 0;
		right: 40px;
		z-index: 100;
	}
	#mainVisual .scroll .scroll_txt {
		font-weight: bold;
		-webkit-writing-mode: vertical-rl;
		-moz-writing-mode: vertical-rl;
		-ms-writing-mode: tb-rl;
		-ms-writing-mode: vertical-rl;
		writing-mode: vertical-rl;
		max-height: 3em;
		-webkit-animation: 3.0s tateS ease-in-out infinite alternate;
		-moz-animation: 3.0s tateS ease-in-out infinite alternate;
		-ms-animation: 3.0s tateS ease-in-out infinite alternate;
		animation: 3.0s tateS ease-in-out infinite alternate;
	}
	#mainVisual .scroll .scroll_line {
		display: block;
		width: 1px;
		height: 80px;
		background-color: #333;
		margin: 10px 0 0 12px;
	}
	@keyframes tateS {
		0% {
			transform: translateY(-8px);
		}
		50% {
			transform: translateY(8px);
		}
		100% {
			transform: translateY(-8px);
		}
	}
	/*=================================================================*/
	/*	banner */
	/*=================================================================*/
	#banner {
		width: 100%;
		height: 90px;
		padding-top: 10px;
		background-color: #f3edea;
		text-align: center;
	}
	#banner ul {
		width: 80%;
		margin: 0 auto;
	}
	#banner ul li {
		max-width: 480px;
	}
	#banner ul li a {
		display: block;
	}
	#banner ul li a img {
		width: 100%;
		height: auto;
		margin: 0 auto;
	}
	/*#banner .slick-prev::before {
		content: "";
		display: block;
		background: url(../images/union/arrow_prev.jpg) no-repeat center;
		width: 24px;
		height: 24px;
		background-size: cover;
	}
	#banner .slick-next::before {
		content: "";
		display: block;
		background: url(../images/union/arrow_next.jpg) no-repeat center;
		width: 24px;
		height: 24px;
		background-size: cover;
	}
	#banner .slick-prev {
		left: -24px;
	}
	#banner .slick-next {
		right: -20px;
	}*/
	#banner .pc_banner .fs-pt-carousel__slide{
		width: 100% !important;
		max-width: 480px !important;
		margin:0 1% !important;
		height: auto !important;
	}
	#banner .pc_banner .fs-pt-carousel__slide a img{
		width: 100% !important;
	}
	/*=================================================================*/
	/*	h1 */
	/*=================================================================*/
	h1 {
		font-family: "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", Hiragino Mincho ProN, "メイリオ", Meiryo, "ＭＳ Ｐ明朝", "MS PMincho", serif;
		font-weight: bold;
		font-size: 3.6rem;
		margin: 0 auto 64px;
		text-align: center;
		color: #333;
	}
	h1 span.h1_line {
		display: block;
		width: 32px;
		height: 2px;
		background-color: #333;
		margin: 20px auto 15px;
	}
	h1 span {
		font-family: "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Hiragino Sans, "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
		font-weight: normal;
		font-size: 1.8rem;
	}
	/*=================================================================*/
	/*	recommend */
	/*=================================================================*/
	#recommend {
		padding: 84px 0 50px;
	}
	.recommends_list {
		width: 346px;
	}
	/*=================================================================*/
	/*	Recent News */
	/*=================================================================*/
	#news {
		padding: 84px 0 50px;
		background: #f1efe5;
	}
	#news ul.news_list {
		width: 90%;
		margin: 0 auto 10px;
	}
	#news ul.news_list li{
		border: none;
	}
	#news ul.news_list li a time{
		font-size: 1.4rem;
		background: none;
		color: #333;
		font-weight: bold;
		display: block;
		margin: 0 0 10px;
	}
	/*<end>============================================================*/
}