@charset "UTF-8";

@import url('https://fonts.googleapis.com/css2?family=M+PLUS+1:wght@100..900&display=swap');


/* スライダーCSS */ 

#contentsarea .swiper-button-prev,
#contentsarea .swiper-button-next, 
#contentsarea_lineup .swiper-button-prev,
#contentsarea_lineup .swiper-button-next,
#contentsarea_effects .swiper-button-prev,
#contentsarea_effects .swiper-button-next{
margin-top: -15px;
background-size: contain;
width: 2%;
top: 50%;
transform: translateY(-50%);
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
}

#contentsarea .swiper-button-prev,
#contentsarea_lineup .swiper-button-prev,
#contentsarea_effects .swiper-button-prev{
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E");
left: 2%;
}

#contentsarea .swiper-button-next, 
#contentsarea_lineup .swiper-button-next,
#contentsarea_effects .swiper-button-next{
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E");
right: 2%;
}

@-webkit-keyframes zoomUp {
0% {
-webkit-transform: scale(1);
transform: scale(1);
}
100% {
-webkit-transform: scale(1.1);
transform: scale(1.1);
}
}

@keyframes zoomUp {
0% {
-webkit-transform: scale(1);
transform: scale(1);
}
100% {
-webkit-transform: scale(1.1);
transform: scale(1.1);
}
}

#contentsarea .swiper-slide,
#contentsarea_lineup .swiper-slide,
#contentsarea_effects .swiper-slide{
overflow: hidden;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
}

#contentsarea .swiper-slide-active .slide-img,
#contentsarea .swiper-slide-duplicate-active .slide-img,
#contentsarea .swiper-slide-prev .slide-img,
#contentsarea_lineup .swiper-slide-active .slide-img,
#contentsarea_lineup .swiper-slide-duplicate-active .slide-img,
#contentsarea_lineup .swiper-slide-prev .slide-img,
#contentsarea_effects .swiper-slide-active .slide-img,
#contentsarea_effects .swiper-slide-duplicate-active .slide-img,
#contentsarea_effects .swiper-slide-prev .slide-img{ 
-webkit-animation: zoomUp 10s linear 0s;
animation: zoomUp 10s linear 0s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
}

#contentsarea .slide-img,
#contentsarea_lineup .slide-img,
#contentsarea_effects .slide-img{
background-size: cover; 
background-position: center center;
height: calc(100vh - 66px);
position: relative;
}

#contentsarea .slide-img::after,
#contentsarea_lineup .slide-img::after,
#contentsarea_effects .slide-img::after{
content: '';
background-color: rgba(0,0,0,.3);
position: absolute;
left: 0;
right: 0;
top: 0;
bottom: 0;
}

#contentsarea .swiper-pagination-bullet,
#contentsarea_lineup .swiper-pagination-bullet,
#contentsarea_effects .swiper-pagination-bullet{
background: #ccc;
opacity: 0.5;
}

#contentsarea .swiper-pagination-bullet-active,
#contentsarea_lineup .swiper-pagination-bullet-active,
#contentsarea_effects .swiper-pagination-bullet-active{
background: #fff; 
opacity: 1;
}

#contentsarea .sleder-header,
#contentsarea_lineup .sleder-header,
#contentsarea_effects .sleder-header{
width: 100%;
z-index: 120;
top: 0;
position: fixed;
transition: .5s;
height: auto;
margin: 0;
}

#contentsarea .sleder-header.transform,
#contentsarea_lineup .sleder-header.transform,
#contentsarea_effects .sleder-header.transform{
background: rgba(0,0,0,0.6);
}

#contentsarea .sleder-header.hide,
#contentsarea_lineup .sleder-header.hide,
#contentsarea_effects .sleder-header.hide{
transform: translateY(-100%);
}

#contentsarea .slide-text,
#contentsarea_lineup .slide-text,
#contentsarea_effects .slide-text{
position: absolute;
z-index: 110;
color: #9f915a;
width: 100%;
top: 50%;
left: 0;
transform: none;
-webkit-transform: none;
-ms-transform: none;
text-align: center;
margin: 0; 
transform: translateY(-50%);
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
}

#contentsarea .slide-text a,
#contentsarea_lineup .slide-text a,
#contentsarea_effects .slide-text a{
color: #9f915a;
opacity: 1;
}

#contentsarea .slide-text a:hover,
#contentsarea_lineup .slide-text a:hover,
#contentsarea_effects .slide-text a:hover{
opacity: 1;
}

