@charset "utf-8";



h2{
	position: relative;
	height: calc(100vh - 100px);
	background: url("../img/top/loading.gif") no-repeat center center #F6F6F6;
}
h2 p{
	position: absolute;
	right: 30px;
	top: 30px;
	width: 160px;
	height: 160px;
	font-size: 3.4rem;
	font-weight: 700;
	letter-spacing: 2px;
	color: #FFFFFF;
	background-color: #FF2626;
	border-radius: 10.0rem;
	text-align: center;
	z-index: 10;
	opacity: 0;
	display:-webkit-box;
  	display:-ms-flexbox;
  	display:flex;
	-webkit-box-orient: vertical;
  	-webkit-box-direction: normal;
  	-ms-flex-direction: column;
  	flex-direction: column;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
}
h2 p.style1{
	letter-spacing: 10px;
	padding-left: 9px;
}
h2 p q{
	font-size: 1.8rem;
	font-weight: 500;
	letter-spacing: 2px;
	margin-bottom: 10px;
}
h2 p b{
	font-size: 3.4rem;
	font-weight: 700;
	letter-spacing: 2px;
}
h2 p b small{font-size: 2.0rem;}
h2 div{
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	z-index: 1;
	opacity: 0;
}
h2 div img{display: none;}
h2.sap div{
	background: url("../products/img/sap/h2_bg1.jpg") no-repeat center center;
	background-size: cover;
	display: none;
	opacity: 0;
}
h2.sap div:nth-child(2){
	background: url("../products/img/sap/h2_bg2.jpg") no-repeat center center;
	background-size: cover;
}
h2.sap div:nth-child(3){
	background: url("../products/img/sap/h2_bg3.jpg") no-repeat center center;
	background-size: cover;
}
h2.ssh div{
	background: url("../products/img/ssh/h2_bg.jpg") no-repeat center center;
	background-size: cover;
}
h2.shc div{
	background: url("../products/img/shc/h2_bg.jpg") no-repeat center center;
	background-size: cover;
}
h2.ssc div{
	background: url("../products/img/ssc/h2_bg.jpg") no-repeat center center;
	background-size: cover;
}
h2.ssc4000 div{
	background: url("../products/img/ssc4000/h2_bg.jpg") no-repeat center center;
	background-size: cover;
}
h2.ncb1 div:first-of-type{
	background: url("../products/img/ncb1/h2_bg5.jpg") no-repeat center center;
	background-size: cover;
	display: none;
	opacity: 0;
}
h2.ncb1 div:nth-of-type(2){
	background: url("../products/img/ncb1/h2_bg3.jpg") no-repeat center center;
	background-size: cover;
}
h2.ncb1 div:nth-of-type(3){
	background: url("../products/img/ncb1/h2_bg4.jpg") no-repeat center center;
	background-size: cover;
}
h2.ncb1 div:nth-of-type(4){
	background: url("../products/img/ncb1/h2_bg1.jpg") no-repeat center center;
	background-size: cover;
}
h2.sshUv div:first-of-type{
	background: url("../products/img/ssh-uv/h2_bg1.jpg") no-repeat center center;
	background-size: cover;
}
h2.sshUv div:nth-of-type(2){
	background: url("../products/img/ssh-uv/h2_bg2.jpg") no-repeat center center;
	background-size: cover;
}
h2.sshUv div:nth-of-type(3){
	background: url("../products/img/ssh-uv/h2_bg3.jpg") no-repeat center center;
	background-size: cover;
}
h2.ssh div:first-of-type{
	background: url("../products/img/ssh/h2_bg1.jpg") no-repeat center center;
	background-size: cover;
}
h2.ssh div:nth-of-type(2){
	background: url("../products/img/ssh/h2_bg2.jpg") no-repeat center center;
	background-size: cover;
}
h2.ssh div:nth-of-type(3){
	background: url("../products/img/ssh/h2_bg3.jpg") no-repeat center center;
	background-size: cover;
}
h2.scb-020 div:first-of-type{
	background: url("../products/img/scb-020/h2_bg5.jpg") no-repeat center center;
	background-size: cover;
	display: none;
	opacity: 0;
}
h2.scb-020 div:nth-of-type(2){
	background: url("../products/img/scb-020/h2_bg3.jpg") no-repeat center center;
	background-size: cover;
}
h2.scb-020 div:nth-of-type(3){
	background: url("../products/img/scb-020/h2_bg4.jpg") no-repeat center center;
	background-size: cover;
}
h2.scb-020 div:nth-of-type(4){
	background: url("../products/img/scb-020/h2_bg1.jpg") no-repeat center center;
	background-size: cover;
}
h2 span{
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	display:-webkit-box;
  	display:-ms-flexbox;
  	display:flex;
	-webkit-box-orient: vertical;
  	-webkit-box-direction: normal;
  	-ms-flex-direction: column;
  	flex-direction: column;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	z-index: 2;
}
h2.sap span{padding-top: 80px;}
h2.ssh span{padding-top: 80px;}
h2.shc span{padding-top: 80px;}
h2.ssc span{padding-top: 70px;}
h2.ssc4000 span{padding-top: 70px;}
h2.ncb1 span,
h2.scb-020 span{padding-top: 70px;}
h2.scb-040 span{padding-top: 70px;}
h2 span small{
	font-size: 1.8rem;
	font-weight: 500;
	line-height: 1.4;
	letter-spacing: 2px;
	text-align: center;
	opacity: 0;
}
h2.ncb1 span small,
h2.scb-020 span small{
	text-align: left;
	padding-left: 70px;
	width: 100%;
}
h2.scb-040 span small{
	text-align: left;
	padding-left: 70px;
	width: 100%;
}
h2 strong{
	padding-top: 30px;
	opacity: 0;
}
h2.sap strong img{width: 400px;}
h2.shc strong img{width: 450px;}
h2.ssc strong img{width: 420px;}
h2.scb-040 div:first-of-type{
	background: url("../products/img/scb-040/h2_bg5.jpg") no-repeat center center;
	background-size: cover;
	display: none;
	opacity: 0;
}
h2.scb-040 div:nth-of-type(2){
	background: url("../products/img/scb-040/h2_bg3.jpg") no-repeat center center;
	background-size: cover;
}
h2.scb-040 div:nth-of-type(3){
	background: url("../products/img/scb-040/h2_bg4.jpg") no-repeat center center;
	background-size: cover;
}
h2.scb-040 div:nth-of-type(4){
	background: url("../products/img/scb-040/h2_bg1.jpg") no-repeat center center;
	background-size: cover;
}
h2 div.show{animation: effect1 0.5s ease-in-out forwards}
h2 span.show small{animation: effect2 0.5s ease-in-out forwards 0.5s}
h2 span.show strong{animation: effect2 0.5s ease-in-out forwards 0.75s}
h2 p.show{animation: effect1 0.5s ease-in-out forwards 0.85s}
@keyframes effect1{
	0% {
		opacity: 0;
	}
	100% {
		opacity: 1;
	}
}
@keyframes effect2{
	0% {
		opacity: 0;
		transform: translateY(-20px);
	}
	100% {
		opacity: 1;
		transform: translateY(0px);
	}
}

