@font-face {
  font-family: "mplus";
  src: url("/product/closeup/assets/font/mplus/mplus-1p-thin.woff") format("woff"), url("/product/closeup/assets/font/mplus/mplus-1p-thin.ttf") format("truetype");
  font-weight: 200; }
@font-face {
  font-family: "mplus";
  src: url("/product/closeup/assets/font/mplus/mplus-1p-light.woff") format("woff"), url("/product/closeup/assets/font/mplus/mplus-1p-light.ttf") format("truetype");
  font-weight: 300; }
@font-face {
  font-family: "mplus";
  src: url("/product/closeup/assets/font/mplus/mplus-1p-regular.woff") format("woff"), url("/product/closeup/assets/font/mplus/mplus-1p-regular.ttf") format("truetype");
  font-weight: 400; }
@font-face {
  font-family: "mplus";
  src: url("/product/closeup/assets/font/mplus/mplus-1p-medium.woff") format("woff"), url("/product/closeup/assets/font/mplus/mplus-1p-medium.ttf") format("truetype");
  font-weight: 500; }
@font-face {
  font-family: "mplus";
  src: url("/product/closeup/assets/font/mplus/mplus-1p-bold.woff") format("woff"), url("/product/closeup/assets/font/mplus/mplus-1p-bold.ttf") format("truetype");
  font-weight: 700; }



@font-face {
  font-family: 'Material Icons';
  font-style: normal;
  font-weight: 400;
  src: url(/product/closeup/assets/font/iconfont/MaterialIcons-Regular.eot); /* For IE6-8 */
  src: local('Material Icons'),
       local('MaterialIcons-Regular'),
       url(/product/closeup/assets/font/iconfont/MaterialIcons-Regular.woff2) format('woff2'),
       url(/product/closeup/assets/font/iconfont/MaterialIcons-Regular.woff) format('woff'),
       url(/product/closeup/assets/font/iconfont/MaterialIcons-Regular.ttf) format('truetype');
}
.material-icons {
  font-family: 'Material Icons';
  font-weight: normal;
  font-style: normal;
  font-size: 24px; /*inherit*/
  line-height: 1; /*inherit*/
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  text-rendering: optimizeLegibility;
  -webkit-font-feature-settings: 'liga';
     -moz-font-feature-settings: 'liga';
          font-feature-settings: 'liga';
  -webkit-font-smoothing: antialiased;
}

i.material-icons.home:before { content: "\e88a";  font-size: inherit; line-height: 1; vertical-align: -22%; margin-right: 5px; }

i.material-icons.archive:before { content: "\e03b";  font-size: inherit; line-height: 1; vertical-align: -24%; margin-right: 5px; }

i.material-icons.link:after { content: "\e315";  font-size: inherit; line-height: 1; vertical-align: -28%;}

i.material-icons.totop:before { content: "\e25a";  font-size: inherit; line-height: 1; vertical-align: ; margin-right: 5px; }

.rotate-270 {
  -webkit-transform: rotate(270deg);
  -moz-transform: rotate(270deg);
  -ms-transform: rotate(270deg);
  -o-transform: rotate(270deg);
  transform: rotate(270deg);
  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
}

@media screen and (orientation: landscape) {
   /* 横向きの場合のスタイル */
  .landscape { display: block !important; }
  .portrait { display: none !important; }
}
@media screen and (orientation: portrait) {
   /* 縦向きの場合のスタイル */
  .landscape { display: none !important; }
  .portrait { display: block !important; }
}

.row {
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 0;
  margin-top: 0;
  width: 100%;
}

