@charset "utf-8";

*                                            {margin: 0;padding: 0;-webkit-text-size-adjust: 100%;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;-ms-box-sizing: border-box;-o-box-sizing: border-box;box-sizing: border-box;}
html,body                                    {height: 100%;font: normal 12px/20px 'Hiragino Kaku Gothic ProN',Meiryo;text-align: center;}
body                                         {}
#container                                   {width: 100%;min-width: 1024px;_height: 100%;height: auto !important;min-height: 100%;position: relative;overflow-x: hidden;color: #fff;background: #000;z-index: 2;}
header,article,footer                        {width: 100%;min-width: 1024px;}
.container                                   {width: 1002px;margin: 0 auto;text-align: left;position: relative;}

/** header config
------------------------------------------ **/

header                                       {padding: 20px 0 0;}

header .about                                {padding: 0 0 15px;overflow: hidden;}
header .about ul                             {display: inline-block;overflow: hidden;}

header .about li                             {float: left;}
header .about > ul:first-of-type             {float: left;}
header .about > ul:last-of-type              {float: right;}

header .about > ul:first-of-type li          {
 font-size: 18px;
 padding: 0 10px;
 border-left: 1px solid #4d4d4d;
}
header .about > ul:first-of-type li a        {color: #fff;}
header .about > ul:first-of-type li:first-child {
 padding-left: 0;
 border-left: none;
}

header .about > ul:last-child li             {
 font-size: 12px;
 line-height: 18px;
 padding: 3.5px 0;
}

header .about > ul:last-child li:last-child a {
 padding-right: 0;
 border-right: none;
}
header .about > ul:last-child li a           {
 color: #fff;
 border-right: 1px solid #fff;
 padding: 0 10px;
}

header nav                                   {
 height: 40px;
 position: relative;
}

header nav h1                                {
 width: 210px;
 height: 50px;
 margin: 0 0 0 -120px;
 position: absolute;
 left: 50%;
 bottom: 2px;
}

header nav h1 a                              {
 display: block;
 width: 100%;
 height: 100%;
 text-indent: 100%;
 white-space: nowrap;
 overflow: hidden;
 background: url(../img/header/logo.png) no-repeat 0 0;
}

header nav ul                                {display: inline-block;height: 40px;margin: 0 -15px;}

header nav > ul:first-of-type                {float: left;}
header nav > ul:last-of-type                 {float: right;margin: 0 -10px;}

header nav li                                {
 display: inline-block;
 margin: 0 15px;
 float: left;
 position: relative;
 font-family: 'DINE';
 font-size: 18px;
 line-height: 30px;
 vertical-align: middle;
}

header nav > ul:last-of-type li              {margin: 0 10px;}

header nav li a                              {
 display: block;
 width: 100%;
 padding: 7px 10px 3px;
 color: #fff;
}

header nav li a.active,
header nav li a:hover                        {
 background: #b71c1e;
 text-decoration: none;
 opacity: 1;
}

header nav ul ul                             {
 width: 85px;
 margin: 0;
 padding: 0;
 display: none;
 position: absolute;
 top: 40px;
 z-index: 4;
}

header nav ul ul li                          {
 width: 100%;
 margin: 0;
 padding: 0;
 overflow: hidden;
 font-family: 'DINM';
 font-size: 13px;
 line-height: 23px;
 text-align: left;
}

header nav ul ul li a                        {
 display: block;
 width: 100%;
 height: 100%;
 margin: 0;
 padding-left: 1.5em;
 position: relative;
 background: #b71c1e;
}

header nav ul ul li a:before                 {
 font-size: 10px;
 display: block;
 content: ">";
 width: 1em;
 height: 1em;
 position: absolute;
 left: 1em;
 top: auto;
}

/** #slider config
------------------------------------------ **/

#slider                                      {
 width: 100%;
 height: 670px;
 position: relative;
 background: #000;
 z-index: auto;
}

#slider ul                                   {
 width: 1300px;
 height: 670px;
 margin: 0 0 0 -650px;
 position: absolute;
 left: 50%;
 top: 0;
 overflow: hidden;
 z-index: 1;
}

#slider li img                                  {
 width: 100%;
 height: auto;
}

#slider:before,
#slider:after                                {
 width: 1300px;
 margin: 0 0 0 -650px;
 display: block;
 content: "";
 position: absolute;
 left: 50%;
 z-index: 2;
}

#slider:before                               {
 height: 115px;
 top: 0;
 background: url(../img/slider/before.png) no-repeat center center;
}
#slider:after                                {
 height: 120px;
 bottom: 0;
 background: url(../img/slider/after.png) no-repeat center center;
}

/** article config
------------------------------------------ **/

article                                      {padding: 0 0 525px;position: relative;overflow: hidden;z-index: 3;}