h2 label{
	position: absolute;
	right: 15px;
	bottom: -25px;
	font-size: 1.2rem;
	font-weight: 400;
	line-height: 1.3;
	z-index: 20;
}

h2.sshUv div span,
h2.ssh div span{
	width: auto;
	height: auto;
	display: block;
}
h2.sshUv div span img,
h2.ssh div span img{
	display: block;
	height: auto;
}
h2.sshUv div:first-of-type span{
	top: 13%;
	left: 14%;
}
h2.sshUv div:first-of-type span img{width: 400px;}
h2.sshUv div:nth-of-type(2) span{
	top: 13%;
	left: 14%;
}
h2.sshUv div:nth-of-type(2) span img{width: 400px;}
h2.sshUv div:nth-of-type(3) span{
	top: 13%;
	left: 14%;
}
h2.sshUv div:nth-of-type(3) span img{width: 400px;}
h2.ssh div:first-of-type span{
	top: 0%;
	left: 57%;
}
h2.ssh div:first-of-type span img{width: 320px;}
h2.ssh div:nth-of-type(2) span{
	top: 5%;
	left: 57%;
}
h2.ssh div:nth-of-type(2) span img{width: 280px;}
h2.ssh div:nth-of-type(3) span{
	top: 5%;
	left: 17%;
}
h2.ssh div:nth-of-type(3) span img{width: 280px;}
h2.sshUv div span dl,
h2.ssh div span dl{margin-top: 40px;}
h2.sshUv div span dl dt,
h2.ssh div span dl dt{
	font-size: 2.0rem;
	font-weight: 700;
	letter-spacing: 1px;
	color: #FFFFFF;
}
h2.sshUv div span dl dt q,
h2.ssh div span dl dt q{
	display: block;
	font-size: 1.4rem;
	font-weight: 400;
	margin-bottom: 10px;
}
h2.sshUv div span dl dd{margin-top: 25px;}
h2.sshUv div:first-of-type span dl dd img,
h2.sshUv div:nth-of-type(2) span dl dd img,
h2.sshUv div:last-of-type span dl dd img{width: 280px;}



