@charset "utf-8";
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,font,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td {
	margin: 0px;
	padding: 0px;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
}

html {overflow:auto;}

body {
	padding: 0px;
	margin:0px auto;
	line-height: 1;
	font-family: Georgia,游明朝,"Yu Mincho",YuMincho,"Hiragino Mincho ProN",HGS明朝E,メイリオ,Meiryo,serif;
	-webkit-font-feature-settings: 'palt' 1;
	font-feature-settings: 'palt' 1;
	-webkit-text-size-adjust: 100%;
	color: #fff;
	background: #000;
}

ol,ul{list-style:none;}

font {font-family: serif;}

#wrapper {width: 100%; margin: auto;}
header {
	position:fixed;
	top:0;
	left:0;
	height: 30px;
	z-index: 1070;
	width: 98%;
	padding: 10px 1%;
	margin:0;
	background: rgba(0,0,0,0.8); border-bottom: 1px solid #ff0000;
	transition: all 0.3s ease;
}

header::after, header section::after {
	height: 0;
	visibility: hidden;
	content: ".";
	display: block;
	clear: both;
}

header img {width: 70px; margin-left:5px; transition: all 0.3s ease;}
header div { width: 100%; margin: auto;  }

nav.globalMenuSp {
    position: fixed;
    z-index: 2;
    top: 0;
    left: 0;
    background: #fff;
    color: #000;
    text-align: center;
	-webkit-transform: translate3d(0, -100%, 0);
    transform: translateY(-100%);
    transition: all 0.6s;
    width: 100%;
	opacity: 0;
}
nav.globalMenuSp.active {opacity: 1;}
nav.globalMenuSp ul {
    background: #ccc;
    margin: 0 auto;
    padding: 0;
    width: 100%;
}
 
nav.globalMenuSp ul li {
    font-size: 1.1em;
    list-style-type: none;
    padding: 0;
    width: 100%;
    border-bottom: 1px solid #aaa;
}
 