article.page h2                              {
 font-weight: normal;
 font-family: "DINE";
 width: 100%;
 position: relative;
 padding: 140px 0 55px;
 font-size: 65px;
 line-height: 65px;
 background: url(../img/article/h2.jpg) no-repeat center center;
}

article.page h2 small                        {
 display: block;
 font-size: 16px;
 line-height: 20px;
}
article.page h2:before,
article.page h2:after                        {
 width: 1300px;
 margin: 0 0 0 -650px;
 display: block;
 content: "";
 position: absolute;
 left: 50%;
 z-index: 2;
}

article.page h2:before                       {
 height: 115px;
 top: 0;
 background: url(../img/slider/before.png) no-repeat center center;
}
article.page h2:after                        {
 height: 120px;
 bottom: 0;
 background: url(../img/slider/after.png) no-repeat center center;
}

article.page #punkz                          {
 letter-spacing: -.4em;
 text-align: right;
}

article.page #punkz li                       {
 display: inline-block;
 letter-spacing: normal;
 font-size: 12px;
 line-height: 18px;
 text-align: right;
}

article.page #punkz li a                     {
 margin: 0 3em 0 0;
 display: block;
 color: #fff;
 position: relative;
}

article.page #punkz li a:after               {
 display: block;
 content: ">";
 width: 1em;
 height: 18px;
 position: absolute;
 right: -2em;
 top: 0;
 font-size: 12px;
 line-height: 18px;
}

/** #intro config
------------------------------------------ **/

#intro h2                                    {
 display: inline-block;
 margin: 0 0 20px;
 padding: 0 0 3px 25px;
 font-weight: normal;
 font-family: 'DINE';
 font-size: 55px;
 line-height: 55px;
 vertical-align: middle;
 clear: both;
 background: url(../img/article/intro/h2.png) no-repeat 2px bottom;
}

#intro h2 small                              {
 font-size: 16px;
 vertical-align: middle;
}

#sec1                                        {
 margin: 0 0 35px;
 background: rgba(91,89,89,.4);
}

#sec1 .list                                  {
 margin: 0 -16px;
 padding: 24px 0;
 overflow: hidden;
}

#sec1 .list li                               {
 float: left;
 width: 484px;
 height: 147px;
 margin: 16px;
}
#sec1 .list li a                             {
 display: block;
 width: 100%;
 height: 100%;
 overflow: hidden;
 opacity: 1;
}
#sec1 .list li a:hover                       {opacity: .6;}

#sec2                                        {
 height: 325px;
 margin: 0 0 35px;
 background: url(../img/article/intro/sec2/bg.png) repeat-x center 22px ;
}

#sec2 .list                                  {
 margin: 0 -12px;
 overflow: hidden;
}

#sec2 .list li                               {
 float: left;
 width: 232px;
 margin: 0 12px;
 text-align: center;
}

#sec2 .list li .thumb                        {
 width: 232px;
 height: 232px;
 margin: 0 0 20px;
 overflow: hidden;
 border: 3px solid #b71c1e;
 border-radius: 50%;
 background: url(../img/article/intro/sec2/li.png) no-repeat center center;
}

#sec2 .list li .thumb  a:hover               {opacity: .6;}

#sec2 .list li h3                            {
 font-weight: lighter;
 font-size: 12px;
 line-height: 20px;
}

#sec3                                        {
 padding: 30px 0;
 background: rgba(72,0,0,.4);
}

#sec3 .list                                  {
 margin: 40px -24px 40px;
 overflow: hidden;
}

#sec3 .list li                               {
 float: left;
 width: 350px;
 padding: 0 40px;
 border-left: 1px solid #4a3333;
}
#sec3 .list li:first-child                   {
 width: 350px;
 padding: 0 40px;
 border-left: none;
}
#sec3 .list li .date                         {
 font-size: 12px;
 line-height: 20px;
 padding: 0 0 10px;
}
#sec3 .list li h3                            {
 font-weight: lighter;
 font-size: 13px;
 line-height: 20px;
}
#sec3 .list li h3 a                          {color: #fff;}

#sec3 .more                                  {
 padding: 0 0 15px;
 text-align: right;
 border-bottom: 1px solid #ad0608;
}

#sec3 .more a                                {
 font-family: 'DINE';
 font-size: 15px;
 line-height: 18px;
 color: #fff;
}

/*** #company config
----------------------------------------- ***/

#company table                               {
 width: 550px;
 margin: 115px auto 30px;
 border-collapse: collapse;
}

#company table th,
#company table td                            {
 padding: 30px;
 position: relative;
 font-weight: normal;
 font-size: 15px;
 line-height: 24px;
 border-collapse: collapse;
 border-bottom: 1px dotted #4d4d4d;
 vertical-align: top; 
}
#company table th                            {
 width: 150px;
 text-align: justify;
}