/**************************************************
 main
**************************************************/
main{
	display: block;
	padding-bottom: 200px;
}
main.style1{padding-bottom: 0;}



/**************************************************
 article
**************************************************/
article h3{
	font-size: 3.5rem;
	font-weight: 500;
	letter-spacing: 2px;
	line-height: 1.5;
	text-align: center;
}
article h3.style1{
	font-family: 'Roboto', sans-serif;
	letter-spacing: 1px;
}
article h3 span{
	position: relative;
	display: inline-block;
	padding: 0 50px;
	min-width: 230px;
}
article h3 span::before,
article h3 span::after{
	position: absolute;
	content: '';
	width: 1px;
	height: 50px;
	background-color: #000000;
}
article h3 span::before{
	top: -6px;
	left: 0;
}
article h3 span::after{
	bottom: -10px;
	right: 0;
}

article h4{
	margin: 100px 0 0 0;
	font-size: 2.5rem;
	font-weight: 500;
	line-height: 1.3;
	letter-spacing: 2px;
	text-align: center;
	padding: 25px 25px 25px 25px;
	border: 1px solid #000000;
}

article h5{
	position: relative;
	margin: 100px 0 0 0;
	font-size: 3.0rem;
	font-weight: 500;
	line-height: 1.3;
	letter-spacing: 2px;
	text-align: center;
	padding-bottom: 30px;
}
article h5::before{
	position: absolute;
	content: '';
	width: 80px;
	height: 1px;
	bottom: 0;
	left: calc(50% - 40px);
	background-color: #000000;
}

article p{
	font-size: 1.6rem;
	line-height: 2.0;
	letter-spacing: 1px;
	text-align: center;
	padding: 40px 0 0 0;
}
article p.style1{
	font-size: 1.8rem;
	letter-spacing: 1px;
	padding: 60px 0 0 0;
}
article p.style2{
	font-size: 2.0rem;
	font-weight: 700;
	letter-spacing: 3px;
	padding: 60px 0 0 0;
}
article p.style3{text-align: left;}
article p.style3 strong{
	display: block;
	font-size: 2.2rem;
	font-weight: 700;
	letter-spacing: 2px;
	text-align: center;
	padding: 30px 0 25px 0;
}

.imageHanger1{
	margin: 70px 0 0 0;
	text-align: center;
}
.imageHanger1 img{max-width: 100%;}

.imageHanger2{
	margin: 100px 0 0 0;
	text-align: center;
}
.imageHanger2 img{max-width: 100%;}

.imageHanger3{
	margin-bottom: 100px;
	text-align: center;
}
.imageHanger3 img{max-width: 100%;}

.dlBtn{
	margin-top: 50px;
	text-align: center;
}
.dlBtn a{
	display: block;
	width: 250px;
	margin: 0 auto;
	padding: 15px 0;
	font-size: 1.6rem;
	letter-spacing: 1px;
	color: #FFFFFF;
	background: #222222;
	border-radius: 10.0rem;
}
.dlBtn a:hover{opacity: 0.5;}

.dlBtn.style1{
	display:-webkit-box;
  	display:flex;
	flex-wrap: wrap;
	-webkit-box-pack: center;
	justify-content: center;
}
.dlBtn.style1 a{margin: 0 15px;}



/**************************************************
 intro
**************************************************/
#intro{padding: 80px 0 100px 0;}

.discontinued{
	display: block;
	font-size: 2.0rem;
	font-weight: 500;
	letter-spacing: 1px;
	text-align: center;
	color: #FFFFFF;
	background: #222222;
	padding: 20px 0;
	width: 250px;
	margin: 0 auto 50px auto;
}