#contentsarea .slide-text p,
#contentsarea_lineup .slide-text p,
#contentsarea_effects .slide-text p{
font-size: 30px;
line-height: 1.2em;
margin: 20px 0;
padding: 0 1em;
text-shadow: 0 0 4px rgba(17, 17, 17, .6);
}

#contentsarea .slide-text span,
#contentsarea_lineup .slide-text span,
#contentsarea_effects .slide-text span{
display: inline-block;
font-size: 20px;
line-height 1em;
padding: 5px 30px;
border: 1px solid #9f915a;
background-color: #9f915a;
transition: 0.5s;
color: transparent;
text-shadow: none;
}

#contentsarea .slide-text span:hover,
#contentsarea_lineup .slide-text span:hover,
#contentsarea_effects .slide-text span:hover{
background-color: rgba(0,0,0,.5);
color: #9f915a;
opacity: 1;
}

#contentsarea .slide-text a span,
#contentsarea_lineup .slide-text a span,
#contentsarea_effects .slide-text a span{
color: #000;
}

#contentsarea .slide-text a span:hover,
#contentsarea_lineup .slide-text a span:hover,
#contentsarea_effects .slide-text a span:hover{
color: #9f915a;
opacity: 1;
}

#contentsarea .fixed-text, 
#contentsarea .fixed-text_third,
#contentsarea_lineup .fixed-text, 
#contentsarea_lineup .fixed-text_third,
#contentsarea_effects .fixed-text, 
#contentsarea_effects .fixed-text_third{
position: absolute;
z-index: 110;
font-size: 20px;
line-height: 1.2em;
color: #9f915a;
width: 100%;
top: 40%;
left: 0;
transform: none;
-webkit-transform: none;
-ms-transform: none;
text-align: center;
margin: 0; 
text-shadow: 0 0 4px rgba(17, 17, 17, .6);
}

#contentsarea .fixed-text p, 
#contentsarea .fixed-text_third p,
#contentsarea_lineup .fixed-text p, 
#contentsarea_lineup .fixed-text_third p,
#contentsarea_effects .fixed-text p, 
#contentsarea_effects .fixed-text_third p{
font-size: 30px;
line-height: 1.2em;
margin: 0;
padding: 0 1em;
}


/* ボディCSS*/ 

.contents_none{
display: none !important;
}

#contentsarea, 
#contentsarea_lineup, 
#contentsarea_effects{
width: 100%;
margin: 66px auto 0;
position: relative;
font-family: "M PLUS 1", sans-serif;
font-weight: 400;
font-style: normal;
}

#contentsarea, 
#contentsarea_effects{
color: #000;
}

#contentsarea_lineup{
color: #eee;
}

#contentsarea:before{
background: url(../../../features/allstores/revelation/revelation_bg.jpg) no-repeat center;
background-size: cover;
display: block;
position: fixed;
width: 100%;
height: 100vh;
content: '';
-webkit-filter: blur(5px);
-moz-filter: blur(5px);
-o-filter: blur(5px);
-ms-filter: blur(5px);
filter: blur(5px);
top: -5px;
left: -5px;
right: -5px;
bottom: -5px;
z-index: -1;
}

#contentsarea iframe{
border: none;
}

#maincontents, 
#maincontents_lineup, 
#maincontents_valiation,
#maincontents_effects {
width: 100%;
margin: 0 auto;
padding: 0 0 100px;
}

#maincontents,
#maincontents_effects{
background: #fff;
}

#maincontents_lineup, 
#maincontents_valiation{
background: #000;
}

.top_comment{
width: 100%;
margin: 0 auto;
padding: 100px 60px 0;
font-size: 18px;
line-height: 2em;
text-align: justify;
word-break: break-all;
}

.top_comment span{
display: block;
font-size: 30px;
line-height: 1.5em;
margin: 0 0 20px;
font-weight: bold;
}

.top_comment p{
margin: 1em auto 0;
}

.top_comment_notes{
display: block;
margin: 20px 0 0;
font-size: 14px;
line-height: 2em;
font-weight: bold;
}

.top_comment_notes span{
display: inline;
font-size: 12px;
line-height: 2em;
margin: 0;
font-weight: normal;
}

#maincontents h4, 
#maincontents_lineup h4, 
#maincontents_valiation h4{
display: block;
width: 100%;
text-align: center;
font-size: 60px;
line-height: 1em;
margin: 100px auto 80px;
color: #9f915a;
}