#company table th:before,
#company table td:before                     {
 display: block;
 position: absolute;
 left: 0;
}

#company table th:before                     {
 content: "";
 width: 23px;
 height: 37px;
 background: url(../img/article/company/th.png) no-repeat 0 0;
 top: 24px;
}

#company table td:before                     {
 content: "／";
 width: 1em;
 height: 24px;
}

#company table a                             {
 color: #fff;
}

/*** #privacy config
----------------------------------------- ***/

#privacy .entry                              {padding: 20px 0;}

#privacy .entry h3                           {
 margin: 40px 0 15px;
 padding: 8px 22px;
 position: relative;
 font-weight: normal;
 font-size: 17px;
 line-height: 24px;
 color: #fff;
 background: #b71c1e;
}

#privacy .entry p                            {
 margin: 0 0 1em;
 font-size: 13px;
 line-height: 20px;
}

#privacy .entry li                           {
 position: relative;
 font-size: 13px;
 line-height: 20px;
 padding-left: 1em;
}

#privacy .entry h3:before,
#privacy .entry li:before                    {
 display: block;
 position: absolute;
 left: 0;
}

#privacy .entry h3:before                    {
 content: "";
 width: 14px;
 height: 1px;
 margin-top: -1px;
 background: #fff;
 top: 50%;
}

#privacy .entry li:before                    {
 content: "・";
 width: 1em;
 height: 30px;
 top: 0;
}

/*** #goods config
----------------------------------------- ***/

#goods h3                                    {
 margin: 40px 0 30px;
 padding: 0 0 3px 25px;
 font-weight: normal;
 font-family: 'DINE';
 font-size: 55px;
 line-height: 55px;
 vertical-align: middle;
 clear: both;
 background: url(../img/article/h3.png) no-repeat 2px bottom;
}

#goods .list                                 {
 margin: 0 -12px;
 padding: 0 0 20px;
 overflow: hidden;
}

#goods .list li                              {
 float: left;
 width: 232px;
 margin: 0 12px;
 padding: 0 0 40px;
 text-align: center;
}

#goods .list li .thumb                       {
 width: 232px;
 height: 232px;
 margin: 0 0 20px;
 overflow: hidden;
 border: 3px solid #b71c1e;
 border-radius: 50%;
 background: url(../img/article/intro/sec2/li.png) no-repeat center center;
}

#goods .list li .thumb  a:hover              {opacity: .6;}

#goods .list li h4                           {
 font-weight: lighter;
 font-size: 12px;
 line-height: 20px;
}

#goods .entry                                {overflow: hidden;}

#goods .entry .gallery                       {
 float: left;
 width: 400px;
}
#goods .entry .gallery #view                 {
 height: 400px;
 margin: 0 auto 20px;
 overflow: hidden;
 border: 3px solid #b71c1e;
 border-radius: 50%;
}

#goods .entry .gallery #view p               {
 width: 100%;
 height: 100%;
}

#goods .entry .gallery #thumbBtn             {
 width: 100%;
 padding: 10px;
 letter-spacing: -.4em;
 position:relative;
 overflow: hidden;
 text-align: center;
}

#goods .entry .gallery #thumbBtn li         {
 width: 100px;
 height: 100px;
 margin: 0 10px;
 cursor: pointer;
 display: inline-block;
 *display: inline;
 *zoom: 1;
 letter-spacing: normal;
}
#goods .entry .gallery #thumbBtn li a        {
 width: 100%;
 height: 100%;
 display: block;
 overflow: hidden;
 border: 3px solid #b71c1e;
 border-radius: 50%;
}

#product .entry .gallery #thumbBtn li.active {opacity: .6;}

#goods .entry .caption                       {
 float: right;
 width: 556px;
 padding-top: 20px;
}

#goods .entry h4                             {
 padding: 0 25px 15px 0;
 position: relative;
 overflow: hidden;
 font-weight: normal;
 font-size: 22px;
 line-height: 30px;
 border-bottom: 1px solid #b71c1e;
 vertical-align: middle;
}

#goods table                                 {width: 100%;border-collapse: collapse;}

#goods table th,
#goods table td                              {
 padding: 10px 20px;
 position: relative;
 font-weight: normal;
 font-size: 12px;
 line-height: 20px;
 border-collapse: collapse;
 border-bottom: 1px solid #464646;
 vertical-align: top; 
}
#goods table th                              {
 width: 200px;
 background: #262626;
}

