﻿@charset "utf-8";

#main_ > article {}
#main_ > article > header {padding:30px 0 0;}
#main_ > article > header > h1 {display:none;}
#main_ > article > header > .image {width:970px; position:relative; margin:0 auto; padding:0 0 60px;}
#main_ > article > header > .image > ul > li:nth-child(n+2)            {display:none;}
#main_ > article > header > .image > ul > li:nth-child(2)              {display:block; position:absolute; top:0; right:-970px;}
#main_ > article > header > .image > ul > li:nth-child(n+3):last-child {display:block; position:absolute; top:0; left:-970px;}
#main_ > article > header > .image ul {}
#main_ > article > header > .image ul > li {margin:0 5px; border-radius:5px; overflow:hidden;}
#main_ > article > header > .image ul > li > a {display:block; position:relative; text-decoration:none;}
#main_ > article > header > .image ul > li img {display:block;}
#main_ > article > header > .image .fac-gallery {}
#main_ > article > header > .image .fac-gallery-nav > button {display:none;}
#main_ > article > header > .image .fac-gallery-nav > ol {bottom:-60px; height:60px;}

@media screen and (max-height:910px) and (min-width:600px) {
#main_ > article > header > .image {width:calc(10px + 1.5 * (100vh - 210px - 60px)); min-width:520px;}
#main_ > article > header > .image > ul > li:nth-child(2)              {right:-calc(10px + 1.5 * (100vh - 210px - 60px));}
#main_ > article > header > .image > ul > li:nth-child(n+3):last-child {left:-calc(10px + 1.5 * (100vh - 210px - 60px));}
}
@media screen and (max-height:960px) and (min-width:600px) {
#main_ > article > header.has-information > .image, 
#main_ > article > header.has-message     > .image  {width:calc(10px + 1.5 * (100vh - 210px - 60px - 50px));}
#main_ > article > header.has-information > .image > ul > li:nth-child(2), 
#main_ > article > header.has-message > .image > ul > li:nth-child(2)                   {right:-calc(10px + 1.5 * (100vh - 210px - 60px - 50px));}
#main_ > article > header.has-information > .image > ul > li:nth-child(n+3):last-child, 
#main_ > article > header.has-message > .image > ul > li:nth-child(n+3):last-child      {left:-calc(10px + 1.5 * (100vh - 210px - 60px - 50px));}
}
@media screen and (max-height:1010px) and (min-width:600px) {
#main_ > article > header.has-information.has-message > .image {width:calc(10px + 1.5 * (100vh - 210px - 60px - 50px - 50px));}
#main_ > article > header.has-information.has-message > .image > ul > li:nth-child(2)              {right:-calc(10px + 1.5 * (100vh - 210px - 60px - 50px - 50px));}
#main_ > article > header.has-information.has-message > .image > ul > li:nth-child(n+3):last-child {left:-calc(10px + 1.5 * (100vh - 210px - 60px - 50px - 50px));}
}

#main_ > article > section {margin:60px 0 0; text-align:left;}
#main_ > article > section > h1 {font-size:2.4rem; font-weight:bold; line-height:1;}
#main_ > article > section ul > li > a {position:relative; text-decoration:none;}

#main_ > article > #information-pickup {margin:0 calc(50% - 50vw); padding:15px calc(50vw - 50%); background:#f2f2f2;}
#main_ > article > #information-pickup ul > li > a::before {background:#f2f2f2;}

#main_ > article > #products {position:relative; margin-left:-120px; margin-right:-120px; padding:0 120px; overflow:hidden;}
#main_ > article > #products::before, 
#main_ > article > #products::after  {display:block; width:120px; content:""; position:absolute; top:0; bottom:0; z-index:2; background:#fff;}
#main_ > article > #products::before {left:0;}
#main_ > article > #products::after  {right:0;}
#main_ > article > #products > h1 {}
#main_ > article > #products ul {
	display:-webkit-flex; display:-ms-flexbox; display:flex; 
	-webkit-flex-wrap:wrap; -ms-flex-wrap:wrap; flex-wrap:wrap; 
	margin:-20px 0 0 -20px; padding:40px 0 0; font-size:1.6rem;}
#main_ > article > #products ul > li {
	-webkit-flex:0 1 270px; -ms-flex:0 1 270px; flex:0 1 270px; 
	margin:20px 0 0 20px;}