/* 最後はラインを描かない */
nav.globalMenuSp ul li:last-child {
    padding-bottom: 0;
    border-bottom: none;
	
	background: -moz-linear-gradient(top,  rgba(124,11,11,1) 0%, rgba(186,13,13,1) 100%);
background: -webkit-linear-gradient(top,  rgba(124,11,11,1) 0%,rgba(186,13,13,1) 100%);
background: linear-gradient(to bottom,  rgba(124,11,11,1) 0%,rgba(186,13,13,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7c0b0b', endColorstr='#ba0d0d',GradientType=0 );
}
 
nav.globalMenuSp ul li a {
    display: block;
    color: #000;
    padding: 1em 0;
	text-decoration:none;
}
nav.globalMenuSp ul li:last-child a { color: #fff;}
/* このクラスを、jQueryで付与・削除する */
nav.globalMenuSp.active {
	-webkit-transform: translate3d(0, 0%, 0);
    transform: translateY(0%);
}


.navToggle {
    display: block;
    position: fixed;    /* bodyに対しての絶対位置指定 */
    right: 7px;
    top: 12px;
    width: 42px;
    /*height: 35px;*/
	height: 30px;
    cursor: pointer;
    z-index: 3;
    /*background: #666;*/
    text-align: center;
	/*border:1px solid #ff0000;
	border-radius:3px;*/
}
 
.navToggle span {
    display: block;
    position: absolute;    /* .navToggleに対して */
    width: 30px;
    border-bottom: solid 3px #ff0000;
    -webkit-transition: .35s ease-in-out;
    -moz-transition: .35s ease-in-out;
    transition: .35s ease-in-out;
    left: 6px;
}
.navToggle span:nth-child(1) {top: 5px;}
.navToggle span:nth-child(2) {top: 14px;}
.navToggle span:nth-child(3) {top: 23px;}
.navToggle span:nth-child(4) {
    border: none;
    color: #eee;
    font-size: 9px;
    font-weight: bold;
    top: 34px;
}

/* 最初のspanをマイナス45度に */
.navToggle.active span:nth-child(1) {
    top: 18px;
    left: 6px;
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    transform: rotate(-45deg);
}
 
/* 2番目と3番目のspanを45度に */
.navToggle.active span:nth-child(2),
.navToggle.active span:nth-child(3) {
    top: 18px;
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    transform: rotate(45deg);
}

#sns { display: flex; display: -webkit-flex; /* Safari対応のつもり */ position: fixed; top: 10px; right: 60px;}
#sns li { margin-left: 10px;}
#sns li a { color: #fff; font-size: 2.1em; opacity:0.8;}



#fp-nav ul li a span, .fp-slidesNav ul li a span {
	background: #ff0000;
}

.section { height:100vh; border-bottom:1px solid #444; /*box-shadow: 0px 0px 10px 10px rgba(0,0,0,1) inset;*/}
.wrap { text-align: center; width: 90%; margin: auto; position: relative; font-size:0.8em; height:100%}


ul.products {}
ul.products::after {
	height: 0;
	visibility: hidden;
	content: ".";
	display: block;
	clear: both;
}
ul.products li img {width: 50%;}
ul.products li {text-align: center;}
ul.products > li:first-child {/*width: 50%;*/ /*opacity: 0;*/}

ul.products li:first-child h3 { font-size: 1.5em; line-height: 160%; margin-bottom: 10px; margin-top:20px; font-weight: normal; letter-spacing: 0.1em;}
ul.products li:first-child h3 + p {font-size: 1em; line-height: 160%; letter-spacing: 0.05em;}

ul.products li:first-child ul {margin-top: 10px;}
ul.products li:first-child ul li {  letter-spacing: 0.05em; text-align: center;}


.pMovieBox {
	/*width:60%;*/
	max-width: 200px;
	text-align:center;
	margin: 25px auto 12px;
}
.pMovie {
	display:block;
	font-size: 2.6em;
	letter-spacing: 0.1em;
	padding:55px 5px;
	background:url(../img/btnBg.png) rgba(0,0,0,0.0);
	box-sizing:border-box;
	border:2px solid rgba(255,255,255,0.5);
	text-decoration:none;
	color:#990a0a;
	transition: all 0.3s ease;
	}


ul.products li:first-child ul li:last-child a:hover {background:url(../img/btnBg.png) rgba(255,255,255,0.0);border:1px solid rgba(255,255,255,0.7);}
ul.products li:first-child ul li a::before, .pMovie::before {
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
}

/*
.pMovie::before {content: "\f144"; display: block; font-size: 180%; margin-bottom:15px; }
*/

ul.products > li:last-child {width: 100%;  position: relative; vertical-align: bottom; padding:0px 0px; margin-top:30px; margin-bottom:30px;}
ul.products > li:last-child img {  width: 80%;}
ul.products > li:last-child i img { width:40%}
ul.products > li:last-child p { text-align:center; margin-top:15px; width:100%; font-size: 1.2em; letter-spacing: 0.1em;}
ul.products > li:last-child font {display: block; margin-bottom: 15px;}
ul.products > li:last-child a {  display: inline;  text-decoration: underline; font-size: 0.9em;  color: #fff; margin: 5px auto 0; }
ul.products > li:last-child a::before {
	content: "\f101";
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  font-size: 100%;
	display: inline-block;
	margin-right: 10px;
}
ul.products > li:last-child a:hover {text-decoration: none;}
ul.products sup {font-size: 0.6em; display: inline-block; position: relative; top:-5px; font-family: serif;}




#section3 p.cap, #section4 p.cap { text-align:left; width:100%; line-height: 160%;}



ul#purchase {width: 96%; margin: auto; }
ul#purchase::after {
	height: 0;
	visibility: hidden;
	content: ".";
	display: block;
	clear: both;
}
ul#purchase li { width: 100%; background: url(../img/light.jpg) no-repeat center top #000; background-size: 100%;}

ul#purchase li {color: #fff; text-decoration: none; display: block; transition: all 0.3s ease; margin-bottom:30px; box-sizing: border-box;}
ul#purchase li:last-child {margin-top: 60px;}
ul#purchase li h3 { margin-bottom: 10px;}
ul#purchase li h3 img {width: 40%; margin-top: 60px;}
ul#purchase li h3 + img {width: 56%;}
ul#purchase li p:nth-of-type(1) {text-align: center; font-size: 1.2em; letter-spacing: 0.1em; margin-top: 15px; margin-bottom: 15px;}
ul#purchase li p small {display: block; font-size: 0.8em;}
ul#purchase li p span {display: block;  margin-bottom: 10px; font-size: 0.9em;}
ul#purchase li p span sup {font-size: 0.6em; display: inline-block; position: relative; top:-5px; font-family: serif;}

ul#purchase li p a {color: #fff; display: block; margin-top: 20px; text-decoration: underline;}
	ul#purchase li p a::before {
    content: "\f101";
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    font-size: 100%;
    display: inline-block;
    margin-right: 5px;
}

ul#purchase li p.cap {  line-height: 140%; margin-top: 20px; min-height: 20px;}

ul#purchase li p.cap + a {
	display: block;
	width: 60%;
	font-size: 1.2em;
	margin:15px auto 0px;
	text-decoration: none;
	color: #fff;
	box-sizing: border-box;
	padding: 10px 10px;
	background: rgb(124,11,11);
	border-radius: 5px;
background: -moz-linear-gradient(top,  rgba(124,11,11,1) 0%, rgba(186,13,13,1) 100%);
background: -webkit-linear-gradient(top,  rgba(124,11,11,1) 0%,rgba(186,13,13,1) 100%);
background: linear-gradient(to bottom,  rgba(124,11,11,1) 0%,rgba(186,13,13,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7c0b0b', endColorstr='#ba0d0d',GradientType=0 );
	transition: all 0.3s ease;
}
ul#purchase li p.cap + a::after {
	content: "\f35a";
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  font-size: 100%;
	display: inline-block;
	margin-left: 10px;
}

ul#purchase li a:hover {opacity: 0.6;}


ul#purchase li div { margin-top: 30px;}
ul#purchase li div img {max-width: 90px;}
ul#purchase li div span { display: block; font-size: 1.3em; line-height: 140%; margin-top: 10px; font-family: Arial, 'メイリオ', Meiryo, 'ヒラギノ角ゴ ProN W3', 'Hiragino Kaku Gothic ProN', Osaka, 'ＭＳ Ｐゴシック', 'ヒラギノ角ゴ Pro W3', sans-serif;}


footer {
	margin-top: 30px;
	font-family: Arial, 'メイリオ', Meiryo, 'ヒラギノ角ゴ ProN W3', 'Hiragino Kaku Gothic ProN', Osaka, 'ＭＳ Ｐゴシック', 'ヒラギノ角ゴ Pro W3', sans-serif;
}
footer p:first-child { font-size: 1em; line-height: 160%;}
footer ul { display: flex; display: -webkit-flex;  margin: 10px auto; width: 300px; justify-content: center; }
footer ul li {margin: 10px;}
footer ul li img {width: 60%;}
footer ul li span {font-size: 10px; display: block; margin-top: 5px; line-height: 140%;}

@media screen and (min-width: 475px){
	footer ul { width: 450px; }
	footer ul li {width: 50%;}
	footer ul li img {width: 100px;}
}

footer p.cap {line-height: 140%; font-size: 0.75em; font-weight: normal;}

#section5 div#copyright {
	text-align: center;
	width: 100%;
	font-family: Arial, 'メイリオ', Meiryo, 'ヒラギノ角ゴ ProN W3', 'Hiragino Kaku Gothic ProN', Osaka, 'ＭＳ Ｐゴシック', 'ヒラギノ角ゴ Pro W3', sans-serif;
}

#copyright {margin-top: 20px; text-align: center; font-size: 0.7em; padding-bottom: 10px;}
#copyright a {text-decoration: none; color: #fff;}




/*** footer ***/

#backToTop {
    display: none;
    position: fixed !important;
    bottom: 10px;
    right: 10px;
    z-index: 9998;
}
#backToTop a {display: block; width: 80px; font-size: 0.7em; background: rgba(0,0,0,0.2); text-align: center; text-decoration: none; color: #fff; padding: 5px; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px;}

#backToTop a span {display: block; margin-top: 5px;}
#backToTop a i {font-size: 3em;}

/*** footer end ***/

.cap {
	font-size:0.7em;
	font-family: Arial, 'メイリオ', Meiryo, 'ヒラギノ角ゴ ProN W3', 'Hiragino Kaku Gothic ProN', Osaka, 'ＭＳ Ｐゴシック', 'ヒラギノ角ゴ Pro W3', sans-serif;
}
.capArea { font-size:0.8em; line-height:140%; margin-top:15px;}



/* clearfix
------------------------------------------------------------------- */
.clearfix:after {
	height: 0;
	visibility: hidden;
	content: ".";
	display: block;
	clear: both;
}
.clearfix	{
	width: 100%;
	/*\*//*/
	overflow: hidden;
	/**/
}


.left {float:left;}
.right {float:right;}
.tCenter { text-align:center;}

.sp { display: none;}


body.android {font-family:"Sawarabi Mincho", serif;}
body.android #section1 section, body.android #section2 section { letter-spacing: 0.0em; font-size: 1.05em;}