#goods .cart_button                         {
 width: 400px;
 margin: 30px auto;
 overflow: hidden;
 font-size: 16px;
 line-height: 30px;
 border-radius: 3px;
 text-align: center;
}
#goods .cart_button a                        {
 display: block;
 width: 100%;
 height: 100%;
 padding: 25px 0;
 color: #fff;
 background: rgb(223,43,46);
 background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2RmMmIyZSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiM5NDBkMGYiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
 background: -moz-linear-gradient(top,  rgba(223,43,46,1) 0%, rgba(148,13,15,1) 100%);
 background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(223,43,46,1)), color-stop(100%,rgba(148,13,15,1)));
 background: -webkit-linear-gradient(top,  rgba(223,43,46,1) 0%,rgba(148,13,15,1) 100%);
 background: -o-linear-gradient(top,  rgba(223,43,46,1) 0%,rgba(148,13,15,1) 100%);
 background: -ms-linear-gradient(top,  rgba(223,43,46,1) 0%,rgba(148,13,15,1) 100%);
 background: linear-gradient(to bottom,  rgba(223,43,46,1) 0%,rgba(148,13,15,1) 100%);
 filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#df2b2e', endColorstr='#940d0f',GradientType=0 );
 box-shadow: inset 0 0 8px rgba(255,255,255,.6);
}

#goods .banner                               {margin-bottom: 30px;}

#goods .banner a img                         {
 display: block;
 width: 100%;
 height: auto;
}

/*** #player config
----------------------------------------- ***/

#player .entry                               {
 padding: 40px 0 0;
 overflow: hidden;
}

#player .entry .thumb                        {
 float: left;
 width: 400px;
 height: 400px;
 margin: 0 0 20px;
 overflow: hidden;
 border: 3px solid #b71c1e;
 border-radius: 50%;
}

#player .entry .caption                      {
 float: right;
 width: 556px;
 padding-top: 40px;
}

#player .entry h3                            {
 padding: 0 25px 15px 0;
 position: relative;
 overflow: hidden;
 font-weight: normal;
 font-size: 34px;
 line-height: 40px;
 border-bottom: 1px solid #b71c1e;
 vertical-align: middle;
}

#player .entry h3 small                      {
 float: right;
 font-size: 12px;
 line-height: 40px;
}

#player table                                {width: 100%;}

#player table th,
#player table td                             {
 padding: 30px;
 position: relative;
 font-weight: normal;
 font-size: 15px;
 line-height: 24px;
 border-collapse: collapse;
 border-bottom: 1px dotted #4d4d4d;
 vertical-align: top; 
}
#player table th                             {
 width: 150px;
 text-align: justify;
}

#player table th:before,
#player table td:before                      {
 display: block;
 position: absolute;
 left: 0;
}

#player table th:before                      {
 content: "";
 width: 23px;
 height: 37px;
 background: url(../img/article/company/th.png) no-repeat 0 0;
 top: 24px;
}

#player table td:before                      {
 content: "／";
 width: 1em;
 height: 24px;
}


/** footer config
------------------------------------------ **/

footer                                       {height: 380px;position: absolute;left: 0;bottom: 0;border-top: 1px solid #808080;z-index: 3;}
footer .container                            {padding: 20px 0;}

footer nav                                   {width: 550px;float: left;}

footer nav > ul                              {
 height: 120px;
 margin: 10px -20px;
 overflow: hidden;
}

footer nav > ul > li                         {
 float: left;
 margin: 0 15px;
 font-family: 'DINE';
 font-size: 17px;
 line-height: 18px;
}

footer nav li a                              {
 color: #fff;
}

footer nav > ul > li:nth-of-type(n+3)        {

 height: 40%;
 text-align: center;
}

footer nav ul ul li                          {
 font-family: 'DINM';
 font-size: 12px;
 line-height: 18px;
}

footer .about                                {
 float: right;
 text-align: right;
}

footer .about                                {padding: 10px 0;overflow: hidden;}
footer .about ul                             {
 padding: 5px 0;
 letter-spacing: -.4em;
 text-align: right;
}

footer .about li                             {
 display: inline-block;
 letter-spacing: normal;
}

footer .about > ul:first-of-type li          {
 font-size: 18px;
 padding: 0 10px;
 border-left: 1px solid #4d4d4d;
 vertical-align: top;
}
footer .about > ul:first-of-type li a        {color: #fff;}
footer .about > ul:first-of-type li:first-child {
 padding-left: 0;
 border-left: none;
}
footer .about > ul:first-of-type li:last-child {
 padding-right: 0;
}

footer .about > ul:last-of-type  li          {
 font-size: 12px;
 line-height: 18px;
 padding: 3.5px 0;
}

footer .about > ul:last-of-type li:last-child a {
 padding-right: 0;
 border-right: none;
}
footer .about > ul:last-of-type li a         {
 color: #fff;
 border-right: 1px solid #fff;
 padding: 0 10px;
}

footer .copyright                            {
 font-family: 'DINM';
 font-size: 11px;
 line-height: 14px;
}

footer .pagetop                              {
 width: 45px;
 height: 85px;
 margin: 0 0 0 455px;
 position: absolute;
 left: 50%;
 top: -100px;
 z-index: 3;
}

footer .pagetop a                            {
 display: block;
 width: 100%;
 height: 100%;
 text-indent: 100%;
 white-space: nowrap;
 overflow: hidden;
 background: url(../img/footer/pagetop.png) no-repeat center center;
}

footer .logo                                {
 width: 100%;
 height: 220px;
 position: absolute;
 left: 0;
 bottom: 0;
 text-indent: 100%;
 white-space: nowrap;
 overflow: hidden;
 background: url(../img/footer/logo.png) repeat-x center center;
 border-top: 1px solid #808080;
}


/** bg config
------------------------------------------ **/

.animate                                     {position: absolute;z-index: 2;}

#bg01                                        {
 width: 898px;
 height: 734px;
 margin: 0 60px 0 0;
 right: 50%;
 top: 570px;
 background: url(../img/article/intro/bg01.png) no-repeat center center;
}

#bg02                                        {
 width: 1256px;
 height: 677px;
 margin: 0 0 0 -380px;
 left: 50%;
 bottom: 220px;
 background: url(../img/article/intro/bg02.png) no-repeat center center;
}
/** Off canvas config
------------------------------------------ **/