#maincontents_lineup h5{
display: block;
width: 100%;
text-align: center;
font-size: 60px;
line-height: 1em;
margin: 100px auto 60px;
color: #9f915a;
}

.maincontents_products{
width: 100%;
display: -webkit-flex;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
padding: 0 60px;
margin: 0 auto;
list-style: none;
}

.maincontents_products li{
width: 50%;
margin: 0;
}

.maincontents_products li a{
display: block;
}

figure.products_link {
color: #fff;
position: relative;
overflow: hidden;
width: 100%;
color: #000000;
background-image: -webkit-linear-gradient(top, #ffffff 0%, #000000 70%);
background-image: linear-gradient(to bottom, #ffffff 0%, #000000 70%);
}

figure.products_link * {
-webkit-box-sizing: border-box;
box-sizing: border-box;
-webkit-transition: all 0.35s ease;
transition: all 0.35s ease;
}

figure.products_link img {
display: block;
width: 100%;
}

figure.products_link figcaption {
position: absolute;
bottom: 0%;
left: 0;
width: 100%;
z-index: 1;
-webkit-transform: translateY(100%);
transform: translateY(100%);
}

figure.products_link p {
margin: 0;
width: 100%;
padding: 10px;
background: #9f915a;
text-align: center;
bottom: 0;
font-size: 20px;
line-height: 1.2em;
}

figure.products_link:hover img,
figure.products_link.hover img {
opacity: 0.4;
}

figure.products_link:hover figcaption,
figure.products_link.hover figcaption {
-webkit-transform: translateY(0);
transform: translateY(0);
}

figure.products_link h6 {
position: absolute;
display: block;
text-align: center;
width: 100%;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
-webkit-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
margin: 0;
padding: 0 1em;
font-size: 30px;
line-height: 1.2em;
color: #fff;
z-index: 30;
text-shadow: 0 0 4px rgba(17, 17, 17, .6);
}

.list_btn{
padding: 0;
text-align: center;
}

.stock_list{
display: block;
margin: 50px auto 0;
padding: 15px 0;
position: relative;
width: 500px;
display: flex;
justify-content: center;
align-items: center;
background: #9f915a;
color: #000;
font-size: 28px;
line-height: 1em;
border: 1px solid #9f915a;
transition: .5s;
}

.stock_list:before,
.stock_list:after{
content: '';
display: block;
position: absolute;
top: 50%;
right: 0;
height: 1px;
background: #000;
}

.stock_list:before{
width: 60px;
transform: translate(30px, 0px);
}

.stock_list:after{
width: 15px;
transform-origin: right center;
transform: translate(30px, 0px) rotate(25deg);
}

.stock_list:hover{
background: #fff;
color: #9f915a;
}

#footerarea{
width: 100%;
margin: 0 auto;
padding: 100px 60px;
list-style: none;
}

.footercontents{
width: 100%;
display: -webkit-flex;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
margin: 0 auto;
list-style: none;
align-items: center;
}

.footercontents .left_contents{
width: 50%;
padding: 0 5% 0 0;
margin: 0 auto;
}

.footercontents .right_contents{
width: 50%;
}

.right_contents .moviearea{
width: 100%;
padding-bottom: 56.25%;
text-align: center ;
height: 0px;
position: relative;
}

.right_contents .moviearea iframe{
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}

.footercontents h5{
display: block;
width: 100%;
font-size: 20px;
line-height: 1em;
font-weight: bold;
}

.footercontents p{
display: block;
width: 100%;
font-size: 38px;
line-height: 1.2em;
font-weight: bold;
}

.footercontents .footer_comment{
width: 100%;
font-size: 18px;
line-height: 2em;
margin: 01em auto 0;
text-align: justify;
word-break: break-all;
}


/* 下層ボディCSS*/ 

.contents_lineup{
width: 100%;
font-size: 15px;
line-height: 2em;
margin: 20px auto 0;
padding: 0 60px;
text-align: justify;
word-break: break-all;
position: relative;
}

.contents_lineup img{
display: block;
width: 100%;
}

.contents_lineup div{
width: 50%;
margin: 0;
position: absolute;
top: 50%;
left: 60px;
transform: translateY(-50%);
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
}

.contents_lineup div a{
color: #eee;
transition: 0.25s;
}

.contents_lineup div a:hover{
opacity: 0.7;
}

.contents_lineup div p{
font-size: 30px;
line-height: 1.2em;
margin-bottom: 20px;
color: #9f915a;
text-align: left;
}

.typeicon_area{
width: 100%;
display: -webkit-flex;
display: flex ;
flex-wrap: wrap;
padding:0;
margin: 0;
list-style: none ;
font-size: 10px;
line-height: 1em;
}

.situation_icon{
border: 1px solid #9f915a;
border-radius: 9999px;
background: #9f915a;
padding: 5px;
margin: 10px 5px 0 0;
color: #000;
}

.equipment_icon{
border: 1px solid #9f915a;
border-radius: 9999px;
padding: 5px;
margin: 10px 5px 0 0;
color: #9f915a;
}

#maincontents_valiation .typeicon_area{
width: 100%
display: -webkit-flex;
display: flex;
flex-wrap: wrap;
padding: 0 60px;
margin: 20px auto 10px;
list-style: none ;
font-size: 14px;
line-height: 1em;
}