#intro ul{
	display:-webkit-box;
  	display:-ms-flexbox;
  	display:flex;
	-ms-flex-wrap: wrap;
  	flex-wrap: wrap;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
}
#intro ul li{
	width: 250px;
	font-size: 1.2rem;
	line-height: 1.3;
	text-align: center;
}
#intro ul li span{
	display: block;
	padding: 20px;
}
#intro ul li span img{width: 100%;}

#intro dl{margin: 80px 0 0 0;}
#intro dl dt{
	font-size: 3.5rem;
	font-weight: 500;
	letter-spacing: 3px;
	line-height: 1.5;
	text-align: center;
}
#intro dl dd{
	font-size: 1.8rem;
	letter-spacing: 1px;
	line-height: 2.0;
	text-align: center;
	padding-top: 75px;
}



/**************************************************
 secType1
**************************************************/
.secType1{
	position: relative;
	padding: 500px 0 0 0;
}

.secType1 .bgWrapper{
	position: absolute;
	width: 100%;
	height: 600px;
	top: 0;
	left: 0;
	z-index: 0;
}
.secType1 .bgWrapper img{display: none;}
.secType1.sap1 .bgWrapper{
	background: url("../products/img/sap/bg1.jpg") no-repeat center center;
	background-size: cover;
	background-attachment: fixed;
}
.secType1.ssh1 .bgWrapper{
	background: url("../products/img/ssh/bg1.jpg") no-repeat center center;
	background-size: cover;
	background-attachment: fixed;
}
.secType1.ssh2 .bgWrapper{
	background: url("../products/img/ssh/bg2.jpg") no-repeat center center;
	background-size: cover;
	background-attachment: fixed;
}
.secType1.shc1 .bgWrapper{
	background: url("../products/img/shc/bg1.jpg") no-repeat center center;
	background-size: cover;
	background-attachment: fixed;
}
.secType1.ssc1 .bgWrapper{
	background: url("../products/img/ssc/bg1.jpg") no-repeat center center;
	background-size: cover;
	background-attachment: fixed;
}
.secType1.ssc4000_1 .bgWrapper{
	background: url("../products/img/ssc4000/bg1.jpg") no-repeat center center;
	background-size: cover;
	background-attachment: fixed;
}
.secType1.ncb1 .bgWrapper{
	background: url("../products/img/ncb1/bg1.jpg") no-repeat center center;
	background-size: cover;
	background-attachment: fixed;
}
.secType1.ncb2 .bgWrapper{
	background: url("../products/img/ncb1/h2_bg2.jpg") no-repeat center center;
	background-size: cover;
	background-attachment: fixed;
}
.secType1.sshuv1 .bgWrapper{
	background: url("../products/img/ssh-uv/bg1.jpg") no-repeat center center;
	background-size: cover;
	background-attachment: fixed;
}
.secType1.sshuv2 .bgWrapper{
	background: url("../products/img/ssh-uv/bg2.jpg") no-repeat center center;
	background-size: cover;
	background-attachment: fixed;
}
.secType1.sshuv3 .bgWrapper{
	background: url("../products/img/ssh-uv/bg3.jpg") no-repeat center center;
	background-size: cover;
	background-attachment: fixed;
}
.secType1.scb-020 .bgWrapper{
	background: url("../products/img/scb-020/bg1.jpg") no-repeat center center;
	background-size: cover;
	background-attachment: fixed;
}
.secType1.scb-020-2 .bgWrapper{
	background: url("../products/img/scb-020/h2_bg2.jpg") no-repeat center center;
	background-size: cover;
	background-attachment: fixed;
}
.secType1.scb-040 .bgWrapper{
	background: url("../products/img/scb-040/bg1.jpg") no-repeat center center;
	background-size: cover;
	background-attachment: fixed;
}
.secType1.scb-040-2 .bgWrapper{
	background: url("../products/img/scb-040/h2_bg2.jpg") no-repeat center center;
	background-size: cover;
	background-attachment: fixed;
}

.secInner{
	position: relative;
	width: 1100px;
	margin: -1px auto 0 auto;
	padding: 100px 50px;
	background-color: #FFFFFF;
}

.twoColumn{
	margin-top: 70px;
	display:-webkit-box;
  	display:flex;
	flex-wrap: wrap;
}
.twoColumn div{width: calc(50% - 40px);}
.twoColumn div:nth-of-type(2n){margin-left: 80px;}
.twoColumn div dl dt{
	font-size: 1.7rem;
	font-weight: 700;
	letter-spacing: 1px;
	margin-top: 15px;
}
.twoColumn div dl dd{
	font-size: 1.5rem;
	line-height: 1.6;
	padding: 5px 0 0 19px;
}
.twoColumn div img{
	display: block;
	width: 100%;
	margin: 20px auto 0 auto;
}