#main_ > article > #products ul > li > a {display:block; position:relative; text-decoration:none;}
#main_ > article > #products ul > li .image {}
#main_ > article > #products ul > li .image > img {display:block;}
#main_ > article > #products ul > li h2 {margin:0.8em 0 0; font-weight:normal;}
#main_ > article > #products > .more {display:block; position:absolute; right:120px; top:0; font-size:1.4rem;}
#main_ > article > #products .fac-gallery {width:290px; margin:0 -10px;}
#main_ > article > #products .fac-gallery-list {margin:0;}
#main_ > article > #products .fac-gallery-item {margin:0 10px;}
#main_ > article > #products .fac-gallery-nav > button {width:120px; height:180px; top:40px; z-index:3;}
#main_ > article > #products .fac-gallery-nav > .fac-gallery-previous {left:-110px;}
#main_ > article > #products .fac-gallery-nav > .fac-gallery-next     {right:-980px;}
#main_ > article > #products .fac-gallery-nav > ol {display:none;}

#main_ > article > #information {position:relative;}
#main_ > article > #information > h1 {}
#main_ > article > #information > ul {margin:40px 0 0;}
#main_ > article > #information > .more {display:block; position:absolute; right:0; top:0; font-size:1.4rem;}


@media screen and (max-width:1180px) {
#main_ > article > #information-pickup {margin-left:-20px; margin-right:-20px; padding-left:20px; padding-right:20px;}
}


@media screen and (max-width:599px) {

#main_ > article {}
#main_ > article > header {padding:0;}
#main_ > article > header > h1 {}
#main_ > article > header > .image {width:auto; margin:0 -20px; padding:0;}
#main_ > article > header > .image ul {}
#main_ > article > header > .image ul > li {margin:0; border-radius:0;}
#main_ > article > header > .image ul > li:nth-child(n+2) {}
#main_ > article > header > .image ul > li > a {}
#main_ > article > header > .image ul > li img {width:100%; height:auto;}
#main_ > article > header > .image .fac-gallery {padding:0;}
#main_ > article > header > .image .fac-gallery-item {}
#main_ > article > header > .image .fac-gallery-nav > button {}
#main_ > article > header > .image .fac-gallery-nav > ol {display:none;}

#main_ > article > section {margin:4em 0 0;}
#main_ > article > section > h1 {font-size:1.4rem; font-size:4.375vw;}

#main_ > article > #information-pickup {margin:0 -20px; padding:0;}
#main_ > article > #information-pickup ul > li > a::before {}

#main_ > article > #products {margin-left:-20px; margin-right:-20px; padding:0 20px;}
#main_ > article > #products::before, 
#main_ > article > #products::after  {display:none;}
#main_ > article > #products > h1 {}
#main_ > article > #products ul {margin:-1em -7.5px 0; padding:2em 0 0; font-size:1.2rem; font-size:3.75vw;}
#main_ > article > #products ul > li {
	-webkit-flex:0 1 50%; -ms-flex:0 1 50%; flex:0 1 50%; -ms-flex-preferred-size:calc(50% - 15px); 
	margin:0; padding:1em 7.5px 0; box-sizing:border-box;}
#main_ > article > #products ul > li > a {}
#main_ > article > #products ul > li .image {}
#main_ > article > #products ul > li .image > img {width:100%; height:auto;}
#main_ > article > #products ul > li h2 {margin:0.5em 0 0;}
#main_ > article > #products > .more {right:20px; font-size:1rem; font-size:3.125vw;}
#main_ > article > #products .fac-gallery {width:auto; position:relative; margin:2em 20% 0;}
#main_ > article > #products .fac-gallery::after {display:block; content:""; position:absolute; left:calc(-50% - 20px); right:calc(-50% - 20px); top:0; bottom:0; z-index:1;}
#main_ > article > #products .fac-gallery-slider {position:relative; z-index:2; overflow:visible;}
#main_ > article > #products .fac-gallery-list {
	-webkit-flex-wrap:nowrap; -ms-flex-wrap:nowrap; flex-wrap:nowrap; 
	margin:-1em 0 0; padding:0;}
#main_ > article > #products .fac-gallery-item {
	-webkit-flex:1 1 100%; -ms-flex:1 1 100%; flex:1 1 100%; 
	margin:0;}
#main_ > article > #products .fac-gallery-nav > button {display:none;}
#main_ > article > #products .fac-gallery-nav > .fac-gallery-previous {}
#main_ > article > #products .fac-gallery-nav > .fac-gallery-next     {}
#main_ > article > #products .fac-gallery-nav > ol {}

#main_ > article > #information {}
#main_ > article > #information > h1 {}
#main_ > article > #information > ul {margin:2em 0 0;}
#main_ > article > #information > .more {font-size:1rem; font-size:3.125vw;}
}