.open                                        {display: none;}

menu                                         {
 width: 240px;
 height: 100%;
 position: fixed;
 left: 0;
 top: 0;
 background: #ad0608;
 z-index: 1;
 display: none;
}

menu > div                                   {
 height: 100%;
 overflow-y: auto;
 overflow-x: hidden;
 -webkit-overflow-scrolling: touch;
 text-align: left;
 color: #333;
}

menu > div > ul                              {padding: 20px;}

menu ul li                                   {
 font-family: 'DINM';
 font-size: 12px;
 line-height: 20px;
 position: relative;
}

menu ul li a                                 {
 display: block;
 width: 100%;
 padding: 15px 0;
 color: #fff;
}

menu ul li a:hover                           {text-decoration: none;}

menu ul li:before,
menu ul li:after                             {
 display: block;
 content: "";
 width: 100%;
 height: 1px;
 position: absolute;
 left: 0;
}

menu ul li:after                             {bottom: 0;background: rgba(255,255,255,.15);}

menu ul h2                                   {
 font-family: 'DINM';
 font-size: 12px;
 line-height: 20px;
 padding: 15px;
 color: #fff;
 background: url(../img/menu/close.png) no-repeat 4px 20px;
}
menu ul h2.active                            {background: url(../img/menu/open.png) no-repeat 2px 23px;}

menu ul ul li                                {
 font-family: 'DINM';
 font-size: 12px;
 line-height: 20px;
 padding: 0 20px;
 position: relative;
}
menu ul ul li a                              {
 display: block;
 width: 100%;
 padding: 15px 30px;
 color: #fff;
}
menu ul ul li a:hover                        {text-decoration: none;}

menu ul ul li:before,
menu ul ul li:after                          {
 display: block;
 content: "";
 width: 100%;
 height: 1px;
 position: absolute;
 left: 0;
}
menu ul ul li:after                          {bottom: 0;background: rgba(255,255,255,.15);}

menu ul ul ul                                {padding: 0 0 0 30px;}
menu ul ul li a                              {
 display: block;
 width: 100%;
 padding: 15px 0;
 color: #fff;
}

menu ul ul li:last-of-type:before,
menu ul ul li:last-of-type:after             {display: none;}

#cover                                       {
 width: 100%;
 height: 100%;
 position: absolute;
 left: -1px;
 top: 0;
 display: none;
 z-index: 3;
 background: rgba(0,0,0,.6);
}

/** Slider config
------------------------------------------ **/

.slick-slider                                {
 position: relative;
 display: block;
 -moz-box-sizing: border-box;
      box-sizing: border-box;
 -webkit-user-select: none;
    -moz-user-select: none;
     -ms-user-select: none;
         user-select: none;
 -webkit-touch-callout: none;
 -khtml-user-select: none;
 -ms-touch-action: pan-y;
     touch-action: pan-y;
 -webkit-tap-highlight-color: transparent;
}

.slick-list                                  {
 position: relative;
 display: block;
 overflow: hidden;
 margin: 0;
 padding: 0;
}
.slick-list:focus                            {outline: none;}
.slick-list.dragging                         {cursor: pointer;cursor: hand;}

.slick-slider .slick-track,
.slick-slider .slick-list                    {
 -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
     -ms-transform: translate3d(0, 0, 0);
      -o-transform: translate3d(0, 0, 0);
         transform: translate3d(0, 0, 0);
}