#maincontents_valiation .situation_icon{
padding: 5px 10px;
margin: 10px 10px 0 0;
}

#maincontents_valiation .equipment_icon{
padding: 5px 10px;
margin: 10px 10px 0 0;
}

.valiation_head{
width: calc(100% - 120px);
margin: 0 auto;
padding: 0;
color: #9f915a;
font-size: 28px;
line-height: 1.2em;
border-bottom: 2px solid #9f915a;
}

.valiation_head span{
display: inline-block;
margin:0 0.6em 0 0;
padding: 0.2em 0.6em;
color: #000;
background: #9f915a;
font-weight: bold;
}

.valiation_head_notes{
width: 100%;
margin: 20px auto 0;
padding: 0 60px;
}

.contents_valiation{
width: 100%;
display: -webkit-flex;
display: flex ;
flex-wrap: wrap;
justify-content: space-between;
margin: 0 auto 100px;
padding: 0 60px;
list-style: none ;
}

.contents_valiation::after {
display: block;
content:"";
width: 32%;
}

.contents_valiation li{
box-sizing: border-box;
width: 32%;
margin: 20px 0 0;
padding: 0 0 20px;
text-align: center;
border: 1px solid #9f915a;
}

.contents_valiation li a{
color: #eee;
font-size: 14px;
line-height: 1em;
transition: 0.25s;
}

.contents_valiation li a:hover{
opacity: 0.7;
}

.contents_valiation li img{
display: block;
width: 100%;
border-bottom: 1px solid #9f915a;
}

.contents_valiation li .link_arrow{
margin: 20px auto 0;
}

.valiation_title{
width: 100%;
padding: 10px;
font-size: 18px;
line-height: 1.2em;
border-bottom: 1px solid #9f915a;
color: #9f915a;
}

.valiation_notes{
width: 100%;
display: -webkit-flex;
display: flex;
flex-wrap: wrap;
justify-content: space-evenly;
list-style: none;
}

.valiation_notes div{
width: 45%;
font-size: 12px;
line-height: 1.5em;
color: #eee;
margin: 15px 0 0;
}

.valiation_notes div span{
display: block;
margin: 0 auto 0.2em;
padding: 0.2em 0.5em;
border-bottom: 1px solid #9f915a;
}
.valiation_notes div p{
padding: 0 0.5em;
}

.valiation_specs{
width: 100%;
margin: 15px auto 0 ;
padding: 0 3%;
font-size: 12px;
line-height: 2em;
}

.link_arrow{
display: block;
margin: 20px 0 0;
padding: 10px 0;
position: relative;
border: 1px solid #eee;
width: 200px;
display: flex;
justify-content: center;
align-items: center;
color: #eee;
}

.link_arrow:before,
.link_arrow:after{
content: '';
display: block;
position: absolute;
top: 50%;
right: 0;
height: 1px;
background: #9f915a;
}

.link_arrow:before{
width: 60px;
transform: translate(30px, 0px);
}

.link_arrow:after{
width: 15px;
transform-origin: right center;
transform: translate(30px, 0px) rotate(25deg);
}

.bottom_message{
width: 300px;
margin: 100px auto 0;
}

.lineup_bottom_message, 
.valiation_bottom_message, 
.effects_bottom_message{
width: 300px;
margin: 80px auto 0;
}

.bottom_message img, 
.lineup_bottom_message img, 
.valiation_bottom_message img, 
.effects_bottom_message img{
display: block;
width: 100%;
}

