@charset "utf-8";

/*
font-family: 'Montserrat', sans-serif;
Medium 500
SemiBold 600

font-family: 'Noto Sans JP', sans-serif;
Medium 500
Bold 700

/*--------------------------------------------------------
	reset 
---------------------------------------------------------*/
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td { margin: 0; padding: 0; }
address,caption,cite,code,dfn,em,strong,th,var { font-style: normal; }
ul,ol { list-style-type: none; }
em,strong,th,address { font-style: normal; font-weight: normal; text-align: left; }
h1,h2,h3,h4,h5,h6 { font-weight: normal; font-size: 100%; }
img,
object,
embed { border: 0; vertical-align: top; }
img { max-width: 100%; vertical-align: bottom; }
a{ outline: none;}
hr { border: none;}
table { border-collapse: collapse; border-spacing: 0; font-size: 100%; }
li { list-style-type: none; }
strong { font-weight: bold; }

/*-------------------------------------------------
	base
--------------------------------------------------*/
body {position: relative;  color: #000; font-family: 'Noto Sans JP', sans-serif; font-weight: 500; font-size: 16px; line-height: 1.5; /*-webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;*/ -webkit-text-size-adjust:100%;}
a{outline: none;}
/*txt img active*/
::selection ,
::-moz-selection { background:#666; }
img::selection,
img::-moz-selection { background:none; }
/*cookie*/
#onetrust-banner-sdk{ outline: none; }

/*-------------------------------------------------
	fade
--------------------------------------------------*/
.wrap_f{ width: 100%; height: 100%; position: relative; }
.wrap_f::after {content: ''; display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: #b7cfea; pointer-events: none; user-select: none; z-index: 300; opacity: 1; transition:1s; }
.wrap_f.fade::after { opacity: 0; pointer-events: none; user-select: none; }

/*anime set
------------------------*/
.main_img img,
.main h1,
.main .honda_logo,
.concept p,
#cub .img_box img,
#cub .txt_box h2,
#cub .txt_box .txt,
#dial .img_box img,
#dial .txt_box h2,
#dial .txt_box p,
.co .img_box,
.co h2,
.co p,
.co .crown_img,
.co_r h2,
.co_r p,
.spec h2,
.spec .h2_bar,
.spec .img_box,
.spec .img_box,
.spec h3,
.spec,
.spec .spec_btn{ visibility: hidden; }


/*-------------------------------------------------
	txt
--------------------------------------------------*/
/*letter-spacing
------------------------------*/
.ls_1{letter-spacing: 1px;}
@media (max-width: 1400px) {
.ls_1{letter-spacing: .5px;}
}/*END*/
@media (max-width: 1024px) {
.ls_1{letter-spacing: 1px;}
}/*END*/
@media (max-width: 640px) {
.ls_1{letter-spacing: 0px;}
}/*END*/

/*line-height
------------------------------*/

/*--- lh_3 ---*/
.lh_txt{line-height: 2.2;}
@media (max-width: 1400px) {
.lh_txt{line-height: 2.3;}
}/*END*/
@media (max-width: 1024px) {
.lh_txt{line-height: 2.3;}
}/*END*/
@media (max-width: 640px) {
.lh_txt{line-height: 2.1;}
}/*END*/

/*--- lh_22 ---*/
.lh_2{line-height: 2.2;}
@media (max-width: 1400px) {
.lh_2{line-height: 2.2;}
}/*END*/
@media (max-width: 1024px) {
.lh_2{line-height: 2.2;}
}/*END*/
@media (max-width: 640px) {
.lh_2{line-height: 2;}
}/*END*/

/*--- lh_1 ---*/
.lh_1{line-height: 1.9;}
@media (max-width: 1400px) {
.lh_1{line-height: 1.9;}
}/*END*/
@media (max-width: 640px) {
.lh_1{line-height: 1.7;}
}/*END*/

/*txt size
------------------------------*/
/*--- txt ---*/
.txt{ font-size: 16px; }
@media (max-width: 1400px) {
.txt{ font-size: 15px; }
}/*END*/
@media (max-width: 1200px) {
.txt{ font-size: 1.255vw; }
}/*END*/
@media (max-width: 1024px) {
.txt{ font-size: 15px; }
}/*END*/

@media (max-width: 640px) {
.txt{ font-size: 14px; }
}/*END*/
@media (max-width: 420px) {
.txt{ font-size: 14px; }
}/*END*/
@media (max-width: 400px) {
.txt{ font-size: 13.5px; }
}/*END*/
@media (max-width: 360px) {
.txt{ font-size: 12.5px; }
}/*END*/

/*--- txt_l ---*/
.txt_l{ font-size: 17px; line-height: 2; letter-spacing: 1px; font-weight: 500;}
@media (max-width: 1400px) {
.txt_l{ font-size: 16px; }
}/*END*/
@media (max-width: 1200px) {
.txt_l{ font-size: 1.33vw; }
}/*END*/
@media (max-width: 1024px) {
.txt_l{ font-size: 17px; }
}/*END*/

@media (max-width: 640px) {
.txt_l{ font-size: 15px; }
}/*END*/
@media (max-width: 420px) {
.txt_l{ font-size: 14px; }
}/*END*/
@media (max-width: 400px) {
.txt_l{ font-size: 13.5px; }
}/*END*/
@media (max-width: 360px) {
.txt_l{ font-size: 12.5px; }
}/*END*/

/*--- txt2 ---*/
.txt2{ font-size: 17px; }
@media (max-width: 1400px) {
.txt2{ font-size: 16px; }
}/*END*/
@media (max-width: 1200px) {
.txt2{ font-size: 1.155vw; }
}/*END*/
@media (max-width: 1024px) {
.txt2{ font-size: 17px; }
}/*END*/
@media (max-width: 640px) {
.txt2{ font-size: 14px; }
}/*END*/
@media (max-width: 420px) {
.txt2{ font-size: 13px; }
}/*END*/
@media (max-width: 400px) {
.txt2{ font-size: 12.5px; }
}/*END*/
@media (max-width: 360px) {
.txt2{ font-size: 11.5px; }
}/*END*/

/*span*/
.txt span,
.txt_s span{ display: inline-block; }
/*---txt_s---*/
.txt_s{ margin-top: 20px; font-size: 14px!important; line-height: 1.6;letter-spacing: .6px; }
@media (max-width: 1200px) {
.txt_s{ margin-top: 15px; font-size: 1.12vw!important; line-height: 1.6; }
}/*END*/
@media (max-width: 950px) {
.txt_s{ margin-top: 15px; font-size: 13px!important; line-height: 1.6; }
}/*END*/
@media (max-width: 640px) {
.txt_s{ margin-top: 15px; font-size: 12px!important; line-height: 1.6;letter-spacing: 0px; }
}/*END*/


/*-------------------------------------------------
	header
--------------------------------------------------*/
header{ position: absolute; z-index: 9999; left: 0; top: 0; width: 100%; }
/*------ header logo ------*/
header img{ width: 100%; }
header .seiko_logo{ width: 130px; position:absolute; right: 35px; top: 35px; font-size: 10px;}
header .s5s_logo{ width: 210px; position:absolute; left: 30px; top: 30px; font-size: 10px;}
@media (max-width: 1600px) {
header .seiko_logo{ width: 8.17vw; right: 2.2vw; top: 2.2vw;}
header .s5s_logo{ width: 13.1vw; left: 1.85vw; top:1.85vw; }
}/*END*/
@media screen and (orientation: portrait) { 
header .seiko_logo{ width: 130px; right: 2.8vw; top: 3vw; }
header .s5s_logo{ width: 100px; left: 2.5vw; top: 3vw;}
}/*END*/
@media screen and (max-width: 750px) and (orientation: portrait) { 
header .seiko_logo{ width: 17vw; right: 2.5vw; top: 4vw;}
header .s5s_logo{ width: 13.5vw; left: 2.5vw; top: 3vw; }
}/*END*/
.s5s_55th_y{ display: block;}
.s5s_55th_t{ display: none;}
@media screen and (orientation: portrait) {
.s5s_55th_y{ display: none;}
.s5s_55th_t{ display: block;}
}/*END*/

/*-------------------------------------------------
	contents
--------------------------------------------------*/
.wrapper{ position: relative; overflow: hidden;}

/*-------------------------------------------------
	main
--------------------------------------------------*/
.main { width: 100%; height: auto; position: relative; z-index: 1; overflow: hidden; outline:none; }
/*---- title_box ----*/
.main .title_box { position: absolute; left: 0; top: 74%; width: 100%; text-align: center; z-index: 2;}
.main .title_box h1{ font-size: 2.15vw; line-height: 1.23; font-family: 'Montserrat', sans-serif; font-weight: 600; color: #fff;}
.main .title_box .honda_logo { width:13.6vw; margin-top: 1.4vw; display: inline-block; }
@media screen and (orientation: portrait) { /* 縦 */
.main .title_box { top: 74%; }
.main .title_box h1{ font-size: 4.5vw; line-height: 1.23;}
.main .title_box .honda_logo { width:27.5vw; margin-top: 3vw;}
}/*END*/
@media screen and (max-width: 640px) and (orientation: portrait) {
.main .title_box { top: 67.2%; }
.main .title_box h1{ font-size: 4.5vw; line-height: 1.23;}
.main .title_box .honda_logo { width:27.5vw; margin-top: 3.4vw;}
}/*END*/
/*---- main_img ----*/
.main .main_img { width: 100%; position: relative; z-index: 1; }
.main .main_img img{ width: 100%; }
/*[ on / off ]*/
.main .x15{display:block;}
.main .x1{display:none;}
.main .tab{display:none;}
.main .sp{display:none;}
@media screen and (max-width: 1400px) {
.main .x15{display:none;}
.main .x1{display:block;}
.main .tab{display:none;}
.main .sp{display:none;}
}/*END*/
@media screen and (orientation: portrait) {
.main .x15{display:none;}
.main .x1{display:none;}
.main .tab{display:block;}
.main .sp{display:none;}
}/*END*/
@media screen and (max-width: 640px) and (orientation: portrait) {
.main .x15{display:none;}
.main .x1{display:none;}
.main .tab{display:none;}
.main .sp{display:block;}
}/*END*/

/*-------------------------------------------------
	concept
--------------------------------------------------*/
.concept{ position: relative; background: #18293b;}
.concept .inner{ padding: 80px 0 85px; width: 95%; margin: 0 auto; position: relative; z-index: 2; text-align: center; }
.concept .inner p{ color: #fff; }
.concept .inner p span{ display: inline-block; }
@media screen and (max-width: 1024px) {
.concept .inner{ max-width: 1200px; }
}/*END*/
@media screen and (max-width: 800px) {
.concept .inner{ width: 95%; max-width: 1000px;  }
}/*END*/
@media screen and (max-width: 640px) {
.concept .inner{ padding: 12vw 0 12.5vw; width: 95%;}
}/*END*/

.concept_br1{ display: none;}
.concept_br2{ display: none;}
@media screen and (max-width: 1250px) {
.concept_br1{ display: inline;}
}/*END*/
@media screen and (max-width: 880px) {
.concept_br2{ display: inline;}
}/*END*/
@media screen and (max-width: 640px) {
.concept_br1{ display: none;}
.concept_br2{ display: none;}
}/*END*/

/*-------------------------------------------------
	para
--------------------------------------------------*/
.para{ position: relative; overflow: hidden; }
.para_inner img{ width: 100%; }
.para_inner{height: 37.5vw; width: 100%; position: relative; overflow: hidden;}
@media (max-width: 1600px){
.para_inner{height: 37.5vw; width: 100%; position: relative; }
}/*END*/
@media (max-width: 1024px){
.para_inner{ height: 70vw; width: 100%; }
}/*END*/
@media (max-width: 750px){
.para_inner{ height: 70vw; width: 100%; }
}/*END*/
/* [ on off ]*/
.para_x1{ display: block;}
.para_sp{ display: none;}
@media screen and (max-width: 1024px) {
.para_x1{ display: none;}
.para_sp{ display: block; }
}/*END*/

/*-------------------------------------------------
	cub
--------------------------------------------------*/
#cub{ background: #b7cfea;  overflow: hidden;}
#cub .inner { width: 100%; position: relative; }
/*txt_box*/
#cub .inner .txt_box{ height: 100%; width: 100%; position: absolute; left: 0; top: 0%; z-index: 2; display: flex; align-items: center; }
#cub .inner .txt_box .txt_box_inner{ margin: 0 auto; width: 90%; max-width: 1070px; padding: 100px 0; position: relative; left: 0; top: 0%; z-index: 1; color: #fff; }
#cub .inner .txt_box .txt_box_inner h2{width: 42%; max-width: 440px; margin-left: -15px; display: block;}
#cub .inner .txt_box .txt_box_inner p{ margin-top: 30px; width: 42%; max-width: 410px; display: block;}
.cub_bg{ width: 2000%; height: 100%; background: #223a52; position: absolute; left:0%; top: 0; margin-left: -1000%; z-index: -1; }
.cub_bg2{ display: none;}
/*img_box*/
#cub .inner .img_box { width: 2050px; margin: 0 0 0 -1025px; padding: 10px 0 40px; position: relative; left: 50%; top: 0px; text-align: right; }
#cub .inner .img_box .cub{ position: relative; z-index:3; width: 68%; width: 1109px; display: inline; z-index: 5; }
@media (max-width:1400px){
/*img_box*/
#cub .inner .img_box { width: 146vw; margin: 0 0 0 -73vw;  }
#cub .inner .img_box .cub img{ width: 79vw; }
/*txt_box*/
#cub .inner .txt_box{ height: 100%; width: 100%; position: absolute; left: 0; top: 0%; z-index: 2; display: flex; align-items: center; }
#cub .inner .txt_box .txt_box_inner{ margin: 0 auto; width: 80%; max-width: 1070px; padding: 7.5vw 0; position: relative; left: 0; top: 0%; z-index: 1; color: #fff; }
#cub .inner .txt_box .txt_box_inner h2{width: 42%; max-width: 440px; margin-left: -15px; display: block;}
}/*END*/
@media (max-width:1024px){
#cub .inner { padding-top: 0px; margin: 0; }
/*img_box*/
#cub .inner .img_box{ width: 100%; margin: 0; padding: 15px 0 40px; position: relative; left: 0%; top: 0px; text-align: center; }
#cub .inner .img_box .cub img{ width: 79vw; }
.cub_bg2{ display: block; width: 1000%; height: 70%; background: #223a52; position: absolute; left:-50%; top: 0; margin-left: -500%; z-index: 2; }
/*txt_box*/
#cub .inner .txt_box{ height: auto; width: 90%; max-width: 800px; margin: 0 auto;  position: relative; left: initial; top: initial; z-index: 2; color: #fff;display: flex; align-items: center; justify-content: center; }
#cub .inner .txt_box .txt_box_inner{ position: relative; padding: 100px 0 10px; margin: 0; text-align: center;}
#cub .inner .txt_box .txt_box_inner h2{ max-width: 450px; width: 90%; margin: 0 auto;}
#cub .inner .txt_box .txt_box_inner p{ margin-top: 30px; width: 100%; max-width: 100%; }
}/*END*/
@media (max-width:750px){
#cub .inner .txt_box .txt_box_inner{ position: relative; padding: 15vw 0 10px;}
#cub .inner .txt_box .txt_box_inner h2{ max-width: 450px; width: 85%; margin: 0 auto;}
}/*END*/
@media (max-width:640px){
#cub .inner .txt_box{  width: 100%;  }
}/*END*/

/*-------------------------------------------------
	Dial & Index
--------------------------------------------------*/
#dial{ background: #000; color: #fff;  overflow: hidden; position: relative;}
#dial .inner{ max-width: 1000px; width: 85%; margin: 0 auto; position: relative; display: flex; align-items: center; }
#dial .inner .img_box{ width: 45%;  margin-right: 11%; position: relative;  justify-content: space-between; }
#dial .inner .img_box .dial_img{ width: 100%; position: relative; right: 0%;}
#dial .inner .txt_box{ width: 34%; margin-right: 8%; position: relative; z-index: 2; }
#dial h2{ color: #b2d1f0; width: 140%; font-family: 'Montserrat', sans-serif; font-weight: 600;}
.dial_bg{ position: absolute; left: 100%; top: -400px; width: 1800px; height: 1800px; margin: -900px 0 0 -900px; background-image: radial-gradient(circle closest-side, rgba(71, 104, 137, 1), rgba(71, 104, 137, 0) 100%); }
#dial p{ margin-top: 20px;}
@media (max-width:1400px){
#dial .inner .txt_box{ width: 32%; margin-right: 8%; position: relative; z-index: 2; }
}/*END*/
@media (max-width:1000px){
#dial .inner{display: block; width: 100%; background: #111;}
#dial .inner .img_box{ width: 100%; background: #000; text-align: center;}
#dial .inner .img_box .dial_img{ width: 80%; right: -2%; margin: 0 auto; }
#dial .inner .txt_box{  padding: 80px 0 ; max-width: 620px; width: 80%; margin: 0 auto; position: relative; z-index: 2; }
.dial_bg{ display: none; }
}/*END*/
@media (max-width:750px){
#dial .inner .txt_box p br{ display: none;}
}/*END*/
@media (max-width:640px){
#dial .inner .txt_box{  padding: 60px 0 ; margin: 0 auto;}
}/*END*/

#dial h2{  font-size: 44px; line-height: 1; }
@media screen and (max-width: 490px) {
#dial h2{ font-size: 9vw; line-height: 1;}
}/*END*/

/*-------------------------------------------------
	co_bg
--------------------------------------------------*/
.co_bg{ padding: 100px 0 .1px; background: url("../img/co_bg.jpg") center top; background-size: contain; position: relative; z-index: -1; }

/*-------------------------------------------------
	co_obi
--------------------------------------------------*/
.co_obi{ position: absolute; left:0; top: 0; width: 100%; height: 100%; } 
.co_obi div{ margin: 0 auto; width: 36.8%; height: 100%; background: #223a52;} 
@media screen and (orientation: portrait) {
.co_obi div{ width: 52.7%; } 
}/*END*/
@media (max-width:1000px){
.co_obi div{ width: 40%; } 
}/*END*/

/*-------------------------------------------------
	co
--------------------------------------------------*/
.co{ margin: 0 auto 100px; width: 92%; max-width: 1200px; display: flex; background: #fff; position: relative; z-index: 1; overflow: hidden; border-radius: 15px; }
@media (max-width:1200px){
.co{ margin: 0 auto 8vw; }
.co_bg{ padding: 8vw 0 .1px;}
}/*END*/
@media (max-width:1000px){
.co{ width: 85%; max-width: 650px; display: block; }
}/*END*/
@media (max-width:640px){
.co{ margin: 0 auto 12vw; }
.co_bg{ padding: 12vw 0 .1px;}
}/*END*/
.co_r{ flex-direction : row-reverse; }
.co .img_box{ width: 50%;}
.co .txt_box{ width: 50%; display: flex; align-items: center; justify-content: center;}
.co .txt_box .inner{ width: 59%;text-align: center; margin: 0 auto; }
@media (max-width:1400px){
.co .txt_box .inner{ width: 57%;}
}/*END*/
@media (max-width:1000px){
.co .img_box{ width: 100%;}
.co .txt_box{ width: 100%; display: block; padding: 60px 0; }
}/*END*/
@media (max-width:640px){
.co .txt_box .inner{ width: 75%; }
}/*END*/
@media (max-width:540px){
.co .txt_box{ padding: 11vw 0; }
}/*END*/
.co .img_box img{ width: 100%;}
.co h2{ color: #132a50; font-size: 44px; line-height: 1; width: 140%;text-align: left; font-family: 'Montserrat', sans-serif; font-weight: 600;}
@media screen and (max-width: 490px) {
.co h2{ color: #132a50; font-size: 9vw; line-height: 1;}
}/*END*/
.co p{margin-top: 15px; text-align: left;}
/* crown */
.crown_img{ max-width: 80%; margin: 20px auto 0;}
/* [ on off ]*/
.co .x15{display:block;}
.co .x1{display:none;}
@media (max-width: 500px) {
.co .x15{display:none;}
.co .x1{display:block;}
}/*END*/
.space {background:#e3e1dc; width: 100%; height: 100px;} 
@media screen and (max-width: 750px) {
.space {height: 12vw;} 
}/*END*/


/* [ on off ]*/
.co .txt_box p br{display:inline;}
@media (max-width: 500px) {
.co .txt_box p br{display:none;}
}/*END*/



/*-------------------------------------------------
	spec
--------------------------------------------------*/
.spec{ padding: 0 0 0px;  background: #fff; position: relative; }
.spec .title_box{ padding: 80px 0 60px;  }
@media screen and (max-width: 640px) {
.spec{ padding: 0 0 0vw; }
.spec .title_box{ padding: 12vw 0 12vw;  }
}/*END*/
.spec h2{ font-size: 40px; line-height: 1.3; text-align: center; font-family: 'Montserrat', sans-serif; font-weight: 600;}
@media screen and (max-width: 640px) {
.spec h2{ font-size: 6.2vw;}
}/*END*/
.spec h2 span{ display: inline-block;}
.h2_bar { margin: 35px auto 0; max-width: 120px; height: 7px; display: block; border-radius: 15px; }
.h2_bar1 { background: #b60a00; }
@media screen and (max-width: 640px) {
.h2_bar { margin: 5vw auto 0; max-width: 110px; height: 6px; }
}/*END*/
@media screen and (max-width: 420px) {
.h2_bar { margin: 5vw auto 0; max-width: 100px; height: 5px; }
}/*END*/
.spec .inner{ margin: 0 auto; width: 100%; max-width: 650px;  display: flex; justify-content: center; }
.spec .inner .img_box{ max-width: 280px; }
.spec .inner .txt_box{ margin-left: 10%;margin-top: 90px; line-height: 1.5; text-align: center; }
@media screen and (max-width: 900px) {
.spec .inner .txt_box{ margin-left: 7.5%;}
}/*END*/
@media screen and (max-width: 650px) {
.spec{ background: #fff; padding: 0 0 0px; }
.spec .inner .img_box{ width:42%; }
.spec .inner .txt_box{ margin-left: 5%; margin-top: 13vw; }
}/*END*/
@media screen and (max-width: 550px) {
.spec .inner .txt_box{ margin-left: 5%; margin-top: 11vw; }
}/*END*/
@media screen and (max-width: 500px) {
.spec .inner .txt_box{ margin-left: 3%; margin-top: 7vw; }
}/*END*/
@media screen and (max-width: 400px) {
.spec{ background: #fff; padding: 0 0 70px; }
.spec .inner{ margin: 0 auto; width: 100%; max-width: 650px; display: block; }
.spec .inner .txt_box{ margin:-10vw 0 0 0%; display: block;}
.spec .inner .img_box{ width:52%; margin: 0 auto; }
}/*END*/
/* [ on off ]*/
.spec .x15{display:block;}
.spec .x1{display:none;}
@media (max-width: 500px) {
.spec .x15{display:none;}
.spec .x1{display:block;}
}/*END*/
.number		{ margin-top: 0px; font-size: 26px; letter-spacing: 1px; font-family: 'Montserrat', sans-serif; font-weight: 500; }
.caribre	{ margin-top: 5px; font-size: 15px; }
.price		{ margin-top: 7px; font-size: 18px; }
.price span	{ margin-top: 0px; font-size: 12px; margin-left: 3px; }
.limited	{ margin-top: 7px; font-size: 15px; position: relative; padding-bottom: 4px; display: inline-block;} .limited::after { content: ''; position: absolute; left: 0px; bottom: 0px; width: 100%; height: 2px; background: #000; }
.limited_sub{ margin-top: 3px; font-size: 12px; }
.spec_txt	{ margin-top: 7px; font-size: 14px; }
@media screen and (max-width: 640px) {
.number		{ margin-top: 0px; font-size: 24px; }
.caribre	{ margin-top: 5px; font-size: 14px; }
.price		{ margin-top: 7px; font-size: 16px; }
.price span	{ margin-top: 0px; font-size: 11px; margin-left: 3px; }
.limited	{ margin-top: 7px; font-size: 14px; position: relative; padding-bottom: 4px; display: inline-block;}
.limited_sub{ margin-top: 3px; font-size: 11px; }
.spec_txt	{ margin-top: 7px; font-size: 13px; }
}/*END*/
/*spec_btn*/
.spec_btn { margin:22px auto 0; display: block;}
.spec_btn a {width: 190px; padding: 16px 0 18px; margin:0 auto; font-size: 14px; line-height: 1; font-weight: 400;letter-spacing: .5px; color: #fff; background: #223a51; display: block; transition: 0.3s; text-decoration: none; border-radius: 4px;}
.spec_btn a:hover { cursor: pointer; color: #fff; opacity: 0.7;}
@media screen and (max-width: 640px) {
.spec_btn { margin: 18px auto 0; }
.spec_btn a {  width: 180px; padding: 14px 0 16px; font-size: 13px; letter-spacing: 0px;}
}/*END*/
@media screen and (max-width: 420px) {
.spec_btn { margin: 15px auto 0; }
.spec_btn a { font-size: 12px; }
}/*END*/
#spec_SRPJ75 .spec_btn a { background: #4b4b4c;}
#spec_SRPJ75 .spec_btn a:hover { background: #7f7f81; }

/*-------------------------------------------------
	gotop
--------------------------------------------------*/
.gotop { position:absolute; bottom:0px; right:20px;width:50px; height:70px; box-sizing:border-box; border-radius: 0%; z-index: 2000!important; }
.gotop a{ position: relative; display:block; background:rgba(33,33,33,0.8); text-decoration:none;width:50px; height:50px; box-sizing:border-box; border-radius: 0%; z-index: 11; transition: 0.3s; }
.gotop a::after { position:absolute; top:50%; left:50%; content: ''; width: 16px; height: 16px; margin: -8px 0 0 -8px; background: url("../img/page_top.svg") no-repeat ; background-size: cover;}
.gotop a:hover { background:rgba(60,60,60,0.5); }
@media (max-width: 500px) {
.gotop { position:absolute; bottom:0px; right:10px; width:40px; height:50px; }
.gotop a{ width:40px; height:40px; }
.gotop a::after { width: 14px; height: 14px; margin: -7px 0 0 -7px; }
}/*END*/

/*-------------------------------------------------
	footer
--------------------------------------------------*/
footer{ background: #262626; width: 100%; height: auto; position: relative; z-index: 10; }
footer::after { content:" "; display:block; clear:both;}
.foot_l{ float: left; margin: 59px 0 0 40px;}
.foot_l .foot_logo { float: left; line-height: 1; margin-bottom: 53px; }
.foot_l .foot_logo img { width: 131px; transition: 0.2s; }
.foot_l .foot_logo a:hover img{ opacity: 0.6;}
.foot_l .copyright { float: left; margin: 13px 0 0 32px; font-size: 12px; line-height: 1; letter-spacing: 1px; color: #fff; font-family: Arial, Helvetica, sans-serif; font-weight: 400;}
@media (max-width: 750px) { 
.foot_l{ float: none; margin: 39px 0 0 0px; text-align: center;}
.foot_l .foot_logo { float: none; line-height: 1; margin-bottom: 23px; }
.foot_l .copyright { float: none; margin: 13px 0 0 0px; padding-bottom: 30px; font-size: 12px; line-height: 1; color: #fff; }
}/*END*/

*,:after,:before { box-sizing: border-box;}
.foot_r { float: right; padding-top: 58px; margin: 0 35px 0 0;}
.foot_r .sns { display: flex; list-style-type: none;}
.foot_r .sns img { width: 100%;}
.foot_r .sns > li { width: 40px; margin-right: 12px; padding: 5px; line-height: 1; border-radius: 50%; transition: 0.3s; background: #3c3c3c;}
.foot_r .sns > li:nth-child(2) { margin-right: 0;}
.foot_r .sns > li:hover { opacity: 0.5;}
.foot_r .sns > li img { padding: 5px;}
@media (max-width: 750px) {
 .foot_r {float: none;padding-top: 40px;margin: 0px; }
 .foot_r .sns {position: static;margin-bottom: 20px;justify-content: center; }
 .foot_r .sns > li {margin-right: 10px; }
}/*END*/


/*-------------------------------------------------
	販売終了txt
--------------------------------------------------*/
.end_sale {
  font-size:0.9em;
  font-weight:bold;
  margin-top:10px;
  visibility:visible;
}