.slick-track                                 {
 position: relative;
 top: 0;
 left: 0;
 display: block;
}
.slick-track:before,
.slick-track:after                           {display: table;content: '';}
.slick-track:after                           {clear: both;}
.slick-loading .slick-track                  {visibility: hidden;}

.slick-slide                                 {
 display: none;
 float: left;
 height: 100%;
 min-height: 1px;
}
[dir='rtl'] .slick-slide                     {float: right;}
.slick-slide img                             {display: block;}
.slick-slide.slick-loading img               {display: none;}
.slick-slide.dragging img                    {pointer-events: none;}
.slick-initialized .slick-slide              {display: block;}
.slick-loading .slick-slide                  {visibility: hidden;}
.slick-vertical .slick-slide                 {
 display: block;
 height: auto;
 border: 1px solid transparent;
}

.slick-prev,
.slick-next                                  {
 width: 25px;
 height: 40px;
 margin-top: -20px;
 cursor: pointer;
 position: absolute;
 top: 50%;
 text-indent: 100%;
 white-space: nowrap;
 overflow: hidden;
 border: none;
 outline: none;
 z-index: 3;
}
.slick-prev                                  {left: 110px;background: url(../img/slider/prev.png) no-repeat center center;}
.slick-next                                  {right: 110px;background: url(../img/slider/next.png) no-repeat center center;}

/** Web Font config
------------------------------------------ **/

@font-face{ 
 font-family: 'DINE';
 src: url('font/DINEngschriftStd.eot');
 src: url('font/DINEngschriftStd.eot?#iefix') format('embedded-opentype'),
   url('font/DINEngschriftStd.woff') format('woff'),
   url('font/DINEngschriftStd.ttf') format('truetype');
 font-weight: normal;
 font-style: normal;
}

@font-face{ 
 font-family: 'DINM';
 src: url('font/DINMittelschriftStd.eot');
 src: url('font/DINMittelschriftStd.eot?#iefix') format('embedded-opentype'),
   url('font/DINMittelschriftStd.woff') format('woff'),
   url('font/DINMittelschriftStd.ttf') format('truetype');
 font-weight: normal;
 font-style: normal;
}

/** other config
------------------------------------------ **/

a                                            {text-decoration: none;}
a:hover                                      {text-decoration: underline;}
ul                                           {list-style: none;}
pre                                          {font-family: 'Hiragino Kaku Gothic ProN',Meiryo;white-space: pre-wrap;word-wrap: break-word;overflow: auto;}
input[type="submit"]                         {-webkit-appearance: none;-webkit-border-radius: 0;}
img                                          {border: 0;max-width: 100%;line-height: 1.0em;vertical-align: bottom;-ms-interpolation-mode: bicubic;}
.naka                                        {text-align: center;}
.hidari                                      {float: left;margin: 0 15px 15px 0;}
.migi                                        {float: right;margin: 0 0 15px 15px;}
.thumb a                                     {display: block;width: 100%;height: 100%;}
.current a                                   {opacity: .5;}

article,
aside,
canvas,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
main,
nav,
section,
summary                                      {display:block;margin: 0;}

audio,canvas,video                           {display: inline-block;*display: inline;*zoom: 1;}
audio:not([controls])                        {display: none;} 
a:focus                                      {outline: thin dotted #333;outline: 5px auto -webkit-focus-ring-color;outline-offset: -2px;}
a:hover,a:active                             {outline: 0;}
sub,sup                                      {position: relative;font-size: 75%;line-height: 0;vertical-align: baseline;} 
sup                                          {top: -0.5em;}
sub                                          {bottom: -0.25em;}

/** Responsive config
------------------------------------------ **/

@media screen and (min-width: 0px)
              and (max-width: 1023px)        {

 #container,
 header,
 article,
 footer,
 .container                                  {width: 100%;max-width: 100%;min-width: 100%;}

/** header config
------------------------------------------ **/

 header                                      {padding: 20px 0;}

 header .container                           {padding: 0 20px;text-align: center;}
 header .about,
 header nav ul                               {display: none;}

 header nav                                  {height: auto;}
 header nav h1                               {
  width: 100%;
  height: 40px;
  margin: 0 ;
  position: relative;
  left: auto;
  bottom: auto;
 }

 header nav h1 a                             {
  background-size: auto 40px;
  background-position: center center;
 }


/** #slider config
------------------------------------------ **/

 #slider                                     {
  width: 100%;
  height: auto;
 }

 #slider ul                                  {
  width: 100%;
  height: auto;
  margin: 0;
  position: relative;
  left: auto;
 }

 #slider:before,
 #slider:after                               {
  display: none;
  width: 650px;
  margin: 0 0 0 -325px;
 }

 #slider:before                              {
  height: 40px;
  background-size: auto 57.5px;
  background-position: center bottom;
 }
 #slider:after                               {
  height: 60px;
  background-size: auto 60px;
 }