.bottom_message a,
.lineup_bottom_message a, 
.valiation_bottom_message a, 
.effects_bottom_message a{
transition: 0.25s;
}

.bottom_message a:hover,
.lineup_bottom_message a:hover, 
.valiation_bottom_message a:hover, 
.effects_bottom_message a:hover{
opacity: 0.7;
}

.footerlabel{
width: 100%;
}


/* エフェクター追加CSS*/ 

#maincontents_effects .top_comment .sub_title{
width: 100%;
margin: -20px auto 40px;
font-size: 14px;
line-height: 2em;
color: #9f915a;
}

#maincontents_effects .top_comment_image{
float: right;
width: 40%;
}

#maincontents_effects .stock_list{
display: block;
margin: 50px auto 0;
padding: 15px 0;
position: relative;
width: 300px;
display: flex;
justify-content: center;
align-items: center;
background: #000;
color: #fff;
font-size: 20px;
line-height: 1em;
border: 1px solid #000;
transition: .5s;
border-radius: 5px;
}

#maincontents_effects .stock_list:before,
#maincontents_effects .stock_list:after{
content: '';
display: block;
position: absolute;
top: 50%;
right: 0;
height: 1px;
background: #9f915a;
}

#maincontents_effects .stock_list:before{
width: 60px;
transform: translate(30px, 0px);
}

#maincontents_effects .stock_list:after{
width: 15px;
transform-origin: right center;
transform: translate(30px, 0px) rotate(25deg);
}

#maincontents_effects .stock_list:hover{
background: #fff;
color: #000;
}

#maincontents_effects .tab_contents{
width: 100%;
margin: 100px auto 0;
padding: 0 60px;
}

#maincontents_effects .tab_contents .tab-wrap {
background: #fffef3;
display: flex;
flex-wrap: wrap;
overflow: hidden;
}

#maincontents_effects .tab_contents .tab-label {
color: #fff;
cursor: pointer;
flex: 1;
order: -1;
padding: 1.2em 0.2em;
position: relative;
text-align: center;
transition: cubic-bezier(0.4, 0, 0.2, 1) .2s;
user-select: none;
-webkit-tap-highlight-color: transparent;
background: #9f915a;
margin: 0 1px;
font-weight: bold;
font-size: 15px;
line-height: 1.2em;
}

#maincontents_effects .tab_contents .tab-label:hover {
background: #000;
color: #fff;
}

#maincontents_effects .tab_contents .tab-switch:checked + .tab-label {
color: #000;
background: #fffef3;
}

#maincontents_effects .tab_contents .tab-label::after {
background: #9f915a;
top: 0;
content: '';
display: block;
height: 3px;
left: 0;
opacity: 0;
pointer-events: none;
position: absolute;
transform: translateX(100%);
transition: cubic-bezier(0.4, 0, 0.2, 1) .2s 80ms;
width: 100%;
z-index: 1;
}

#maincontents_effects .tab_contents .tab-switch:checked ~ .tab-label::after {
transform: translateX(-100%);
}

#maincontents_effects .tab_contents .tab-switch:checked + .tab-label::after {
opacity: 1;
transform: translateX(0);
}

#maincontents_effects .tab_contents .tab-content {
height:0;
opacity:0;
pointer-events:none;
transform: translateX(-30%);
transition: transform .3s 80ms, opacity .3s 80ms;
width: 100%;
}

#maincontents_effects .tab_contents .tab-switch:checked ~ .tab-content {
transform: translateX(30%);
}

#maincontents_effects .tab_contents .tab-switch:checked + .tab-label + .tab-content {
height: auto;
opacity: 1;
order: 1;
pointer-events:auto;
transform: translateX(0);
}

#maincontents_effects .tab_contents .tab-switch {
display: none;
}

#maincontents_effects .tab_contents .tab-contentarea {
width: 100%;
margin: 0 auto;
font-size: 16px;
line-height: 2em;
padding: 0 30px 50px;
box-sizing: border-box;
}

#maincontents_effects .tab_contents .tab-contentarea img{
width: 100%;
display: block;
}

#maincontents_effects .tab_contents .gallery, 
.instruction{
width: 100%;
margin: 30px auto 0;
display: flex ;
justify-content: space-between;
flex-wrap: wrap;
padding: 0;
}

#maincontents_effects .tab_contents .instruction li{
width: 50%;
margin: 20px 0 0;
}