.twoColumn2{
	margin-top: 65px;
	display:-webkit-box;
  	display:flex;
	flex-wrap: wrap;
}
.twoColumn2 dl{width: 55%;}
.twoColumn2 dl dt{
	font-size: 1.7rem;
	font-weight: 700;
	letter-spacing: 1px;
	margin-top: 15px;
}
.twoColumn2 dl dd{
	font-size: 1.5rem;
	line-height: 1.6;
	padding: 5px 0 0 19px;
}
.twoColumn2 img{
	width: calc(45% - 40px);
	margin-left: 40px;
}



/**************************************************
 style
**************************************************/
.style{
	padding: 100px 20px;
	background-color: #F6F6F6;
}

#styleTab ul{
	margin: 120px 80px 0 80px;
	border-bottom: 1px solid #000000;;
	display:-webkit-box;
  	display:-ms-flexbox;
  	display:flex;
}
#styleTab ul li{
	width: 100%;
	font-size: 1.8rem;
	font-weight: 500;
	letter-spacing: 2px;
	padding: 20px 10px;
	text-align: center;
	color: #878787;
	cursor: pointer;
	-webkit-transition: 0.2s ease-in-out;
	transition: 0.2s ease-in-out;
}
#styleTab ul li:hover{color: #000000;}
#styleTab ul li.active{
	color: #000000;
	border: 1px solid #000000;
	border-bottom: none;
	pointer-events: none;
}

.styleInner{display: none;}



/**************************************************
 spec
**************************************************/
.spec{padding: 100px 100px 0 100px;}

#specTab ul{
	margin: 120px 0 0 0;
	border-bottom: 1px solid #000000;;
	display:-webkit-box;
  	display:-ms-flexbox;
  	display:flex;
}
#specTab ul li{
	width: 100%;
	font-size: 1.8rem;
	font-weight: 500;
	letter-spacing: 2px;
	padding: 20px 10px;
	text-align: center;
	color: #878787;
	cursor: pointer;
	-webkit-transition: 0.2s ease-in-out;
	transition: 0.2s ease-in-out;
}
#specTab ul li:hover{color: #000000;}
#specTab ul li.active{
	color: #000000;
	border: 1px solid #000000;
	border-bottom: none;
	pointer-events: none;
}

.featureHanger{display: none;}
.featureHanger ul{
	display:-webkit-box;
  	display:-ms-flexbox;
  	display:flex;
	-ms-flex-wrap: wrap;
  	flex-wrap: wrap;
}
.featureHanger ul li{
	margin: 60px 60px 0 0;
	width: calc((100% - 120px) / 3);
	font-size: 1.5rem;
	line-height: 1.6;
}
.featureHanger ul li:nth-child(3n){margin: 60px 0 0 0;}
.featureHanger ul li img{
	display: block;
	width: 100%;
}
.featureHanger ul li strong{
	display: block;
	font-size: 1.8rem;
	font-weight: 500;
	letter-spacing: 1px;
	padding: 15px 0;
}

.panelInfo{
	padding-top: 20px;
	display:-webkit-box;
  	display:-ms-flexbox;
  	display:flex;
	-ms-flex-wrap: wrap;
  	flex-wrap: wrap;
}
.panelInfo dl{
	width: calc((100% - 150px) / 4);
	margin: 50px 50px 0 0;
}
.panelInfo dl:nth-child(4n){margin: 50px 0 0 0;}
.panelInfo dl dt{
	font-size: 1.6rem;
	font-weight: 500;
	padding-left: 10px;
	border-left: 3px solid #000000;
}
.panelInfo dl dd{
	font-size: 1.4rem;
	line-height: 1.5;
	padding: 15px 0 0 0;
}