/** article config
------------------------------------------ **/

 article                                     {padding: 0;}
 article.intro                               {padding: 30px 0;}
 article .container                          {padding: 0 20px;}

 article.page h2                             {
  margin: 0 0 20px;
  padding: 50px 0;
  font-size: 35px;
  line-height: 40px;
  background: url(../img/article/h2.jpg) no-repeat center center;
 }

 article.page h2 small                       {font-size: 14px;}

 article.page h2:before,
 article.page h2:after                       {display: none;}

/*** #intro config
----------------------------------------- ***/

 #intro h2                                   {
  display: block;
  padding: 0 0 5px 25px;
  font-size: 30px;
  line-height: 40px;
  background: url(../img/article/intro/h2.png) no-repeat 2px bottom;
 }

 #intro h2 small                             {
  font-size: 14px;
  vertical-align: middle;
 }

 #sec1 .list                                 {
  margin: 0;
  padding: 10px 0;
  overflow: hidden;
 }

 #sec1 .list li                              {
  float: left;
  width: 50%;
  height: auto;
  margin: 0;
  padding: 10px;
 }
 #sec1 .list li a img                        {
  width: 100%;
  height: auto;
 }

 #sec2                                       {
  height: auto;
  margin: 0;
  background-image: none;
 }

 #sec2 .list                                 {
  margin: 0;
  letter-spacing: -.4em;
  overflow: hidden;
  text-align: center;
 }

 #sec2 .list li                              {
  margin: 0;
  padding: 0 0 20px;
  display: inline-block;
  float: none;
  letter-spacing: normal;
 }

 #sec2 .list li .thumb                       {
  width: 200px;
  height: 200px;
  margin: 0 auto 20px;
 }

 #sec3                                       {margin: 0;padding: 0 0 20px;}
 #sec3 .list                                 {margin: 0;}

 #sec3 .list li                              {
  float: none;
  width: 100%;
  padding: 20px 0;
  border-top: 1px solid #4a3333;
  border-left: none;
 }
 #sec3 .list li:first-of-type                {
  width: 100%;
  padding: 20px 0;
  border-top: none;
  border-left: none;
 }
 #sec3 .list li .date                        {
  font-size: 12px;
  line-height: 20px;
  padding: 0 0 10px;
 }

/*** #company config
----------------------------------------- ***/

 #company table                              {width: 100%;margin: 0 auto 30px;}
 #company table tr                           {display: block;}
 #company table th,
 #company table td                           {display: list-item;width: 100%;list-style: none;}
 #company table th                           {padding: 20px 0 5px 30px;text-align: left;border: none;}
 #company table td                           {padding: 5px 0 20px 30px;}

 #company table th:before                    {
  width: 30px;
  height: 30px;
  top: 18px;
  background-size: auto 30px;
 }
 #company table td:before                    {display: none;}

/*** #privacy config
----------------------------------------- ***/

 #privacy .entry                             {padding: 0 0 30px;}

/*** #goods config
----------------------------------------- ***/

 #goods h3                                   {
  display: block;
  padding: 0 0 5px 25px;
  font-size: 30px;
  line-height: 40px;
 }

 #goods .list                                {
  margin: 0;
  letter-spacing: -.4em;
  overflow: hidden;
 }

 #goods .list li                             {
  display: inline-block;
  float: none;
  width: 100%;
  margin: 0;
  padding: 0 0 40px;
  letter-spacing: normal;
  text-align: center;
 }

 #goods .list li .thumb                      {
  width: 280px;
  height: 280px;
  margin: 0 auto 20px;
 }


#goods .entry .gallery                       {
 float: none;
 width: 280px;
 margin: 0 auto 20px;
}
#goods .entry .gallery #view                 {
 height: 280px;
 margin: 0 0 10px;
}

#goods .entry .gallery #view p               {
 width: 100%;
 height: 100%;
}