#maincontents_effects .tab_contents .instruction_text{
width: 100%;
margin: 30px auto 0;
text-align: justify;
word-break: break-all;
}

#maincontents_effects .tab_contents .instruction_text p{
margin: 1em auto 0;
}

#maincontents_effects .tab_contents .gallery li{
width: calc(calc(100% / 3) - 15px);
margin: 20px 0 0;
}

#maincontents_effects .tab_contents .tab-contentarea iframe:first-child {
margin: 50px 0 0;
}


@media only screen and (max-width: 1000px) {
.contents_valiation li .link_arrow{
margin: 15px auto 0;
width: 150px;
}

.contents_valiation li .link_arrow:before{
width: 30px;
transform: translate(15px, 0px);
}

.contents_valiation li .link_arrow:after{
width: 10px;
transform-origin: right center;
transform: translate(15px, 0px) rotate(25deg);
}
}


@media only screen and (max-width: 880px) {

.footercontents .left_contents{
width: 100%;
margin: 0 auto;
padding: 0;
}

.footercontents .right_contents{
width: 100%;
margin: 50px auto 0;
}
}


@media only screen and (max-width: 750px) {

/* SPスライダーCSS*/ 

.swiper-button-prev,
.swiper-button-next {
display: none;
}

.slide-img {
height: 300px;
}

.sleder-header{
height:70px;
margin: -10px 0 0;
}

.slide-text{
font-size: 20px;
top: 20%;
}

.slide-text p{
margin: 20px 0;
text-shadow: 0 0 4px rgba(17, 17, 17, .9);
}

.slide-text span{
font-size: 14px;
padding: 10px 30px;
}

.fixed-text_third{
top: 30%;
font-size: 18px;
}

#contentsarea .slide-text p,
#contentsarea_lineup .slide-text p,
#contentsarea_effects .slide-text p{
font-size: 24px;
padding: 0 1.5em;
}

#contentsarea .slide-text span,
#contentsarea_lineup .slide-text span,
#contentsarea_effects .slide-text span{
font-size: 16px;
padding: 3px 20px;
}

#contentsarea .fixed-text, 
#contentsarea .fixed-text_third,
#contentsarea_lineup .fixed-text, 
#contentsarea_lineup .fixed-text_third,
#contentsarea_effects .fixed-text, 
#contentsarea_effects .fixed-text_third{
font-size: 16px;
}

#contentsarea .fixed-text p, 
#contentsarea .fixed-text_third p,
#contentsarea_lineup .fixed-text p, 
#contentsarea_lineup .fixed-text_third p,
#contentsarea_effects .fixed-text p, 
#contentsarea_effects .fixed-text_third p{
font-size: 24px;
padding: 0 1.5em;
}


/* SPボディCSS*/ 

.top_comment{
width: 100%;
font-size: 15px;
margin: 0 auto;
padding: 60px 8% 0;
}

.top_comment span{
font-size: 24px;
margin: 0 0 20px;
}

.top_comment_notes span{
font-size: 12px;
margin: 0 0 20px;
}

#maincontents,
#maincontents_effects{
padding: 0;
}

#maincontents_lineup, 
#maincontents_valiation{
padding: 0;
}

#maincontents h4, 
#maincontents_lineup h4, 
#maincontents_valiation h4{
font-size: 40px;
margin: 60px auto 40px;
}

#maincontents_lineup h5{
font-size: 40px;
margin: 60px auto 30px;
}

.maincontents_products{
width: 100%;
padding: 0;
}

figure.products_link p {
padding: 5px;
font-size: 12px;
}

figure.products_link h6 {
font-size: 20px;
text-shadow: 0 0 4px rgba(17, 17, 17, .9);
}

.list_btn{
padding: 0 0 60px;
}

.stock_list{
margin: 40px auto 0;
padding: 10px 0;
width: 200px;
font-size: 20px;
}

.stock_list:before{
width: 50px;
transform: translate(25px, 0px);
}

.stock_list:after{
transform: translate(25px, 0px) rotate(25deg);
}

#footerarea{
width: 100%;
margin: 0 auto;
padding: 60px 8%;
}

.footercontents h5{
font-size: 16px;
}

.footercontents p{
font-size: 22px;
}

.footercontents .footer_comment{
font-size: 15px;
}


/* SP下層ボディCSS*/ 

.contents_lineup{
width: 100%;
font-size: 12px;
margin: 0 0 60px;
padding: 0 8%;
}