.panelOther{
	margin: 60px auto 0 auto;
	display:-webkit-box;
  	display:-ms-flexbox;
  	display:flex;
	-ms-flex-wrap: wrap;
  	flex-wrap: wrap;
}
.panelOther dl{
	width: calc(50% - 60px);
	margin: 60px 0 0 0;
}
.panelOther dl:nth-child(2n){margin: 60px 0 0 120px;}
.panelOther dl dt{
	font-size: 1.8rem;
	font-weight: 500;
	letter-spacing: 2px;
	padding-bottom: 20px;
	border-bottom: 1px solid #000000;
}
.panelOther dl dd{
	padding-top: 20px;
	font-size: 1.6rem;
	line-height: 1.6;
}
.panelOther dl dd img{
	display: block;
	margin: 30px auto 0 auto;
	/*width: 60%;
	max-width: 640px;*/
}
.panelOther dl dd small{
	display: block;
	font-size: 1.4rem;
	text-align: center;
	line-height: 1.3;
	padding-top: 10px;
}

.specCont ul{margin-top: 50px;}
.specCont ul li{
	margin: 0;
	padding: 15px 0;
	font-size: 1.7rem;
	text-align: center;
	color: #999999;
	width: calc(100% / 3);
	cursor: pointer;
	-webkit-transition: 0.2s ease-in-out;
	transition: 0.2s ease-in-out;
}
.specCont ul li:hover{color: #000000;}
.specCont ul li.open{
	background: #EEEEEE;
	color: #000000;
}
.specCont ul li:nth-child(3n){margin: 0;}

.specContHanger{display: none;}
.featureHanger .specContHanger:first-of-type{display: block;}
.specContHanger h5 small{
	display: block;
	font-size: 1.6rem;
	margin-bottom: 10px;
}

ul.specItem{
	padding: 30px 0 10px 0;
	display:-webkit-box;
  	display:-ms-flexbox;
  	display:flex;
	-ms-flex-wrap: wrap;
  	flex-wrap: wrap;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
}
ul.specItem li{
	width: 250px;
	font-size: 1.2rem;
	line-height: 1.3;
	text-align: center;
}
ul.specItem li span{
	display: block;
	padding: 20px;
}
ul.specItem li span img{width: 100%;}



/**************************************************
 youtube
**************************************************/
.youtube{
	padding: 0 100px;
	display:-webkit-box;
  	display:flex;
	flex-wrap: wrap;
}
.youtube dl{
	width: calc(50% - 25px);
	margin: 50px 50px 0 0;
}
.youtube dl:nth-of-type(2n){margin: 50px 0 0 0;}
.youtube dl dt{
	font-size: 1.6rem;
	line-height: 1.6;
	padding-bottom: 15px;
}
.youtube dl dt strong{
	display: block;
	font-size: 2.1rem;
	font-weight: 700;
	letter-spacing: 1px;
	margin-bottom: 7px;
}
.youtube dl dd{
	position: relative;
	width: 100%;
	padding-top: 56.25%;
}
.youtube dl dd iframe{
	position: absolute;
	top: 0;
	right: 0;
	width: 100%;
	height: 100%;
}




/**************************************************
 table
**************************************************/
table{
	margin: 50px auto 0 auto;
	width: 750px;
	font-size: 1.5rem;
	line-height: 1.4;
	text-align: left;
	border-bottom: 1px solid #DDDDDD;
}
table th{
	min-width: 200px;
	padding: 20px 0;
	border-top: 1px solid #DDDDDD;
}
table td{
	padding: 20px 0;
	border-top: 1px solid #DDDDDD;
}



/**************************************************
 ec
**************************************************/
.ec{
	position: fixed;
	right: 20px;
	bottom: 20px;
	z-index: 9999;
}
.ec ul li{
	background: #FFFFFF;
	border-radius: 10.0rem;
	overflow: hidden;
}
.ec ul li:nth-of-type(2){margin-top: 20px;}
.ec ul li a,
.ec ul li a.amazon{
	width: 100px;
	height: 100px;
	font-size: 1.4rem;
	color: #000000;
	background: #FF9900;
	display:-webkit-box;
  	display:flex;
	-webkit-box-orient: vertical;
  	-webkit-box-direction: normal;
  	flex-direction: column;
	-webkit-box-pack: center;
	justify-content: center;
	-webkit-box-align: center;
	align-items: center;
}
.ec ul li:nth-of-type(2) a,
.ec ul li a.rakuten{
	color: #FFFFFF;
	background: #BF0000;
}
.ec ul li a img{
	display: block;
	width: 30px;
	margin-bottom: 5px;

}
.ec ul li a small{
	display: block;
	font-size: 1.1rem;
	margin-top: 3px;
}
.ec ul li a:hover{opacity: 0.5;}
.ec ul li a:hover img{opacity: 1.0;}



/**************************************************
 compare
**************************************************/
.compare{
	margin: 100px 0 0 0;
	padding: 100px 100px;
	background-color: #F6F6F6;
}
.compare p.price{
	margin-top: 40px;
	text-align: left;
}

.tableWrapper{
	width: 1000px;
	height: 80vh;
	overflow: scroll;
	margin: 30px auto 0 auto;
}
.tableWrapper table{
	width: 1600px;
	margin: 0;
	line-height: 1.3;
	border-top: 1px solid #000000;
	border-left: 1px solid #000000;
}
.tableWrapper table th{
	min-width: auto;
	border-top: none;
	position: relative;
}
.tableWrapper table td{position: relative;}
.tableWrapper table td{border-top: none;}
.tableWrapper table thead th{
	width: 230px;
	padding: 15px;
	font-size: 1.6rem;
	font-weight: 500;
	text-align: center;
	border-bottom: 1px solid #000000;
	border-right: 1px solid #000000;
	color: #FFFFFF;
	background: #333333;
	white-space: nowrap;
}
.tableWrapper table thead th:first-of-type{
	width: 220px;
	font-size: 1.4rem;
	font-weight: 400;
	text-align: left;
	color: #000000;
	background: #EEEEEE;
}
.tableWrapper table thead td{
	position: relative;
	padding: 15px;
	font-size: 1.4rem;
	font-weight: 500;
	text-align: left;
	border-bottom: 1px solid #000000;
	border-right: 1px solid #000000;
	background: #FFFFFF;
}
.tableWrapper table thead td img{width: 100%;}
.tableWrapper table thead th span,
.tableWrapper table thead td span{
	position: absolute;
	width: 1px;
	height: 100%;
	top: 0;
	left: -1px;
	background: #000000;
}

.tableWrapper table tbody th{
	padding: 15px;
	font-size: 1.4rem;
	font-weight: 500;
	text-align: left;
	border-bottom: 1px solid #000000;
	border-right: 1px solid #000000;
	white-space: nowrap;
	background: #FFFFFF;
}
.tableWrapper table tbody td{
	padding: 15px;
	font-size: 1.4rem;
	text-align: center;
	border-bottom: 1px solid #000000;
	border-right: 1px solid #000000;
	background: #FFFFFF;
}
.tableWrapper table tbody tr:nth-of-type(odd) th,
.tableWrapper table tbody tr:nth-of-type(odd) td{background: #EEEEEE;}
.tableWrapper table tbody tr:nth-of-type(5) th,
.tableWrapper table tbody tr:nth-of-type(5) td{background: #8DD8F8;}
.tableWrapper table tbody td strong{
	display: block;
	font-size: 1.6rem;
	font-weight: 500;
}

.tableWrapper table thead{
	position: sticky;
  	top: 0;
	z-index: 3;
}
.tableWrapper table thead th::before,
.tableWrapper table thead th::after,
.tableWrapper table thead td::before{
	position: absolute;
	content: '';
	width: 100%;
	height: 1px;
	left: 0;
	background: #000000;
}
.tableWrapper table thead th::before{top: -1px;}
.tableWrapper table thead th::after,
.tableWrapper table thead td::before{bottom: -1px;}

.tableWrapper table tbody th,
.tableWrapper table thead th:first-of-type,
.tableWrapper table thead td:first-of-type{
	position: sticky;
  	left: 0;
	z-index: 2;
}
.tableWrapper table tbody th{z-index: 2;}
.tableWrapper table tbody th::before,
.tableWrapper table tbody th::after,
.tableWrapper table thead td:first-of-type::after{
	position: absolute;
	content: '';
	width: 1px;
	height: 100%;
	top: 0;
	background: #000000;
}
.tableWrapper table tbody th::before{left: -1px;}
.tableWrapper table tbody th::after{right: -1px;}
.tableWrapper table thead td:first-of-type::after{right: -1px;}

.tableWrapper table.type1{width: 983px;}
.tableWrapper table.type1 thead th{width: 246px;}
.tableWrapper table.type1 thead th:first-of-type{width: 245px;}

.tableWrapper table.type1 tbody th{white-space: normal;}

.compare p{
	width: 1000px;
	margin: 0 auto;
	padding-top: 30px;
}