#goods .entry .gallery #thumbBtn li         {
 width: 76px;
 height: 76px;
 margin: 0 5px;
 cursor: pointer;
 display: inline-block;
 *display: inline;
 *zoom: 1;
 letter-spacing: normal;
}

 #goods .entry .thumb                        {
  float: none;
  width: 280px;
  height: 280px;
  margin: 0 auto 20px;
  overflow: hidden;
  border: 3px solid #b71c1e;
  border-radius: 50%;
 }

 #goods .entry .caption                      {
  float: none;
  width: 100%;
  padding-top: 0;
 }

 #goods .entry h4                            {
  padding: 0 25px 15px 0;
  position: relative;
  overflow: hidden;
  font-weight: normal;
  font-size: 22px;
  line-height: 30px;
  border-bottom: 1px solid #b71c1e;
  vertical-align: middle;
 }

 #goods table                                {width: 100%;margin: 0 auto;}
 #goods table tr                             {display: block;}
 #goods table th,
 #goods table td                             {display: list-item;width: 100%;list-style: none;}
 #goods table th                             {padding: 10px 0 5px;text-align: left;border: none;background: none;}
 #goods table td                             {padding: 5px 1em 10px;border-bottom: 1px dotted #464646;}

 #goods .cart_button                         {
  width: 100%;
  margin: 30px auto;
  overflow: hidden;
  font-size: 16px;
  line-height: 30px;
  border-radius: 3px;
  text-align: center;
 }

 #goods .cart_button a                       {
  display: block;
  width: 100%;
  height: 100%;
  padding: 15px 0;
 }

/*** #player config
----------------------------------------- ***/

 #player .entry                              {
  padding: 40px 0 0;
  overflow: hidden;
 }

 #player .entry .thumb                       {
  float: none;
  width: 280px;
  height: 280px;
 }

 #player .entry .caption                     {
  float: none;
  width: 100%;
  padding-top: 0;
 }

 #player .entry h3 small                     {
  float: none;
  display: block;
  font-size: 12px;
  line-height: 20px;
 }
 #player table                               {width: 100%;margin: 0 auto 30px;}
 #player table tr                            {display: block;}
 #player table th,
 #player table td                            {display: list-item;width: 100%;list-style: none;}
 #player table th                            {padding: 20px 0 5px 30px;text-align: left;border: none;}
 #player table td                            {padding: 5px 0 20px 30px;}

 #player table th:before                     {
  width: 30px;
  height: 30px;
  top: 18px;
  background-size: auto 30px;
 }
 #player table td:before                     {display: none;}

/** footer config
------------------------------------------ **/

 footer                                      {height: auto;position: relative;left: auto;bottom: auto;}
 footer nav                                  {display: none;}

 footer .about                               {float: none;text-align: center;}
 footer .about                               {padding: 10px 0;}
 footer .about ul                            {text-align: center;}
 footer .about > ul:first-of-type li         {padding: 0 10px;}
 footer .about > ul:first-of-type li:first-child  {padding-left: 0;border-left: none;}
 footer .about > ul:first-of-type li:last-child   {padding-right: 10px;}
 footer .about > ul:last-of-type  li:last-child a {padding-right: 10px;}

 footer .logo                                {
  width: 100%;
  height: 110px;
  position: relative;
  left: auto;
  bottom: auto;
  background-size: auto 110px;
 }

/** other config
------------------------------------------ **/

 .slick-prev                                 {left: 20px;}
 .slick-next                                 {right: 20px;}

 .open                                       {
  width: 100%;
  position: fixed;
  left: 0;
  top: 0;
  display: block;
  text-align: left;
  color: #fff;
  border-top: 4px solid #ad0608;
  z-index: 100;
 }
 .open a                                     {
  display: block;
  width: 50px;
  padding: 4px 0 2px;
  font-size: 18px;
  line-height: 44px;
  position: absolute;
  top: -4px;
  left: 10px;
  text-decoration: none;
  text-align: center;
  background: #ad0608;
  box-shadow: 0 0 3px rgba(0,0,0,05)
 }

}


/** 全体のリンクテキスト色指定
------------------------------------------ **/

a:link { color: #ffffff; }
a:visited { color: #ffffff; }
a:hover { color: #ffffff; }
a:active { color: #ffffff; }



/*アパレルページ tableデザイン
------------------------------------------ **/


/** worksページ css
------------------------------------------ **/


/** testページ css
------------------------------------------ **/

#works_content {
	margin-top:50px;
}

/** 20190627.html ページ css
------------------------------------------ **/
.outer{
  text-align: center;
  max-width: 650px;
	margin: 0 auto;
}
.inner{
  text-align: left;
  font-size: 14px;
  line-height: 24px;
}

.info_title{
  text-align: center;
  font-size: 20px;
  padding: 18px;
}

.top_info{
	width: 100%;
	background: #FFF;
  text-align: center;
  font-size: 16px;
  padding: 10px;
  margin-bottom: 15px;
}

.top_info a{
  text-decoration: none;
  color:#000;
}

.top_info a:hover{
  text-decoration: none;
  color:#999;
}


/** Responsive smartphone config
------------------------------------------ **/

@media screen and (min-width: 0px)
              and (max-width: 767px)         {

}

/** Responsive tablet config
------------------------------------------ **/

@media screen and (min-width: 768px)
              and (max-width: 1023px)        {

}