.contents_lineup div{
left: 8%;
}

.contents_lineup div p{
font-size: 20px;
margin-bottom: 5px;
}

.typeicon_area{
font-size: 5px;
}

.situation_icon{
padding: 3px;
margin: 8px 3px 0 0;
}

.equipment_icon{
padding: 3px;
margin: 8px 3px 0 0;
background: rgba(0, 0, 0, .5);
}

.valiation_head{
width: 84%;
padding: 0;
font-size: 20px;
}

.valiation_head_notes{
width: 100%;
padding: 0 8%;
}

.contents_valiation{
width: 100%;
margin: 0 auto 60px;
padding: 0 8%;
}

.contents_valiation::after{
width: 48%;
}

.contents_valiation li{
width: 48%;
padding: 0 0 30px;
}

.contents_valiation li a{
font-size: 12px;
}

.contents_valiation li .link_arrow{
width: 110px;
margin: 30px auto 0;
padding: 10px 0;
}

.valiation_title{
width: 100%;
padding: 5px;
font-size: 16px;
}

.valiation_notes{
padding: 10px 12% 0;
}

.valiation_notes div{
width: 100%;
margin: 20px 0 0;
}

.valiation_specs{
margin: 20px auto 0;
padding: 0 12%;
}

.link_arrow{
margin: 15px 0 0;
padding: 5px 0;
width: 100px;
justify-content: center;
align-items: center;
}

.link_arrow:before,
.link_arrow:after{
top: 50%;
right: 0;
height: 1px;
}

.link_arrow:before{
width: 50px;
transform: translate(40px, 0px);
}

.link_arrow:after{
width: 15px;
transform-origin: right center;
transform: translate(40px, 0px) rotate(25deg);
}

.bottom_message{
width: 50%;
max-width: 200px;
margin: 0 auto;
padding: 60px 0 0 ;
}

.lineup_bottom_message{
width: 50%;
max-width: 200px;
margin: 0 auto;
padding: 0 0 60px;
}

.valiation_bottom_message, 
.effects_bottom_message{
width: 50%;
max-width: 200px;
margin: 60px auto 0;
padding: 0 0 60px;
}


/* SPエフェクター追加CSS*/ 

#maincontents_effects .top_comment .sub_title{
margin: -20px auto 15px;
font-size: 12px;
}

#maincontents_effects .top_comment_image{
float: none;
width: 100%;
}

#maincontents_effects .list_btn{
padding: 0;
}

#maincontents_effects .stock_list{
margin: 30px auto 0;
padding: 10px 0;
width: 200px;
font-size: 14px;
}

#maincontents_effects .stock_list:before{
width: 50px;
transform: translate(25px, 0px);
}

#maincontents_effects .stock_list:after{
transform: translate(25px, 0px) rotate(25deg);
}

#maincontents_effects .tab_contents{
width: 100%;
margin: 60px auto 0;
padding: 0 8%;
}

#maincontents_effects .tab_contents .tab-label {
margin: 0 1px;
font-size: 11px;
}

#maincontents_effects .tab_contents .tab-label::after {
height: 3px;
}

#maincontents_effects .tab_contents .tab-contentarea {
font-size: 14px;
padding: 0 5% 30px;
}

#maincontents_effects .tab_contents .instruction li{
width: 100%;
margin: 0;
}

#maincontents_effects .tab_contents .instruction_text{
margin: 15px 0 0;
}

#maincontents_effects .tab_contents .gallery{
margin: 14px auto 0;
}

#maincontents_effects .tab_contents .gallery li{
width: calc(50% - 8px);
margin: 16px 0 0;
}

#maincontents_effects .tab_contents .tab-contentarea iframe:first-child {
margin: 30px 0 0;
}
}


@media only screen and (max-width: 450px) {

.contents_lineup div{
width: 84%;
}

.contents_lineup div p{
font-size: 18px;
}

.valiation_head{
padding: 0 0 0.3em;
text-align: center;
}

.valiation_head span{
display: block;
margin: 0 0 0.3em;
padding: 0.3em 0;
}
}


@media only screen and (max-width: 400px) {

.contents_valiation li {
width: 100%;
}

.valiation_title {
padding: 0.5em 5px;
font-size: 18px;
}

.valiation_notes div {
font-size: 13px;
}

.contents_valiation li .link_arrow {
width: 150px;
}

.contents_valiation li a {
font-size: 14px;
}
}