.slider_limit { width: 100%; margin: 0 auto;}
.slider_negative_m {margin-top: -60px !important;}
@media screen and (min-width:47.938em){
.slider_limit { max-width: 70%; margin: 0 auto;}
.slider_negative_m {margin-top: -120px !important;}
}


  .archive-content .divider{height: 1px !important; background: #000 !important;}
  .archive-content p {color: #fff !important;}
  .archive-content p a {color: #fff !important;}
  .archive-content p a:hover { text-decoration: underline !important;}


#intro_title { position: relative; padding: 15% 0 6% 0; background: ; }
#intro_product { position: relative; }
#intro_caption { position: relative; padding: 5% 0 0 0; background: ; }
#recipe_container { position: relative; padding: 5% 0 0 0; height: ; background: #ff0; overflow: scroll;}
.recipe_menu { position: absolute; top:0; left: 0; width: 200%; z-index: 10;}
.recipe_shade {position: absolute; top:0; left: 0; z-index: 20;}
#video_poster { position: relative; padding: 5% 0 0 0; background: ; }
#howto { font-size: 1.3em; text-decoration: underline; line-height: 1; color: #ddd; text-shadow: 1px 1px 5px rgba(255,255,255,.6), -1px -1px 5px rgba(255, 255, 255, .6); font-weight: 500; text-align: right;}
#howto a { color: #ddd; text-shadow: 1px 1px 5px rgba(255,255,255,.6), -1px -1px 5px rgba(255, 255, 255, .6);}
#second_caption { position: relative; padding: 12% 0 5% 0; background: ; }

#animation { position: relative; height: 400vh;}
#animation_container { position: absolute; top:0; left:0; height: ; z-index: 10;}
#trigger_container { position: absolute; top:0; left:0; height: ; z-index: 100;}

#triggerA { position: relative; width: 100%; height: 100vh; top:0; left: 0; z-index: 100; border: 0px red solid; }
#triggerB { position: relative; width: 100%; height: 100vh; top:0; left: 0; z-index: 100; border: 0px blue solid; }
#triggerC { position: relative; width: 100%; height: 100vh; top:0; left: 0; z-index: 100; border: 0px green solid; }
#triggerD { position: relative; width: 100%; height: 100vh; top:0; left: 0; z-index: 100; border: 0px #fb5fd6 solid; }

#products_caption_A { position: absolute; width: 70%; top:15%; left: 15%; z-index: 40; opacity: 0; }
#products_caption_B { position: absolute; width: 70%; top:15%; left: 15%; z-index: 40; opacity: 0; }
#products_caption_C { position: absolute; width: 70%; top:15%; left: 15%; z-index: 40; opacity: 0; }

#products_shade_A { position: absolute; width: 100%; top:20vh; left: 0%; z-index: 35; }
#products_futa_A { position: absolute; width: 100%; top:20vh; left: 0%; z-index: 30; }
#products_shade_B { position: absolute; width: 100%; top:20vh; left: 0%; z-index: 25; }
#products_futa_B { position: absolute; width: 100%; top:20vh; left: 0%; z-index: 20; }
#products_shade_C { position: absolute; width: 100%; top:20vh; left: 0%; z-index: 15; }
#products_shade_D { position: absolute; width: 100%; top:20vh; left: 0%; z-index: 12; }
#products_shade_E { position: absolute; width: 100%; top:20vh; left: 0%; z-index: 12; }
#products_body { position: relative; width: 100%; margin-top: 20vh; z-index: 10; }
#products_bodyparts { position: absolute; width: 100%; top: 20vh; z-index: 11; }

#products01 { padding: 10% 0 0 0;}
#products02 { padding: 5% 0 0 0;}
#products03 { padding: 7% 0 0 0;}
#products04 { padding: 7% 0 10% 0;}

@media screen and (min-width:900px){
#intro_title { position: relative; padding: 7% 0 0 0; background: ; }

#products_caption_A { position: absolute; width: 50%; top:15%; left: 25%; z-index: 40; opacity: 0; }
#products_caption_B { position: absolute; width: 50%; top:15%; left: 25%; z-index: 40; opacity: 0; }
#products_caption_C { position: absolute; width: 50%; top:15%; left: 25%; z-index: 40; opacity: 0; }

#products_shade_A { position: absolute; width: 60%; top:0; left: 20%; z-index: 35; }
#products_futa_A { position: absolute; width: 60%; top:0; left: 20%; z-index: 30; }
#products_shade_B { position: absolute; width: 60%; top:0; left: 20%; z-index: 25; }
#products_futa_B { position: absolute; width: 60%; top:0; left: 20%; z-index: 20; }
#products_shade_C { position: absolute; width: 60%; top:0; left: 20%; z-index: 15; }
#products_shade_D { position: absolute; width: 60%; top:0; left: 20%; z-index: 12; }
#products_shade_E { position: absolute; width: 60%; top:0; left: 20%; z-index: 12; }
#products_body { position: relative; width: 60%; margin-top: 0; z-index: 10; }
#products_bodyparts { position: absolute; width: 60%; top: 0; z-index: 11; }
}